From e7d6404ab184a5f6a8645bd0ac90b3676b8c5efc Mon Sep 17 00:00:00 2001 From: Volpeon Date: Fri, 25 Dec 2020 13:22:37 +0100 Subject: Improved CSS definitions, more fine-grained content build script --- assets/css/scopes/_page.scss | 76 ++++++++++++++++++++++++++------------------ 1 file changed, 45 insertions(+), 31 deletions(-) (limited to 'assets/css/scopes') diff --git a/assets/css/scopes/_page.scss b/assets/css/scopes/_page.scss index 4a97b79..21d49d0 100644 --- a/assets/css/scopes/_page.scss +++ b/assets/css/scopes/_page.scss @@ -1,8 +1,12 @@ .s-page { - padding-left: $page-item-prefix-width; + font-size: px-to-em($content-font-size); - > :first-child { - margin-top: 0; + &__content { + padding-left: $page-item-prefix-width; + + > :first-child { + margin-top: 0; + } } h1, @@ -22,25 +26,20 @@ padding-right: $page-item-prefix-pad; width: $page-item-prefix-width; color: var(--page-item-prefix-fg); - font-size: 1rem; font-weight: normal; text-align: right; } + } - @media (max-width: $breakpoint-sm) { - margin-left: 0; - padding-left: 0; + h1 { + font-size: px-to-em($content-h1-font-size, $content-font-size); - &::before { - display: none; - } + &::before { + content: "#"; + font-size: px-to-em($content-font-size, $content-h1-font-size); } } - h1::before { - content: "#"; - } - h2::before { content: "##"; } @@ -53,12 +52,16 @@ content: "|>"; } - pre::before { - content: str-repeat("``\A", 40); - height: 100%; - color: var(--page-item-prefix-fg); - overflow: hidden; - line-height: $code-block-line-height * ($code-block-font-size / $font-size); + pre { + font-size: px-to-em($font-size, $content-font-size); + + &::before { + content: str-repeat("``\A", 40); + height: 100%; + color: var(--page-item-prefix-fg); + overflow: hidden; + line-height: $code-block-line-height; + } } hr { @@ -72,26 +75,37 @@ &::after { margin-left: -1 * $page-item-prefix-width; } + } + + @media (max-width: map-get($breakpoints, "sm")) { + &__content { + padding-left: 0; + } - @media (max-width: $breakpoint-sm) { + h1, + h2, + h3, + .c-refs__item, + pre { margin-left: 0; padding-left: 0; - &::after { - margin-left: 0; + &::before { + display: none; } } - } - - .c-nav { - margin-left: -1 * $page-item-prefix-width; - @media (max-width: $breakpoint-sm) { + hr { margin-left: 0; } - } - @media (max-width: $breakpoint-sm) { - padding-left: 0; + .c-page-header { + margin-left: 0; + padding-left: 0; + + &::after { + margin-left: 0; + } + } } } -- cgit v1.2.3-70-g09d2