diff options
author | Karl Hallsby <karl@hallsby.com> | 2020-09-27 14:31:36 -0500 |
---|---|---|
committer | Karl Hallsby <karl@hallsby.com> | 2020-09-27 14:32:00 -0500 |
commit | 61b34a5f260db45575d448d766ea29c0fb273ed3 (patch) | |
tree | 4ac84fa917df0c69fb0fc6d587750514e7d0d813 /_sass/layout | |
parent | c3cafe3c3817f52d4c588b5b0d6e71e07e06145e (diff) |
Add jekyll-text-theme YAML files
Diffstat (limited to '_sass/layout')
-rw-r--r-- | _sass/layout/_404.scss | 14 | ||||
-rw-r--r-- | _sass/layout/_archive.scss | 5 | ||||
-rw-r--r-- | _sass/layout/_article.scss | 29 | ||||
-rw-r--r-- | _sass/layout/_articles.scss | 17 | ||||
-rw-r--r-- | _sass/layout/_base.scss | 6 | ||||
-rw-r--r-- | _sass/layout/_home.scss | 15 | ||||
-rw-r--r-- | _sass/layout/_landing.scss | 23 | ||||
-rw-r--r-- | _sass/layout/_page.scss | 165 |
8 files changed, 274 insertions, 0 deletions
diff --git a/_sass/layout/_404.scss b/_sass/layout/_404.scss new file mode 100644 index 0000000..e206f76 --- /dev/null +++ b/_sass/layout/_404.scss @@ -0,0 +1,14 @@ +.layout--404 { + .sign { + display: table; + margin: map-get($spacers, 4) auto; + margin-top: map-get($spacers, 5); + h1 { + font-size: map-get($base, font-size-xl) * 4; + line-height: 1; + } + p { + font-size: map-get($base, font-size-xl) * 1.2; + } + } +} diff --git a/_sass/layout/_archive.scss b/_sass/layout/_archive.scss new file mode 100644 index 0000000..7dc417f --- /dev/null +++ b/_sass/layout/_archive.scss @@ -0,0 +1,5 @@ +.layout--archive { + & > .layout--archive__result { + margin: map-get($spacers, 4) 0; + } +} diff --git a/_sass/layout/_article.scss b/_sass/layout/_article.scss new file mode 100644 index 0000000..dd83384 --- /dev/null +++ b/_sass/layout/_article.scss @@ -0,0 +1,29 @@ +.article__sharing { + margin: map-get($spacers, 4) 0; +} +.article__section-navigator { + padding-top: map-get($spacers, 3); + margin: map-get($spacers, 4) 0 map-get($spacers, 3) 0; + word-wrap: break-word; + @include split-line(top, 4px); + & > .previous, & > .next { + width: 50%; + & > span { + font-weight: map-get($base, font-weight-bold); + color: $text-color-l; + } + & > a { + display: block; + @include link-colors($text-color, $main-color-1); + } + } + & > .previous { + float: left; + padding-right: map-get($spacers, 2); + } + & > .next { + float: right; + padding-left: map-get($spacers, 2); + text-align: right; + } +} diff --git a/_sass/layout/_articles.scss b/_sass/layout/_articles.scss new file mode 100644 index 0000000..85f258c --- /dev/null +++ b/_sass/layout/_articles.scss @@ -0,0 +1,17 @@ +.layout--articles { + margin: map-get($spacers, 4) 0; + margin-top: map-get($spacers, 5); + @include media-breakpoint-down(md) { + margin-top: map-get($spacers, 4); + } + .card__header { + font-size: map-get($base, font-size); + } + .card__image { + & > .overlay { + &, .card__header { + font-size: map-get($base, font-size-sm); + } + } + } +} diff --git a/_sass/layout/_base.scss b/_sass/layout/_base.scss new file mode 100644 index 0000000..6200ec5 --- /dev/null +++ b/_sass/layout/_base.scss @@ -0,0 +1,6 @@ +.icon { + display: block; + > svg { + display: block; + } +} diff --git a/_sass/layout/_home.scss b/_sass/layout/_home.scss new file mode 100644 index 0000000..298e6b9 --- /dev/null +++ b/_sass/layout/_home.scss @@ -0,0 +1,15 @@ +.layout--home { + .pagination { + margin: map-get($spacers, 4) 0; + } + .pagination__menu { + max-width: 100%; + @include overflow(auto); + } + .pagination__omit { + color: $text-color-l; + } + .items { + margin-top: map-get($spacers, 4) * 1.5; + } +} diff --git a/_sass/layout/_landing.scss b/_sass/layout/_landing.scss new file mode 100644 index 0000000..752d4e7 --- /dev/null +++ b/_sass/layout/_landing.scss @@ -0,0 +1,23 @@ +.layout--landing { + .heros { + max-width: map-get($layout, content-max-width) * 2; + margin-right: auto; + margin-left: auto; + } + .hero { + img { + display: block; + width: 100%; + margin: 0 auto; + } + } + .hero__content { + margin-bottom: 0; + } + .hero__cover { + max-width: map-get($layout, content-max-width); + } + .hero__cover--full-width { + max-width: none; + } +} diff --git a/_sass/layout/_page.scss b/_sass/layout/_page.scss new file mode 100644 index 0000000..bb42331 --- /dev/null +++ b/_sass/layout/_page.scss @@ -0,0 +1,165 @@ +body, +html, +.root, +.layout--page { + height: 100%; +} + +.layout--page { + &.layout--page--sidebar { + .page__viewport, + .page__grid { + height: 100%; + } + @include media-breakpoint-down(lg) { + .page__main { + @include overflow(unset); + } + } + } +} + +.page__main { + height: 100%; + color: $text-color; + .col-aside { + display: none; + & > aside { + position: absolute; + width: map-get($layout, aside-width); + @include overflow(hidden); + } + } +} + +.page__main-inner { + position: relative; + @include flexbox(); + @include flex-direction(column); + min-height: 100%; + background-color: $background-color; +} + +.page__content { + @include flex(1); + width: 100%; + margin: 0 auto; + @media print { + padding-bottom: 0; + } +} +.hide-footer { + .page__content { + padding-bottom: 0; + } +} + +.page__comments { + margin: map-get($spacers, 4) 0; +} + +.page__aside { + .toc-aside { + padding: map-get($spacers, 5) 0 map-get($spacers, 3) map-get($spacers, 5); + } +} + +.page__actions { + position: fixed; + bottom: map-get($spacers, 5); + left: map-get($spacers, 3); + z-index: map-get($z-indexes, actions); + display: none; +} + +.page__sidebar { + z-index: map-get($z-indexes, sidebar); + display: block; + width: 80%; + max-width: map-get($layout, sidebar-width); + height: 100%; + background-color: $background-color; + @include split-line(right); + @include transition(transform map-get($animation, duration)); + @include overflow(auto); + .sidebar-toc { + padding: map-get($spacers, 3) map-get($spacers, 3) map-get($spacers, 4) map-get($spacers, 4); + } +} +.sidebar-button { + @include clickable($text-color-d, rgba($main-color-3, .75)); +} + +.page__mask { + @include modal(map-get($z-indexes, mask)); + cursor: pointer; +} +.layout--page--sidebar { + .page__main { + @include overflow(auto); + @media print { + @include overflow(unset); + } + } +} + +.has-aside { + .col-aside { + position: relative; + display: block; + width: map-get($layout, aside-width); + & > aside { + &.fixed { + position: fixed; + -webkit-font-smoothing: subpixel-antialiased; + } + } + @include media-breakpoint-down(lg) { + display: none; + } + } +} + +@include media-breakpoint-down(lg) { + .page__sidebar { + position: fixed; + @include transform(translate(- map-get($layout, sidebar-width), 0)); + } + + .page__actions { + display: block; + } + + .show-sidebar { + .page__actions { + visibility: hidden; + } + .page__sidebar { + @include transform(translate(0)); + } + .page__mask { + @include modal--show(); + } + } +} + +.hero--light { + .article__info { + color: $text-color-theme-light; + } +} +.hero--dark { + .article__info { + color: $text-color-theme-dark; + } +} + +.page__main--immersive { + .page__header { + position: absolute; + width: 100%; + } + .hero__content { + padding-top: map-get($layout, header-height); + } +} |