blog/Blog
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat(style): actually make the footer properly stick to bottom of page

Browse Source
This commit is contained in:
Price Hiller 2023-08-29 15:09:59 -05:00
parent b6baa6116e
commit 18674ffab4
Signed by: Price
SSH Key Fingerprint: SHA256:Y4S9ZzYphRn1W1kbJerJFO6GGsfu9O70VaBSxJO7dF8
1 changed files with 12 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
assets/style/style.css
View File

@ -59,6 +59,7 @@
* webpage was too narrow (Mobile devices). */ * webpage was too narrow (Mobile devices). */
html, html,
body { body {
height: 100%;
overflow-x: hidden; overflow-x: hidden;
padding: 0; padding: 0;
margin: 0; margin: 0;
@ -67,16 +68,23 @@ body {
html { html {
background-color: var(--sumiInk0); background-color: var(--sumiInk0);
color: var(--fujiWhite); color: var(--fujiWhite);
display: flex;
flex-direction: column;
align-items: center;
} }
body { body {
min-height: 100vh;
padding-top: var(--navbar-height); padding-top: var(--navbar-height);
line-height: 1.6; line-height: 1.8;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
margin-top: 30px; margin-top: 30px;
height: 100%;
}
p {
max-width: min(700px, 90vw);
} }
.footer-link-items { .footer-link-items {
@ -91,8 +99,9 @@ footer {
align-items: center; align-items: center;
justify-content: center; justify-content: center;
background-color: var(--waveBlue1); background-color: var(--waveBlue1);
height: 100px;
margin-top: auto; margin-top: auto;
min-height: 80px;
align-self: flex-start;
width: 100vw; width: 100vw;
} }