diff --git a/quartz/components/styles/toc.scss b/quartz/components/styles/toc.scss index 512b01d..3b2b6b3 100644 --- a/quartz/components/styles/toc.scss +++ b/quartz/components/styles/toc.scss @@ -74,6 +74,7 @@ button#toc { } > ul.overflow { max-height: none; + width: 100%; } @for $i from 0 through 6 { diff --git a/quartz/styles/base.scss b/quartz/styles/base.scss index 9cf8cc9..61c918f 100644 --- a/quartz/styles/base.scss +++ b/quartz/styles/base.scss @@ -190,7 +190,7 @@ a { & .sidebar.left { z-index: 1; - grid-area: sidebar-left; + grid-area: grid-sidebar-left; flex-direction: column; @media all and ($mobile) { gap: 0; @@ -205,7 +205,7 @@ a { } & .sidebar.right { - grid-area: sidebar-right; + grid-area: grid-sidebar-right; margin-right: 0; flex-direction: column; @media all and ($mobile) { @@ -232,7 +232,7 @@ a { } & .page-header { - grid-area: page-header; + grid-area: grid-header; margin: $topSpacing 0 0 0; @media all and ($mobile) { margin-top: 0; @@ -241,11 +241,11 @@ a { } & .center > article { - grid-area: page-center; + grid-area: grid-center; } - & .page-footer { - grid-area: page-footer; + & footer { + grid-area: grid-footer; } & .center, diff --git a/quartz/styles/variables.scss b/quartz/styles/variables.scss index 3ac5a8b..9335e55 100644 --- a/quartz/styles/variables.scss +++ b/quartz/styles/variables.scss @@ -27,11 +27,11 @@ $mobileGrid: ( rowGap: "5px", columnGap: "5px", templateAreas: - '"sidebar-left"\ - "page-header"\ - "page-center"\ - "sidebar-right"\ - "page-footer"', + '"grid-sidebar-left"\ + "grid-header"\ + "grid-center"\ + "grid-sidebar-right"\ + "grid-footer"', ); $tabletGrid: ( templateRows: "auto auto auto auto", @@ -39,10 +39,10 @@ $tabletGrid: ( rowGap: "5px", columnGap: "5px", templateAreas: - '"sidebar-left page-header"\ - "sidebar-left page-center"\ - "sidebar-left sidebar-right"\ - "sidebar-left page-footer"', + '"grid-sidebar-left grid-header"\ + "grid-sidebar-left grid-center"\ + "grid-sidebar-left grid-sidebar-right"\ + "grid-sidebar-left grid-footer"', ); $desktopGrid: ( templateRows: "auto auto auto", @@ -50,7 +50,7 @@ $desktopGrid: ( rowGap: "5px", columnGap: "5px", templateAreas: - '"sidebar-left page-header sidebar-right"\ - "sidebar-left page-center sidebar-right"\ - "sidebar-left page-footer sidebar-right"', + '"grid-sidebar-left grid-header grid-sidebar-right"\ + "grid-sidebar-left grid-center grid-sidebar-right"\ + "grid-sidebar-left grid-footer grid-sidebar-right"', );