Style fixes and gitignore

This commit is contained in:
hugo 2023-10-03 21:56:20 +02:00
parent 05bc3112d6
commit 20db73836c
2 changed files with 21 additions and 10 deletions

1
.gitignore vendored Normal file
View File

@ -0,0 +1 @@
__pycacahe__/*

View File

@ -1,9 +1,9 @@
:root { :root {
--border-radus: 1rem; --border-radus: 1rem;
--background: #EEE; --background: #F9F9F9;
--header-background: #DDD; --header-background: #EEE;
--header-height: 3rem; --header-height: 3rem;
--input-bar-height: 2rem; --input-bar-height: 3rem;
} }
body{ body{
@ -14,14 +14,13 @@ body{
} }
main { main {
max-width: 400px;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-self: flex-start; align-self: flex-start;
gap: 1rem; gap: 1rem;
margin: 0 auto; margin: 0 auto;
padding: 1rem 0.5rem; padding: 2rem 0.5rem;
height: calc(100vh - 5rem); height: calc(100vh - var(--header-height) - var(--input-bar-height));
overflow-y: scroll; overflow-y: scroll;
box-sizing: border-box; box-sizing: border-box;
} }
@ -30,22 +29,25 @@ header {
background-color: var(--header-background); background-color: var(--header-background);
display: flex; display: flex;
flex-direction: row; flex-direction: row;
padding: 1rem; align-items: center;
padding: 0 1rem;
gap: 1rem; gap: 1rem;
font-weight: bold; font-weight: bold;
width: 100vw; width: 100vw;
height: var(header-height); height: var(--header-height);
box-sizing: border-box; box-sizing: border-box;
} }
footer { footer {
width: 100vw; width: 100vw;
height: var(input-bar-height); height: var(--input-bar-height);
background-color: #FDD; background-color: var(--background);
display: flex; display: flex;
flex-direction: row; flex-direction: row;
align-items: center;
padding: 0 1rem; padding: 0 1rem;
box-sizing: border-box; box-sizing: border-box;
gap: 1rem;
} }
.request { .request {
@ -68,3 +70,11 @@ footer {
align-self: center; align-self: center;
margin-top: 0.5rem; margin-top: 0.5rem;
} }
.textbox{
background-color: var(--header-background);
width: 80%;
height: 1rem;
padding: 0.2rem;
border-radius: 2rem;
}