From ad478954cf77842364d03e1d5ee85e366e699ee7 Mon Sep 17 00:00:00 2001 From: Volpeon Date: Thu, 7 Jan 2021 08:50:48 +0100 Subject: Improved general structure, resolve category name in metadata filter, added hideable nav items, added header for page layout --- assets/css/components/_hero.scss | 34 +++++++++++++++++++++++++++++++++ assets/css/components/_page-header.scss | 34 --------------------------------- assets/css/components/_page.scss | 14 ++++++++++++++ assets/css/style.scss | 2 +- 4 files changed, 49 insertions(+), 35 deletions(-) create mode 100644 assets/css/components/_hero.scss delete mode 100644 assets/css/components/_page-header.scss (limited to 'assets') diff --git a/assets/css/components/_hero.scss b/assets/css/components/_hero.scss new file mode 100644 index 0000000..7fa79e1 --- /dev/null +++ b/assets/css/components/_hero.scss @@ -0,0 +1,34 @@ +.c-hero { + margin-bottom: $line-height * 2em; + margin-left: -1 * $page--item-prefix--width; + padding-left: $page--item-prefix--width; + overflow: hidden; + + &::after { + content: str-repeat('░', 120); + display: block; + position: relative; + z-index: -10; + height: $line-height; + margin-top: px-to-em(2px); + margin-left: -1 * $page--item-prefix--width; + padding-top: px-to-em(2px); + border-top: 1px solid var(--fg-hi); + color: var(--fg-hi); + line-height: $code-block--line-height; + } + + &__pre { + margin-top: 0; + overflow: hidden; + } + + @media (max-width: map-get($breakpoints, 'sm')) { + margin-left: 0; + padding-left: 0; + + &::after { + margin-left: 0; + } + } +} diff --git a/assets/css/components/_page-header.scss b/assets/css/components/_page-header.scss deleted file mode 100644 index e97aaf7..0000000 --- a/assets/css/components/_page-header.scss +++ /dev/null @@ -1,34 +0,0 @@ -.c-page-header { - margin-bottom: $line-height * 2em; - margin-left: -1 * $page--item-prefix--width; - padding-left: $page--item-prefix--width; - overflow: hidden; - - &::after { - content: str-repeat('░', 120); - display: block; - position: relative; - z-index: -10; - height: $line-height; - margin-top: px-to-em(2px); - margin-left: -1 * $page--item-prefix--width; - padding-top: px-to-em(2px); - border-top: 1px solid var(--fg-hi); - color: var(--fg-hi); - line-height: $code-block--line-height; - } - - &__pre { - margin-top: 0; - overflow: hidden; - } - - @media (max-width: map-get($breakpoints, 'sm')) { - margin-left: 0; - padding-left: 0; - - &::after { - margin-left: 0; - } - } -} diff --git a/assets/css/components/_page.scss b/assets/css/components/_page.scss index bccf069..ce67f7e 100644 --- a/assets/css/components/_page.scss +++ b/assets/css/components/_page.scss @@ -1,4 +1,18 @@ .c-page { + &__header { + margin-bottom: $line-height * 1em; + + &__title { + margin-top: 0; + } + + &__meta { + margin-top: 0; + color: var(--fg-hi); + font-weight: normal; + } + } + &__content { padding-left: $page--item-prefix--width; diff --git a/assets/css/style.scss b/assets/css/style.scss index e89cbd6..9f3bb31 100644 --- a/assets/css/style.scss +++ b/assets/css/style.scss @@ -6,7 +6,7 @@ @import 'components/hlist'; @import 'components/nav'; @import 'components/page'; -@import 'components/page-header'; +@import 'components/hero'; @import 'layouts/container'; -- cgit v1.2.3-54-g00ecf