feat: footer at bottom thanks to main
This commit is contained in:
parent
3a0fe3c342
commit
c29e6ef16f
@ -16,6 +16,11 @@ a {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/*Main content (between header and footer)*/
|
||||||
|
body > main {
|
||||||
|
min-height: calc(100vh - ((3.2rem + 2*0.75rem) + 6rem) + 1px);
|
||||||
|
}
|
||||||
|
|
||||||
header {
|
header {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: row;
|
flex-direction: row;
|
||||||
@ -26,6 +31,7 @@ header {
|
|||||||
|
|
||||||
background-color: var(--background);
|
background-color: var(--background);
|
||||||
color: var(--accent);
|
color: var(--accent);
|
||||||
|
height: 2rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
header > form {
|
header > form {
|
||||||
@ -33,7 +39,7 @@ header > form {
|
|||||||
flex-direction: row;
|
flex-direction: row;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
gap: 8px;
|
gap: 8px;
|
||||||
padding: 4px 8px;
|
padding: 2px 8px;
|
||||||
border: solid 2px var(--accent);
|
border: solid 2px var(--accent);
|
||||||
border-radius: var(--radius);
|
border-radius: var(--radius);
|
||||||
|
|
||||||
@ -54,3 +60,16 @@ header > form {
|
|||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
footer {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
width: 100vw;
|
||||||
|
height: 6rem;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
background: hsl(200, 5%, 85%);
|
||||||
|
&>p{
|
||||||
|
font-size: large;
|
||||||
|
}
|
||||||
|
}
|
@ -28,8 +28,9 @@
|
|||||||
</header>
|
</header>
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
||||||
|
<main>
|
||||||
{% block body %}{% endblock %}
|
{% block body %}{% endblock %}
|
||||||
|
</main>
|
||||||
|
|
||||||
|
|
||||||
{% block footer %}
|
{% block footer %}
|
||||||
|
Loading…
Reference in New Issue
Block a user