WebDev/mind-overflow-website-ghost-theme
1
0
Fork 0
Code Issues 2 Pull Requests Releases Wiki Activity

Compare commits

merge into: WebDev:main
Branches Tags
WebDev:main
WebDev:body-flexbox
...
pull from: WebDev:body-flexbox
Branches Tags
WebDev:main
WebDev:body-flexbox

2 Commits
main ... body-flexb

Author SHA1 Message Date
Lorenzo Dellacà
e02bcc07fd Remove useless newline 2020-11-05 01:36:18 +01:00
Lorenzo Dellacà
6714c6039c Make whole body a flex container 
This is used so that we can make <main> take all the remaining space.
This is "needed" because some pages (such as /tags/) don't have enough content to fill the whole height, making the footer appear in the middle of the page.
 2020-11-05 01:04:12 +01:00
1 changed files with 5 additions and 2 deletions
Show Stats Expand all files Collapse all files

7
assets/css/screen.css
View File

@ -48,6 +48,8 @@ html, body {
margin: 0; margin: 0;
padding: 0; padding: 0;
height: 100%; height: 100%;
display: flex;
flex-flow: column;
font-size: 20px; font-size: 20px;
line-height: 1.6; line-height: 1.6;
@ -134,6 +136,7 @@ Used to define how every page is displayed.
*/ */
main { main {
flex: 1;
display: block; display: block;
box-sizing: border-box; box-sizing: border-box;
width: 100%; width: 100%;
@ -340,7 +343,7 @@ Used to style the index/homepage.
*/ */
.mind-index-header_main { .mind-index-header_main {
height: 100%; flex: 0 0 100%;
width: 100%; width: 100%;
margin: auto; margin: auto;
display: flex; display: flex;
@ -618,7 +621,7 @@ instead of pages ".mind-page*".
*/ */
.mind-post-header { .mind-post-header {
height: 400px; flex: 0 0 400px;
width: 100%; width: 100%;
display: flex; display: flex;
flex-direction: column; flex-direction: column;