From 70cee0c7f39e95a7375da52d1821cb37ab0ebd49 Mon Sep 17 00:00:00 2001 From: Gabriel Arazas Date: Sun, 9 Jul 2023 11:55:57 +0800 Subject: [PATCH] docs/site: convert CSS grid to "simpler" solution It's "simpler" because it doesn't use CSS grid but I think CSS grid is simpler though. --- docs/assets/scss/extend.scss | 30 +++++++++++++++++++++++------ docs/layouts/_default/baseof.html | 10 +++++----- docs/layouts/partials/chapters.html | 1 + 3 files changed, 30 insertions(+), 11 deletions(-) diff --git a/docs/assets/scss/extend.scss b/docs/assets/scss/extend.scss index 343adf16..2899492e 100644 --- a/docs/assets/scss/extend.scss +++ b/docs/assets/scss/extend.scss @@ -1,12 +1,9 @@ :root { --gap: 1rem; + --sidebar-width: 300px; } body { - display: grid; - grid-template-columns: [sidebar] 1fr [content] 3fr; - grid-gap: var(--gap); - overflow: hidden; padding: 0; margin: 0; @@ -16,14 +13,35 @@ body { } .book.sidebar { - padding: 0 var(--gap); + margin: 0; + padding: var(--gap); + background: var(--base01); + height: 100vh; overflow-y: auto; - resize: horizontal; + outline: none; + + position: fixed; + top: 0; + left: 0; + width: var(--sidebar-width); + + & ul, & ol { + padding-left: 1em; + } } .book.content { padding: var(--gap); overflow-y: auto; + margin: 0 auto; + margin-left: var(--sidebar-width); + + max-width: var(--content-width); +} + +.site__toc-header { + font-size: 1.25em; + font-weight: bold; } article h1 { diff --git a/docs/layouts/_default/baseof.html b/docs/layouts/_default/baseof.html index da64c0ec..a1a714a3 100644 --- a/docs/layouts/_default/baseof.html +++ b/docs/layouts/_default/baseof.html @@ -4,14 +4,14 @@ {{- partial "head.html" . -}} -