Move footer to bottom of viewport

This commit is contained in:
Svilen Markov
2024-08-05 12:00:20 +01:00
parent 64256f2638
commit 3b2a9fedef
2 changed files with 50 additions and 33 deletions

View File

@@ -311,6 +311,10 @@ html {
scroll-behavior: smooth;
}
html, body {
height: 100%;
}
a {
text-decoration: none;
color: inherit;
@@ -424,6 +428,7 @@ kbd:active {
.content-bounds {
max-width: 1600px;
width: 100%;
margin-inline: auto;
padding: 0 var(--content-bounds-padding);
}
@@ -654,7 +659,7 @@ kbd:active {
}
.footer {
margin-block: calc(var(--widget-gap) * 1.5);
padding-block: calc(var(--widget-gap) * 1.5);
animation: loadingContainerEntrance 200ms backwards;
animation-delay: 150ms;
}
@@ -1227,8 +1232,14 @@ kbd:active {
}
}
body {
padding-bottom: calc(var(--mobile-navigation-height) + var(--content-bounds-padding));
.mobile-navigation-offset {
height: var(--mobile-navigation-height);
margin-top: var(--widget-gap);
flex-shrink: 0;
}
.footer + .mobile-navigation-offset {
margin-top: 0;
}
.mobile-navigation {
@@ -1431,6 +1442,7 @@ kbd:active {
.shrink-0 { flex-shrink: 0; }
.min-width-0 { min-width: 0; }
.max-width-100 { max-width: 100%; }
.height-100 { height: 100%; }
.block { display: block; }
.inline-block { display: inline-block; }
.overflow-hidden { overflow: hidden; }
@@ -1462,6 +1474,7 @@ kbd:active {
.margin-top-7 { margin-top: 0.7rem; }
.margin-top-10 { margin-top: 1rem; }
.margin-top-15 { margin-top: 1.5rem; }
.margin-top-auto { margin-top: auto; }
.margin-block-3 { margin-block: 0.3rem; }
.margin-block-5 { margin-block: 0.5rem; }
.margin-block-7 { margin-block: 0.7rem; }