yuriy/quartz-website
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(layout): restore footer to the proper position (#1470)

Browse Source 
* fix(layout): restore footer to the proper position

* align ToC scrollbar properly on short headers
This commit is contained in:
Emile Bangma
2024-10-01 17:49:13 +02:00
committed by GitHub
parent 1b122a1da0
commit b0c079f24a
3 changed files with 19 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
quartz/components/styles/toc.scss
View File

@@ -74,6 +74,7 @@ button#toc {
} }
> ul.overflow { > ul.overflow {
max-height: none; max-height: none;
width: 100%;
} }
@for $i from 0 through 6 { @for $i from 0 through 6 {

12
quartz/styles/base.scss
View File

@@ -190,7 +190,7 @@ a {
& .sidebar.left { & .sidebar.left {
z-index: 1; z-index: 1;
grid-area: sidebar-left; grid-area: grid-sidebar-left;
flex-direction: column; flex-direction: column;
@media all and ($mobile) { @media all and ($mobile) {
gap: 0; gap: 0;
@@ -205,7 +205,7 @@ a {
} }
& .sidebar.right { & .sidebar.right {
grid-area: sidebar-right; grid-area: grid-sidebar-right;
margin-right: 0; margin-right: 0;
flex-direction: column; flex-direction: column;
@media all and ($mobile) { @media all and ($mobile) {
@@ -232,7 +232,7 @@ a {
} }
& .page-header { & .page-header {
grid-area: page-header; grid-area: grid-header;
margin: $topSpacing 0 0 0; margin: $topSpacing 0 0 0;
@media all and ($mobile) { @media all and ($mobile) {
margin-top: 0; margin-top: 0;
@@ -241,11 +241,11 @@ a {
} }
& .center > article { & .center > article {
grid-area: page-center; grid-area: grid-center;
} }
& .page-footer { & footer {
grid-area: page-footer; grid-area: grid-footer;
} }
& .center, & .center,

24
quartz/styles/variables.scss
View File

@@ -27,11 +27,11 @@ $mobileGrid: (
rowGap: "5px", rowGap: "5px",
columnGap: "5px", columnGap: "5px",
templateAreas: templateAreas:
'"sidebar-left"\ '"grid-sidebar-left"\
"page-header"\ "grid-header"\
"page-center"\ "grid-center"\
"sidebar-right"\ "grid-sidebar-right"\
"page-footer"', "grid-footer"',
); );
$tabletGrid: ( $tabletGrid: (
templateRows: "auto auto auto auto", templateRows: "auto auto auto auto",
@@ -39,10 +39,10 @@ $tabletGrid: (
rowGap: "5px", rowGap: "5px",
columnGap: "5px", columnGap: "5px",
templateAreas: templateAreas:
'"sidebar-left page-header"\ '"grid-sidebar-left grid-header"\
"sidebar-left page-center"\ "grid-sidebar-left grid-center"\
"sidebar-left sidebar-right"\ "grid-sidebar-left grid-sidebar-right"\
"sidebar-left page-footer"', "grid-sidebar-left grid-footer"',
); );
$desktopGrid: ( $desktopGrid: (
templateRows: "auto auto auto", templateRows: "auto auto auto",
@@ -50,7 +50,7 @@ $desktopGrid: (
rowGap: "5px", rowGap: "5px",
columnGap: "5px", columnGap: "5px",
templateAreas: templateAreas:
'"sidebar-left page-header sidebar-right"\ '"grid-sidebar-left grid-header grid-sidebar-right"\
"sidebar-left page-center sidebar-right"\ "grid-sidebar-left grid-center grid-sidebar-right"\
"sidebar-left page-footer sidebar-right"', "grid-sidebar-left grid-footer grid-sidebar-right"',
); );