From a50277a49583a47000e5aff8ac207acce219144f Mon Sep 17 00:00:00 2001 From: rmaguiar Date: Tue, 21 Jul 2020 22:07:16 -0300 Subject: Add checking to font preloading --- assets/scss/exclusive/contact-form.scss | 26 +- assets/scss/main.scss | 97 +- assets/scss/main.scss.bak | 1382 ++++++++++++++++++++ ...m.scss_1b2bf5373d097200b186ddaf7c11814c.content | 2 +- ...n.scss_694b6a5caed62875bf9278dff98b7f5e.content | 2 +- ...main.scss_694b6a5caed62875bf9278dff98b7f5e.json | 2 +- layouts/partials/head.html | 6 +- layouts/partials/search-form.html | 2 +- layouts/shortcodes/contact-form.html | 16 +- layouts/shortcodes/social.html | 4 +- 10 files changed, 1451 insertions(+), 88 deletions(-) create mode 100644 assets/scss/main.scss.bak diff --git a/assets/scss/exclusive/contact-form.scss b/assets/scss/exclusive/contact-form.scss index 65e3d07..b18e647 100644 --- a/assets/scss/exclusive/contact-form.scss +++ b/assets/scss/exclusive/contact-form.scss @@ -14,16 +14,7 @@ $change-transition: {{ .Site.Params.Style.changeTransition | default .Site.Data. label { display: block; - margin-top: 1rem; - - font-family: $heading-font; - font-size: .9rem; - - letter-spacing: .5px; line-height: 1.8rem; - text-transform: uppercase; - - user-select: none; } input[name=name], @@ -31,26 +22,10 @@ $change-transition: {{ .Site.Params.Style.changeTransition | default .Site.Data. input[name=_subject], select, textarea { - background: var(--input-bg); - border: 1px solid var(--input-bd); - color: var(--input-fg); - - font-family: $body-font; - font-size: .9rem; - line-height: 1.5rem; - display: block; margin: 3px 0; max-width: 100%; - - transition: outline .2s ease-in-out; - - outline: 2px solid transparent; - - &:focus { - outline-color: var(--accent); - } } input[name=name], @@ -89,6 +64,7 @@ $change-transition: {{ .Site.Params.Style.changeTransition | default .Site.Data. transition: background-color $change-transition, border .2s ease-in-out, + color $change-transition, outline .2s ease-in-out, opacity .2s ease-in-out; diff --git a/assets/scss/main.scss b/assets/scss/main.scss index 4f430b1..79c3bdd 100644 --- a/assets/scss/main.scss +++ b/assets/scss/main.scss @@ -107,8 +107,7 @@ body { transition: opacity .2s ease-in-out, - outline .2s ease-in-out, - padding .2s ease-in-out; + outline .2s ease-in-out; &:focus { outline-color: var(--accent); @@ -183,7 +182,6 @@ body { a { transition: opacity .2s ease-in-out, - padding .2s ease-in-out, outline-color $change-transition; &:hover { @@ -218,7 +216,7 @@ body { svg { fill: var(--fg); - stroke: var(--fg); + stroke: var(--lpress); stroke-width: .6rem; } } @@ -688,18 +686,11 @@ div.highlight > div.chroma { } - mark, p code, li code { border-radius: 2px; padding: 1px 3px; - - word-break: break-all; -} - -p code { - word-break: break-word; } li a { @@ -707,7 +698,6 @@ li a { } - article > header { section.tags { @@ -761,8 +751,10 @@ ul.posts { // HACK // Using a background-image as an overlay... background-image: - linear-gradient(0deg, var(--bgmod), - 100%, transparent); + linear-gradient( + 0deg, var(--bgmod), + 100%, transparent + ); border-radius: $border-radius; @@ -922,7 +914,7 @@ details.toc { transition: color $change-transition, opacity .2s ease, - outline-color .2s ease, + outline-color .3s ease, padding .2s ease; &:hover { @@ -1026,10 +1018,8 @@ article > ul { // BUTTONS -a.btn, +.btn, a.footnote-backref, -section.search-box button, -section.social a, input[type=submit] { background: var(--accent); border: 1px solid rgba(0,0,0,.3); @@ -1092,7 +1082,8 @@ ul.tags { background-image: linear-gradient( 0deg, var(--bgmod), - 100%, transparent); + 100%, transparent + ); border-radius: $border-radius; @@ -1112,8 +1103,7 @@ ul.pagination { text-align: center; margin: 3rem auto 1rem; - padding: 0; // override? - + display: flex; flex-wrap: wrap; justify-content: center; @@ -1168,6 +1158,44 @@ ul.pagination { } + + +.label-form { + margin-top: 1rem; + + font-family: $heading-font; + font-weight: $heading-weight; + font-size: .9rem; + + letter-spacing: .5px; + text-transform: uppercase; + + user-select: none; +} + +.input-text { + background: var(--input-bg); + border: 1px solid var(--input-bd); + color: var(--input-fg); + font-family: $body-font; + font-size: .9rem; + line-height: 1.5rem; + + transition: + background-color $change-transition, + border $change-transition, + outline .2s ease-in-out; + + outline: 2px solid transparent; + + &:focus { + outline-color: var(--accent); + } +} + + + + // SEARCH section.search-box { @@ -1179,40 +1207,15 @@ section.search-box { } label { - color: var(--fg); - font-family: $heading-font; - font-weight: $heading-weight; flex-basis: 100%; - text-align: left; - - font-size: .9rem; - letter-spacing: .5px; line-height: 2rem; - text-transform: uppercase; } input[name=q] { - background: var(--input-bg); - border: 1px solid var(--input-bd); - color: var(--input-fg); - font-family: $body-font; - font-size: .9rem; - line-height: 1.5rem; padding: 6px 12px; flex: 1; - - transition: - background-color $change-transition, - border $change-transition, - outline .2s ease-in-out; - + border-radius: $border-radius 0 0 $border-radius; - - outline: 2px solid transparent; - - &:focus { - outline-color: var(--accent); - } } button { diff --git a/assets/scss/main.scss.bak b/assets/scss/main.scss.bak new file mode 100644 index 0000000..4f430b1 --- /dev/null +++ b/assets/scss/main.scss.bak @@ -0,0 +1,1382 @@ +@charset 'utf-8'; + +// Import base (variables and mixins), typography and general colors +@import 'base/_all', + 'fonts/_all', + 'colors/variables'; + + +// Get transition for color changes +$change-transition: {{ .Site.Params.Style.changeTransition | default .Site.Data.default.style.changeTransition }}; + + + +// Default size +:root { + font-size: $font-size; +} + + +html { + scroll-behavior: smooth; + + // Light mode + &[data-mode='light'] { + --bg: #{$light-background}; + --fg: #{$light-foreground}; + + --alt-bg: #{$light-alt-background}; + --alt-fg: #{$light-alt-foreground}; + + --dtl: #{$light-details}; + --err: #{$light-error-color}; + + --bgmod: #{$light-bg-modifier}; + + --input-bg: #{$light-input-background}; + --input-fg: #{$light-input-foreground}; + --input-bd: #{$light-input-border}; + + --lpress: #{$light-letterpress}; + --rlpress: #{$dark-letterpress}; + + // Custom Chroma stylesheet + {{ if .Site.Params.Style.useCustomChroma | default true }} + + {{ if (fileExists "static/css/chroma/light.css") }} + @import '/css/chroma/light.css'; + {{ else if (resources.Get "scss/colors/chroma/light.scss") }} + @import 'colors/chroma/light'; + {{ end }} + + {{ end }} + } + + // Dark mode + &[data-mode='dark'] { + --bg: #{$dark-background}; + --fg: #{$dark-foreground}; + + --alt-bg: #{$dark-alt-background}; + --alt-fg: #{$dark-alt-foreground}; + + --dtl: #{$dark-details}; + --err: #{$dark-error-color}; + + --bgmod: #{$dark-bg-modifier}; + + --input-bg: #{$dark-input-background}; + --input-fg: #{$dark-input-foreground}; + --input-bd: #{$dark-input-border}; + + --lpress: #{$dark-letterpress}; + --rlpress: #{$light-letterpress}; + + // Lazy way to deter images that can be too bright + img { + filter: $img-filter; + } + + // Custom Chroma stylesheet + {{ if .Site.Params.Style.useCustomChroma | default true }} + + {{ if (fileExists "static/css/chroma/dark.css") }} + @import '/css/chroma/dark.css'; + {{ else if (resources.Get "scss/colors/chroma/dark.scss") }} + @import 'colors/chroma/dark'; + {{ end }} + + {{ end }} + } +} + + +body { + + // Some reset + margin: 0; + padding: 0; + + font-family: $body-font; + + a { + color: var(--accent); + + outline: 2px dashed transparent; + outline-offset: 2px; + + transition: + opacity .2s ease-in-out, + outline .2s ease-in-out, + padding .2s ease-in-out; + + &:focus { + outline-color: var(--accent); + } + + &:hover { + opacity: .75; + } + + word-break: break-word; + } + + background: var(--bg); + color: var(--fg); + + // Sticky footer + display: flex; + min-height: 100vh; + flex-direction: column; + + > header, + > footer { + background: var(--alt-bg); + color: var(--alt-fg); + + text-align: center; + } + + > header { + + padding: 0 1.5rem 1rem; + + nav { + margin: .5rem 0 0; + + ul { + margin: 0; + padding: 0; + + display: flex; + flex-wrap: wrap; + justify-content: center; + + a { + display: block; + + word-break: keep-all; + + margin: 0 7.5px 15px; + padding: 9px 21px 12px; + + font-size: .75rem; + font-weight: $body-bold-weight; + text-transform: uppercase; + } + } + } + } + + > footer { + padding: 1rem 3rem; + + p { + line-height: 1.8rem; + margin: .75rem 0; + + // HACK + // Render "\n" as a line break in the copyright (from config) + white-space: pre-wrap; + } + + a { + transition: + opacity .2s ease-in-out, + padding .2s ease-in-out, + outline-color $change-transition; + + &:hover { + opacity: .75; + } + } + + section { + padding: 6px 0 12px; + + input { + border: 1px solid var(--fg); + outline-offset: 3px; + + padding: 0; + + &::-webkit-color-swatch { + border: none; + } + + &::-webkit-color-swatch-wrapper { + padding: 0; + } + } + + button { + background: 0; + border: 0; + + padding: 3px 3px 0; + + svg { + fill: var(--fg); + + stroke: var(--fg); + stroke-width: .6rem; + } + } + + input, + button { + margin: 0 7.5px; + outline: 2px dashed transparent; + + transition: + outline .2s ease-in-out, + transform .2s ease-in-out; + + &:focus { + outline-color: var(--accent); + } + + &:hover { + transform: scale(1.2); + } + + // HACK + // Override Firefox unnecessary extra inner outline + &::-moz-focus-inner { + border: 0; + } + } + + input, + button svg { + @include squared(42px); + } + } + } +} + + +ol, +ul { + list-style: none; +} + + +// Heading 1 +h1 { + @include letterpress(var(--rlpress)); +} + +// Separator +hr { + border: 1px solid var(--lpress); + margin: 2.4rem 0 1.2rem; +} + +// Selection +::selection { + background: var(--accent); + color: $selected-fg; + text-shadow: none; +} + +// Sticky footer +div.filler { + flex: 1; + + align-items: center; + justify-content: center; +} + + + +article > header { + h1 { + line-height: 3rem; + } + + img { + margin: 1rem 0 0; + } + + p { + font-size: .9rem; + font-style: italic; + } +} + + +// Typography +%heading-base { + font-family: $heading-font; + font-weight: $heading-weight; +} + +@for $i from 1 through 6 { + h#{$i} { + @extend %heading-base; + + font-size: 1rem + $heading-scaling * (6 - $i); + } +} + + +main { + p { + line-height: 1.65rem; + } +} + +code { + font-family: $code-font; +} + + +// If there's no "custom/site-title" partial, style a default one +{{ if not (or (templates.Exists "partials/custom/site-title") (templates.Exists "partials/custom/site-title.html")) }} + body > header { + > a { + font-family: $heading-font; + font-size: 2.1rem; + font-weight: $heading-weight; + + transition: + color $change-transition, + opacity .2s ease-in-out, + outline-color $change-transition; + + @include letterpress(var(--rlpress)); + + display: inline-block; + margin: 1.5rem 0 .75rem; + } + } +{{ end }} + + +// WHITE SPACE +article > header { + margin: 0 0 2rem; + + h1 { + margin: 9px 0; + } + + p { + margin: 0; + } +} + +article { + + h2, + h3 { + margin: 2rem 0 1rem; + } + + p { + margin: 1.5rem 0; + } +} + +%reset-top { + margin-top: 0; +} + +@for $i from 1 through 6 { + h#{$i} + p { + @extend %reset-top; + } +} + +%padding-top { + padding-top: 1rem; +} + +@for $i from 2 through 6 { + h#{$i} { + @extend %padding-top; + } +} + +audio, +img, +video { + margin: 1.8rem auto; +} + + +// ANCHOR LINKS +a.anchor { + background-image: none; + + svg { + fill: var(--accent); + + vertical-align: middle; + + @include squared(24px); + } +} + + +// Resize the anchor SVG depending on the heading level +// Also minor spacing ajustment +@for $i from 2 through 6 { + h#{$i} { + a.anchor { + margin: 0 0 0 (.25rem + .1 * (6 - $i)); + + svg { + transform: scale(1 + .175 * (6 - $i)); + } + } + } +} + + +// Avoid accidental selection +label, +span.lnt, +summary, +sup.footnote-ref { + user-select: none; +} + + +// Lists in general +article ol, +article ul { + li { + margin-bottom: .45rem; + } +} + + +ol { + counter-reset: a-counter; + + li { + counter-increment: a-counter; + + &::before { + content: counter(a-counter) ''; + + font-size: .85rem; + font-weight: $body-bold-weight; + + @include letterpress(var(--lpress)); + + background: var(--fg); + border: 1px solid var(--lpress); + border-radius: $border-radius; + color: var(--bg); + + margin-right: 12px; + padding: 2px 7.5px; + } + } +} + + + + + + + +// FOOTNOTES +section.footnotes { + border-top: 2px solid var(--fg); + + // HACK + // Some problem caused by flex? + display: block; + + margin-top: 2.4rem; + padding: 1rem 1rem 1.8rem; + + h2 { + margin: 0 0 2rem; + } + + a { + word-break: break-word; + } + + ol li p:first-of-type { + display: inline; + + // HACK + // This should be useless out of development if using minification (that should strip the white space) + {{ if .Site.IsServer }} + margin-left: -6px; + {{ end }} + } + + // HACK + // The default "↩" symbol will be rendered differently in + // different browsers and platforms + // Solved right now by replacing the "↩" symbol with a + // SVG (or plain text if it's the user wish) + a.footnote-backref { + margin: 0 0 0 9px; + + {{ if .Site.Params.Style.hasIconAsFootnoteReturnLink }} + + padding: 0 9px; + vertical-align: middle; + + svg { + fill: var(--dtl); + + stroke: var(--lpress); + stroke-width: .6rem; + + @include squared(18px); + } + + {{ else }} + + padding: 0 15px 4.5px; + vertical-align: top; + + font-size: .75rem; + text-transform: lowercase; + + word-break: break-word; + + {{ end }} + } + + // HACK + // Ignore the default (markdown-generated) separator before footnotes + hr { + display: none; + } +} + +// Trying something Wikipedia-like +sup { + line-height: 0; + + a.footnote-ref { + text-decoration: none; + + &::before { + content: '['; + } + + &::after { + content: ']'; + } + } +} + + +// For mode change animation +code, +.chroma, +.chroma span { + transition: + background-color $change-transition, + color $change-transition; +} + + +article > pre, +section.scroll, +span.katex-display, +div.highlight > pre, +div.highlight > div { + + overflow-x: auto; + + transition: + background-color $change-transition, + color $change-transition, + outline-color .3s ease; + + outline: 3px solid transparent; + + &:focus { + outline-color: var(--accent); + } +} + + +// TABLE +section.scroll { + + border: 1px solid var(--fg); + + & > table { + border-collapse: collapse; + color: var(--fg); + + font-family: $body-font; + + min-width: 600px; + width: 100%; + + td + td { + border-left: 1px solid var(--fg); + } + + tr + tr { + border-top: 1px solid var(--fg); + } + + tr:not(:first-child):last-of-type { + border-bottom: 1px solid var(--fg); + } + + td, + th { + padding: 9px; + } + + th { + background: var(--fg); + color: var(--bg); + } + + tr { + transition: + background .2s ease-in-out, + color .2s ease-in-out; + + &:nth-child(even) { + background: var(--alt-bg); + } + + &:nth-child(odd) { + background: var(--bg); + } + + &:hover { + background: var(--accent); + color: var(--dtl); + } + } + } +} + + +div.highlight > div table { + padding: 0 24px; + max-height: $box-max-height; +} + +div.chroma td:first-of-type { + padding: 0 18px 0 0; +} + +article > pre, +span.katex-display, +div.highlight > pre { + padding: var(--hl-pad); +} + +article > pre, +span.katex-display, +div.highlight > pre, +div.highlight > div.chroma { + border: 1px solid $box-border; + + line-height: 1.5rem; + max-height: $box-max-height; +} + + + +mark, +p code, +li code { + border-radius: 2px; + padding: 1px 3px; + + word-break: break-all; +} + +p code { + word-break: break-word; +} + +li a { + word-break: break-all; +} + + + +article > header { + section.tags { + + margin: .9rem 0 .6rem; + + ul { + padding: 0; + } + + li { + display: inline; + } + + a { + display: inline-block; + + margin: 0 7.5px 9px 0; + padding: 6px 15px 9px; + } + } +} + + + +ul.posts { + padding: 0; + + li { + margin: .5rem 0; + } + + a { + background: var(--accent); + color: var(--dtl); + + display: flex; + margin: 15px auto; + padding: 15px 30px 18px; + + text-decoration: none; + + align-items: center; + word-break: break-word; + + p { + flex: 1; + margin: 0; + } + + time { + // HACK + // Using a background-image as an overlay... + background-image: + linear-gradient(0deg, var(--bgmod), + 100%, transparent); + + border-radius: $border-radius; + + font-size: .85rem; + + margin-left: 1.8rem; + padding: 0 9px 2px; + } + } +} + +// Not sure if I like this +@include respond-below($mobile-breakpoint) { + ul.posts a { + flex-direction: column-reverse; + align-items: unset; + + time { + margin: .3rem 0; + } + } +} + + + +span.katex-display { + border: 1px dashed var(--alt-fg); + + overflow-x: auto; + padding: 15px 30px; + + &:focus { + border: 1px solid $box-border; + } +} + + + + +// MEDIA +img { + display: block; + + max-width: 100%; + max-height: $box-max-height; + + outline: 3px solid transparent; + + transition: + border-color $change-transition, + outline-color .3s ease, + filter $change-transition; + + &.cover { + border: 1px solid var(--fg); + + object-fit: cover; + width: 100%; + } +} + +article p > img { + display: block; + margin: 2rem auto; + max-width: 100%; +} + +figure { + margin: 1.8rem auto; + + img { + display: block; + margin: 0 auto; + max-width: 90%; + } + + figcaption { + font-size: .85rem; + text-align: center; + + margin: .75rem; + line-height: 1.5rem; + } +} + +video { + display: block; + + max-width: 91%; + max-height: $box-max-height; + + outline: 3px solid transparent; + + transition: + border-color $change-transition, + outline-color .3s ease; + + &:focus, + &:hover { + border-color: var(--accent); + outline-color: var(--accent); + } + + &.gifoid { + margin: 3rem auto; + max-width: 90%; + } +} + +audio { + display: block; + width: 90%; +} + +img, +video { + &.border { + border: 1px solid var(--fg); + } + + // Can be used to override the previous rule + &.borderless { + border: 0; + } +} + + + +// Table of Contents +details.toc { + + background: var(--alt-bg); + color: var(--dtl); + + transition: + background-color $change-transition, + border $change-transition, + linear-gradient $change-transition; + + summary { + background: var(--accent); + border: 1px solid rgba(0,0,0,.3); + + border-radius: $border-radius; + + @include button-like; + + font-family: $heading-font; + + padding: 15px 30px 18.5px; + + outline: 2px dashed transparent; + outline-offset: 3px; + + @include letterpress(var(--lpress)); + + transition: + color $change-transition, + opacity .2s ease, + outline-color .2s ease, + padding .2s ease; + + &:hover { + opacity: .75; + } + + &:focus { + outline-color: var(--accent); + } + + } + + &[open] summary { + border-radius: $border-radius $border-radius 0 0; + + box-shadow: inset 0 1px 0 rgba(255,255,255,.2); + + padding: 15px 30px; + + ~ * { + animation: smoothReveal .3s ease-in-out; + } + } + + nav#TableOfContents { + + border-style: solid; + border-color: rgba(0,0,0,.3); + border-width: 0 1px 1px; + + border-radius: 0 0 $border-radius $border-radius; + + box-shadow: inset 0 -3px 0 rgba(0,0,0,.3); + + padding: 6px 15px 15px 9px; + + li { + &:first-of-type { + margin-top: .3rem; + } + } + + ul li, + ol li { + &:not(:last-of-type), + ul li:first-of-type, + ol li:first-of-type { + margin-bottom: .3rem; + } + } + } +} + +#TableOfContents, +section.footnotes ol, +article > ul, +article > ol { + line-height: 1.5rem; +} + +#TableOfContents ul, +section.footnotes ol { + padding-left: 24px; +} + +article > ul, +article > ul ul, +article > ol, +article > ol ol { + padding: 0 24px 0; +} + +#TableOfContents ul, +article > ul { + + li:before { + content: ''; + margin-right: 12px; + + background: var(--fg); + border-radius: $border-radius; + + @include squared(18px); + + display: inline-block; + + // HACK + // Cheap vertical align + margin-bottom: -3px; + } +} + + + +// Animation +@keyframes smoothReveal { + 0% { opacity: 0; } + 100% { opacity: 1; } +} + + + +// BUTTONS +a.btn, +a.footnote-backref, +section.search-box button, +section.social a, +input[type=submit] { + background: var(--accent); + border: 1px solid rgba(0,0,0,.3); + color: var(--dtl); + + transition: + background-color $change-transition, + color $change-transition, + opacity .2s ease-in-out, + outline-color .3s ease; + + border-radius: $border-radius; + + @include button-like; + + text-decoration: none; + + @include letterpress(var(--lpress)); + + &:hover { + opacity: .75; + } +} + +button, +input[type=color], +summary { + cursor: pointer; +} + + + +// Categories +{{ if .Site.Taxonomies.categories }} + li.cats a { + font-weight: bold; + } +{{ end }} + + + +ul.tags { + display: flex; + flex-wrap: wrap; + + padding: 0; + + a { + display: flex; + flex: 1; + + align-items: center; + + margin: 0 9px 9px 0; + padding: 7.5px 18px 10.5px; + + word-break: keep-all; + + span { + background-image: + linear-gradient( + 0deg, var(--bgmod), + 100%, transparent); + + border-radius: $border-radius; + + margin-left: .45rem; + padding: 0 6px 1px; + + font-size: .85rem; + } + } +} + + + +ul.pagination { + font-family: $body-font; + font-weight: $body-bold-weight; + text-align: center; + + margin: 3rem auto 1rem; + padding: 0; // override? + + display: flex; + flex-wrap: wrap; + justify-content: center; + + li { + display: inline-block; + + transition: + background .2s ease-in-out, + border .2s ease-in-out; + + a, + &.current p { + display: block; + margin: 0 9px 9px 0; + padding: 7.5px 12px 10.5px; + + width: 21px; + } + + a { + color: var(--dtl); + } + + &.current p { + background: var(--alt-bg); + border: 1px solid rgba(0,0,0,.45); + border-radius: $border-radius; + color: var(--alt-fg); + + line-height: inherit; + + user-select: none; + + @include button-like; + + @include letterpress(var(--lpress)); + } + } + + svg { + fill: currentColor; + + @include squared(18px); + + display: inline-block; + + // HACK + // Cheap vertical align + margin: auto auto -2px; + } +} + + +// SEARCH +section.search-box { + + form { + display: flex; + flex-wrap: wrap; + justify-content: center; + align-items: stretch; + } + + label { + color: var(--fg); + font-family: $heading-font; + font-weight: $heading-weight; + flex-basis: 100%; + text-align: left; + + font-size: .9rem; + letter-spacing: .5px; + line-height: 2rem; + text-transform: uppercase; + } + + input[name=q] { + background: var(--input-bg); + border: 1px solid var(--input-bd); + color: var(--input-fg); + font-family: $body-font; + font-size: .9rem; + line-height: 1.5rem; + padding: 6px 12px; + flex: 1; + + transition: + background-color $change-transition, + border $change-transition, + outline .2s ease-in-out; + + border-radius: $border-radius 0 0 $border-radius; + + outline: 2px solid transparent; + + &:focus { + outline-color: var(--accent); + } + } + + button { + border-radius: 0 $border-radius $border-radius 0; + padding: 6px 30px; + + outline: 2px dashed transparent; + outline-offset: 2px; + + &:focus { + outline-color: var(--accent); + } + + &:hover { + opacity: .75; + } + + svg { + @include squared(15px); + + fill: currentColor; + stroke: var(--lpress); + stroke-width: 9px; + } + } +} + +#search-info { + margin: 1rem 0 2rem; + + + ul { + margin: 0 0 6rem; + } +} + + +p.error { + color: var(--err); +} + +mark { + background: var(--accent); + + // TODO + // Not a11y enough + filter: + contrast(1.2) + invert(1); +} + +// BUG +// For some reason, the default "dotted" rendering seems broken in Chrome +abbr { + text-decoration-style: solid; +} + +blockquote { + background: var(--alt-bg); + border-style: solid; + border-width: 1px 1px 1px 12px; + color: var(--alt-fg); + + margin: var(--blk-mg); + padding: 0 30px; + + p { + margin: 1.2rem 0; + } +} + +kbd { + background-color: #eee; + border: 1px solid #b4b4b4; + border-radius: $border-radius; + + box-shadow: + 0 1px 1px rgba(0, 0, 0, .2), + 0 2px 0 0 rgba(255, 255, 255, .7) inset; + + color: #333; + display: inline-block; + font-size: .85em; + font-weight: $body-bold-weight; + line-height: 1; + padding: 2px; + white-space: nowrap; + + > kbd { + margin: 0 2px; + } +} + + +// RESPONSIVENESS +main { + margin: 90px auto; + padding: 0 15px; + + max-width: 660px; +} + +article { + margin: 90px auto 120px; +} + + +html { + --blk-mg: 1.05rem .75rem; + --il-pad: 0 12px; + + --hl-pad: 15.75px 18px; +} + +@include respond-above($mobile-breakpoint) { + html { + --blk-mg: 2.1rem 1.5rem; + --il-pad: 6px 24px; + + --hl-pad: 21px 24px; + } +} + + +{{ if .Site.Params.Style.hideAnchors }} + + @include respond-above($mobile-breakpoint) { + a.anchor:not(:focus) { + opacity: 0; + } + + %visible { + opacity: 1; + } + + @for $i from 2 through 6 { + h#{$i} > a:focus + a.anchor, + h#{$i}:hover > a.anchor { + @extend %visible; + } + } + } + +{{ end }} + +{{ if .Site.Params.hasNoscriptNotice }} + p.noscript { + font-weight: bold; + } +{{ end }} + + +// Rich Content +{{ if (fileExists "static/css/rich-content.css") }} + @import '/css/rich-content.css'; +{{ else if (resources.Get "scss/rich-content.scss") }} + @import 'rich-content'; +{{ end }} + + +// TODO +// Custom user stuff +// This isn't good enough +{{ if (fileExists "static/css/custom.css") }} + @import '/css/custom.css'; +{{ else if (resources.Get "scss/custom.scss") }} + @import 'custom'; +{{ end }} diff --git a/exampleSite/resources/_gen/assets/scss/scss/exclusive/contact-form.scss_1b2bf5373d097200b186ddaf7c11814c.content b/exampleSite/resources/_gen/assets/scss/scss/exclusive/contact-form.scss_1b2bf5373d097200b186ddaf7c11814c.content index d75c8bb..7d600b6 100644 --- a/exampleSite/resources/_gen/assets/scss/scss/exclusive/contact-form.scss_1b2bf5373d097200b186ddaf7c11814c.content +++ b/exampleSite/resources/_gen/assets/scss/scss/exclusive/contact-form.scss_1b2bf5373d097200b186ddaf7c11814c.content @@ -1 +1 @@ -#contact{margin:1.5rem 0}#contact label{display:block;margin-top:1rem;font-family:oswald,sans-serif;font-size:.9rem;letter-spacing:.5px;line-height:1.8rem;text-transform:uppercase;user-select:none}#contact input[name=name],#contact input[name=_replyto],#contact input[name=_subject],#contact select,#contact textarea{background:var(--input-bg);border:1px solid var(--input-bd);color:var(--input-fg);font-family:open sans,sans-serif;font-size:.9rem;line-height:1.5rem;display:block;margin:3px 0;max-width:100%;transition:outline .2s ease-in-out;outline:2px solid transparent}#contact input[name=name]:focus,#contact input[name=_replyto]:focus,#contact input[name=_subject]:focus,#contact select:focus,#contact textarea:focus{outline-color:var(--accent)}#contact input[name=name],#contact input[name=_replyto],#contact input[name=_subject]{min-width:240px;padding:6px 12px}#contact select{min-width:210px;padding:6px}#contact textarea{padding:9px 15px;width:90%;height:auto}#contact input[type=submit]{cursor:pointer;font-family:oswald,sans-serif;font-size:.75rem;text-transform:uppercase;letter-spacing:.05rem;margin-top:1.2rem;padding:12px 42px 15px;outline:2px dashed transparent;outline-offset:2px;transition:background-color .3s ease,border .2s ease-in-out,outline .2s ease-in-out,opacity .2s ease-in-out}#contact input[type=submit]:focus{outline-color:var(--accent)}#contact input[type=submit]:hover{opacity:.75}#contact input[type=submit]::-moz-focus-inner{border:0}@supports(-moz-appearance:meterbar){#contact select{color:var(--fg);color:transparent;text-shadow:0 0 0 var(--fg)}} \ No newline at end of file +#contact{margin:1.5rem 0}#contact label{display:block;line-height:1.8rem}#contact input[name=name],#contact input[name=_replyto],#contact input[name=_subject],#contact select,#contact textarea{display:block;margin:3px 0;max-width:100%}#contact input[name=name],#contact input[name=_replyto],#contact input[name=_subject]{min-width:240px;padding:6px 12px}#contact select{min-width:210px;padding:6px}#contact textarea{padding:9px 15px;width:90%;height:auto}#contact input[type=submit]{cursor:pointer;font-family:oswald,sans-serif;font-size:.75rem;text-transform:uppercase;letter-spacing:.05rem;margin-top:1.2rem;padding:12px 42px 15px;outline:2px dashed transparent;outline-offset:2px;transition:background-color .3s ease,border .2s ease-in-out,color .3s ease,outline .2s ease-in-out,opacity .2s ease-in-out}#contact input[type=submit]:focus{outline-color:var(--accent)}#contact input[type=submit]:hover{opacity:.75}#contact input[type=submit]::-moz-focus-inner{border:0}@supports(-moz-appearance:meterbar){#contact select{color:var(--fg);color:transparent;text-shadow:0 0 0 var(--fg)}} \ No newline at end of file diff --git a/exampleSite/resources/_gen/assets/scss/scss/main.scss_694b6a5caed62875bf9278dff98b7f5e.content b/exampleSite/resources/_gen/assets/scss/scss/main.scss_694b6a5caed62875bf9278dff98b7f5e.content index 9f667f7..1b70feb 100644 --- a/exampleSite/resources/_gen/assets/scss/scss/main.scss_694b6a5caed62875bf9278dff98b7f5e.content +++ b/exampleSite/resources/_gen/assets/scss/scss/main.scss_694b6a5caed62875bf9278dff98b7f5e.content @@ -1 +1 @@ -@font-face{font-family:oswald;font-style:normal;font-weight:700;font-display:swap;src:local("Oswald"),url(../fonts/oswald-v29-latin-700.woff2)format("woff2"),url(../fonts/oswald-v29-latin-700.woff)format("woff")}@font-face{font-family:open sans;font-style:normal;font-weight:400;font-display:swap;src:local("Open Sans Regular"),local("OpenSans-Regular"),url(../fonts/open-sans-v17-latin-regular.woff2)format("woff2"),url(../fonts/open-sans-v17-latin-regular.woff)format("woff")}@font-face{font-family:open sans;font-style:normal;font-weight:700;font-display:swap;src:local("Open Sans Bold"),local("OpenSans-Bold"),url(../fonts/open-sans-v17-latin-700.woff2)format("woff2"),url(../fonts/open-sans-v17-latin-700.woff)format("woff")}@font-face{font-family:open sans;font-style:italic;font-weight:400;font-display:swap;src:local("Open Sans Italic"),local("OpenSans-Italic"),url(../fonts/open-sans-v17-latin-italic.woff2)format("woff2"),url(../fonts/open-sans-v17-latin-italic.woff)format("woff")}:root{font-size:18px}html{scroll-behavior:smooth}html[data-mode=light]{--bg: #ddd;--fg: #444;--alt-bg: #d6d6d6;--alt-fg: #333;--dtl: #fdfdfd;--err: #c70000;--bgmod: rgba(0, 0, 0, 0.3);--input-bg: #fefefe;--input-fg: #111;--input-bd: #ccc;--lpress: rgba(0, 0, 0, 0.2);--rlpress: rgba(255, 255, 255, 0.2)}html[data-mode=light] .chroma,html[data-mode=light] pre,html[data-mode=light] p code,html[data-mode=light] li code{color:#93a1a1;background-color:#002b36}html[data-mode=light] .chroma .lntd{vertical-align:top;padding:0;margin:0;border:0}html[data-mode=light] .chroma .lntable{border-spacing:0;margin:0;border:0;width:auto;display:block}html[data-mode=light] .chroma .hl{display:block;width:100%;background-color:rgba(0,0,0,.3)}html[data-mode=light] .chroma .nb{color:#b58900}html[data-mode=light] .chroma .ge{font-style:italic}html[data-mode=light] .chroma .gr{color:#e8625f;font-weight:700}html[data-mode=light] .chroma .gs{font-weight:700}html[data-mode=light] .chroma .x,html[data-mode=light] .chroma .kc,html[data-mode=light] .chroma .no,html[data-mode=light] .chroma .ni,html[data-mode=light] .chroma .ne,html[data-mode=light] .chroma .se,html[data-mode=light] .chroma .gh{color:#e9662f}html[data-mode=light] .chroma .lnt,html[data-mode=light] .chroma .ln{margin-right:.4em;padding:0 .4em;color:#848f8f}html[data-mode=light] .chroma .k,html[data-mode=light] .chroma .kn,html[data-mode=light] .chroma .kp,html[data-mode=light] .chroma .o,html[data-mode=light] .chroma .ow,html[data-mode=light] .chroma .cs,html[data-mode=light] .chroma .cp,html[data-mode=light] .chroma .cpf,html[data-mode=light] .chroma .gi{color:#859900}html[data-mode=light] .chroma .kd,html[data-mode=light] .chroma .kr,html[data-mode=light] .chroma .bp,html[data-mode=light] .chroma .nc,html[data-mode=light] .chroma .nd,html[data-mode=light] .chroma .nf,html[data-mode=light] .chroma .nt,html[data-mode=light] .chroma .nv,html[data-mode=light] .chroma .gu{color:#3294da}html[data-mode=light] .chroma .kt,html[data-mode=light] .chroma .sr,html[data-mode=light] .chroma .gd{color:#e8625f}html[data-mode=light] .chroma .s,html[data-mode=light] .chroma .sa,html[data-mode=light] .chroma .sc,html[data-mode=light] .chroma .dl,html[data-mode=light] .chroma .s2,html[data-mode=light] .chroma .si,html[data-mode=light] .chroma .sx,html[data-mode=light] .chroma .s1,html[data-mode=light] .chroma .ss,html[data-mode=light] .chroma .m,html[data-mode=light] .chroma .mb,html[data-mode=light] .chroma .mf,html[data-mode=light] .chroma .mh,html[data-mode=light] .chroma .mi,html[data-mode=light] .chroma .il,html[data-mode=light] .chroma .mo{color:#2aa198}html[data-mode=light] .chroma .sb,html[data-mode=light] .chroma .c,html[data-mode=light] .chroma .ch,html[data-mode=light] .chroma .cm,html[data-mode=light] .chroma .c1{color:#759299}html[data-mode=dark]{--bg: #1f1f1f;--fg: #bbb;--alt-bg: #1c1c1c;--alt-fg: #ddd;--dtl: #1a1a1a;--err: #ff3131;--bgmod: rgba(255, 255, 255, 0.3);--input-bg: #222;--input-fg: #f0f0f0;--input-bd: #262626;--lpress: rgba(255, 255, 255, 0.2);--rlpress: rgba(0, 0, 0, 0.2)}html[data-mode=dark] img{filter:contrast(0.85)grayscale(0.3)}html[data-mode=dark] .chroma,html[data-mode=dark] pre,html[data-mode=dark] p code,html[data-mode=dark] li code{color:#f8f8f2;background:#272822}html[data-mode=dark] .chroma .err{color:#eb0083;background-color:#1e0010}html[data-mode=dark] .chroma .lntd{vertical-align:top;padding:0;margin:0;border:0}html[data-mode=dark] .chroma .lntable{border-spacing:0;margin:0;border:0;width:auto;display:block}html[data-mode=dark] .chroma .hl{display:block;width:100%;background-color:rgba(0,0,0,.3)}html[data-mode=dark] .chroma .ge{font-style:italic}html[data-mode=dark] .chroma .gs{font-weight:700}html[data-mode=dark] .chroma .lnt,html[data-mode=dark] .chroma .ln{margin-right:.4em;padding:0 .4em;color:#8e8e8e}html[data-mode=dark] .chroma .k,html[data-mode=dark] .chroma .kc,html[data-mode=dark] .chroma .kd,html[data-mode=dark] .chroma .kp,html[data-mode=dark] .chroma .kr,html[data-mode=dark] .chroma .kt,html[data-mode=dark] .chroma .no{color:#66d9ef}html[data-mode=dark] .chroma .kn,html[data-mode=dark] .chroma .nt,html[data-mode=dark] .chroma .o,html[data-mode=dark] .chroma .ow,html[data-mode=dark] .chroma .gd{color:#f94e8a}html[data-mode=dark] .chroma .na,html[data-mode=dark] .chroma .nc,html[data-mode=dark] .chroma .nd,html[data-mode=dark] .chroma .ne,html[data-mode=dark] .chroma .nf,html[data-mode=dark] .chroma .nx,html[data-mode=dark] .chroma .gi{color:#a6e22e}html[data-mode=dark] .chroma .l,html[data-mode=dark] .chroma .se,html[data-mode=dark] .chroma .m,html[data-mode=dark] .chroma .mb,html[data-mode=dark] .chroma .mf,html[data-mode=dark] .chroma .mh,html[data-mode=dark] .chroma .mi,html[data-mode=dark] .chroma .il,html[data-mode=dark] .chroma .mo{color:#ae81ff}html[data-mode=dark] .chroma .ld,html[data-mode=dark] .chroma .s,html[data-mode=dark] .chroma .sa,html[data-mode=dark] .chroma .sb,html[data-mode=dark] .chroma .sc,html[data-mode=dark] .chroma .dl,html[data-mode=dark] .chroma .sd,html[data-mode=dark] .chroma .s2,html[data-mode=dark] .chroma .sh,html[data-mode=dark] .chroma .si,html[data-mode=dark] .chroma .sx,html[data-mode=dark] .chroma .sr,html[data-mode=dark] .chroma .s1,html[data-mode=dark] .chroma .ss{color:#e6db74}html[data-mode=dark] .chroma .c,html[data-mode=dark] .chroma .ch,html[data-mode=dark] .chroma .cm,html[data-mode=dark] .chroma .c1,html[data-mode=dark] .chroma .cs,html[data-mode=dark] .chroma .cp,html[data-mode=dark] .chroma .cpf,html[data-mode=dark] .chroma .gu{color:#949076}body{margin:0;padding:0;font-family:open sans,sans-serif;background:var(--bg);color:var(--fg);display:flex;min-height:100vh;flex-direction:column}body a{color:var(--accent);outline:2px dashed transparent;outline-offset:2px;transition:opacity .2s ease-in-out,outline .2s ease-in-out,padding .2s ease-in-out;word-break:break-word}body a:focus{outline-color:var(--accent)}body a:hover{opacity:.75}body>header,body>footer{background:var(--alt-bg);color:var(--alt-fg);text-align:center}body>header{padding:0 1.5rem 1rem}body>header nav{margin:.5rem 0 0}body>header nav ul{margin:0;padding:0;display:flex;flex-wrap:wrap;justify-content:center}body>header nav ul a{display:block;word-break:keep-all;margin:0 7.5px 15px;padding:9px 21px 12px;font-size:.75rem;font-weight:700;text-transform:uppercase}body>footer{padding:1rem 3rem}body>footer p{line-height:1.8rem;margin:.75rem 0;white-space:pre-wrap}body>footer a{transition:opacity .2s ease-in-out,padding .2s ease-in-out,outline-color .3s ease}body>footer a:hover{opacity:.75}body>footer section{padding:6px 0 12px}body>footer section input{border:1px solid var(--fg);outline-offset:3px;padding:0}body>footer section input::-webkit-color-swatch{border:none}body>footer section input::-webkit-color-swatch-wrapper{padding:0}body>footer section button{background:0;border:0;padding:3px 3px 0}body>footer section button svg{fill:var(--fg);stroke:var(--fg);stroke-width:.6rem}body>footer section input,body>footer section button{margin:0 7.5px;outline:2px dashed transparent;transition:outline .2s ease-in-out,transform .2s ease-in-out}body>footer section input:focus,body>footer section button:focus{outline-color:var(--accent)}body>footer section input:hover,body>footer section button:hover{transform:scale(1.2)}body>footer section input::-moz-focus-inner,body>footer section button::-moz-focus-inner{border:0}body>footer section input,body>footer section button svg{width:42px;height:42px}ol,ul{list-style:none}h1{text-shadow:0 1px 0 var(--rlpress),1px 0 0 var(--rlpress)}hr{border:1px solid var(--lpress);margin:2.4rem 0 1.2rem}::selection{background:var(--accent);color:#f0f0f0;text-shadow:none}div.filler{flex:1;align-items:center;justify-content:center}article>header h1{line-height:3rem}article>header img{margin:1rem 0 0}article>header p{font-size:.9rem;font-style:italic}h6,h5,h4,h3,h2,h1{font-family:oswald,sans-serif;font-weight:700}h1{font-size:2.25rem}h2{font-size:2rem}h3{font-size:1.75rem}h4{font-size:1.5rem}h5{font-size:1.25rem}h6{font-size:1rem}main p{line-height:1.65rem}code{font-family:monospace}body>header>a{font-family:oswald,sans-serif;font-size:2.1rem;font-weight:700;transition:color .3s ease,opacity .2s ease-in-out,outline-color .3s ease;text-shadow:0 1px 0 var(--rlpress),1px 0 0 var(--rlpress);display:inline-block;margin:1.5rem 0 .75rem}article>header{margin:0 0 2rem}article>header h1{margin:9px 0}article>header p{margin:0}article h2,article h3{margin:2rem 0 1rem}article p{margin:1.5rem 0}h6+p,h5+p,h4+p,h3+p,h2+p,h1+p{margin-top:0}h6,h5,h4,h3,h2{padding-top:1rem}audio,img,video{margin:1.8rem auto}a.anchor{background-image:none}a.anchor svg{fill:var(--accent);vertical-align:middle;width:24px;height:24px}h2 a.anchor{margin:0 0 0 .65rem}h2 a.anchor svg{transform:scale(1.7)}h3 a.anchor{margin:0 0 0 .55rem}h3 a.anchor svg{transform:scale(1.525)}h4 a.anchor{margin:0 0 0 .45rem}h4 a.anchor svg{transform:scale(1.35)}h5 a.anchor{margin:0 0 0 .35rem}h5 a.anchor svg{transform:scale(1.175)}h6 a.anchor{margin:0 0 0 .25rem}h6 a.anchor svg{transform:scale(1)}label,span.lnt,summary,sup.footnote-ref{user-select:none}article ol li,article ul li{margin-bottom:.45rem}ol{counter-reset:a-counter}ol li{counter-increment:a-counter}ol li::before{content:counter(a-counter)"";font-size:.85rem;font-weight:700;text-shadow:0 1px 0 var(--lpress),1px 0 0 var(--lpress);background:var(--fg);border:1px solid var(--lpress);border-radius:2px;color:var(--bg);margin-right:12px;padding:2px 7.5px}section.footnotes{border-top:2px solid var(--fg);display:block;margin-top:2.4rem;padding:1rem 1rem 1.8rem}section.footnotes h2{margin:0 0 2rem}section.footnotes a{word-break:break-word}section.footnotes ol li p:first-of-type{display:inline;margin-left:-6px}section.footnotes a.footnote-backref{margin:0 0 0 9px;padding:0 9px;vertical-align:middle}section.footnotes a.footnote-backref svg{fill:var(--dtl);stroke:var(--lpress);stroke-width:.6rem;width:18px;height:18px}section.footnotes hr{display:none}sup{line-height:0}sup a.footnote-ref{text-decoration:none}sup a.footnote-ref::before{content:'['}sup a.footnote-ref::after{content:']'}code,.chroma,.chroma span{transition:background-color .3s ease,color .3s ease}article>pre,section.scroll,span.katex-display,div.highlight>pre,div.highlight>div{overflow-x:auto;transition:background-color .3s ease,color .3s ease,outline-color .3s ease;outline:3px solid transparent}article>pre:focus,section.scroll:focus,span.katex-display:focus,div.highlight>pre:focus,div.highlight>div:focus{outline-color:var(--accent)}section.scroll{border:1px solid var(--fg)}section.scroll>table{border-collapse:collapse;color:var(--fg);font-family:open sans,sans-serif;min-width:600px;width:100%}section.scroll>table td+td{border-left:1px solid var(--fg)}section.scroll>table tr+tr{border-top:1px solid var(--fg)}section.scroll>table tr:not(:first-child):last-of-type{border-bottom:1px solid var(--fg)}section.scroll>table td,section.scroll>table th{padding:9px}section.scroll>table th{background:var(--fg);color:var(--bg)}section.scroll>table tr{transition:background .2s ease-in-out,color .2s ease-in-out}section.scroll>table tr:nth-child(even){background:var(--alt-bg)}section.scroll>table tr:nth-child(odd){background:var(--bg)}section.scroll>table tr:hover{background:var(--accent);color:var(--dtl)}div.highlight>div table{padding:0 24px;max-height:75vh}div.chroma td:first-of-type{padding:0 18px 0 0}article>pre,span.katex-display,div.highlight>pre{padding:var(--hl-pad)}article>pre,span.katex-display,div.highlight>pre,div.highlight>div.chroma{border:1px solid #222;line-height:1.5rem;max-height:75vh}mark,p code,li code{border-radius:2px;padding:1px 3px;word-break:break-all}p code{word-break:break-word}li a{word-break:break-all}article>header section.tags{margin:.9rem 0 .6rem}article>header section.tags ul{padding:0}article>header section.tags li{display:inline}article>header section.tags a{display:inline-block;margin:0 7.5px 9px 0;padding:6px 15px 9px}ul.posts{padding:0}ul.posts li{margin:.5rem 0}ul.posts a{background:var(--accent);color:var(--dtl);display:flex;margin:15px auto;padding:15px 30px 18px;text-decoration:none;align-items:center;word-break:break-word}ul.posts a p{flex:1;margin:0}ul.posts a time{background-image:linear-gradient(0deg,var(--bgmod),100%,transparent);border-radius:2px;font-size:.85rem;margin-left:1.8rem;padding:0 9px 2px}@media(max-width:768px){ul.posts a{flex-direction:column-reverse;align-items:unset}ul.posts a time{margin:.3rem 0}}span.katex-display{border:1px dashed var(--alt-fg);overflow-x:auto;padding:15px 30px}span.katex-display:focus{border:1px solid #222}img{display:block;max-width:100%;max-height:75vh;outline:3px solid transparent;transition:border-color .3s ease,outline-color .3s ease,filter .3s ease}img.cover{border:1px solid var(--fg);object-fit:cover;width:100%}article p>img{display:block;margin:2rem auto;max-width:100%}figure{margin:1.8rem auto}figure img{display:block;margin:0 auto;max-width:90%}figure figcaption{font-size:.85rem;text-align:center;margin:.75rem;line-height:1.5rem}video{display:block;max-width:91%;max-height:75vh;outline:3px solid transparent;transition:border-color .3s ease,outline-color .3s ease}video:focus,video:hover{border-color:var(--accent);outline-color:var(--accent)}video.gifoid{margin:3rem auto;max-width:90%}audio{display:block;width:90%}img.border,video.border{border:1px solid var(--fg)}img.borderless,video.borderless{border:0}details.toc{background:var(--alt-bg);color:var(--dtl);transition:background-color .3s ease,border .3s ease,linear-gradient .3s ease}details.toc summary{background:var(--accent);border:1px solid rgba(0,0,0,.3);border-radius:2px;box-shadow:inset 0 1px 0 rgba(255,255,255,.2),inset 0 -3px 0 rgba(0,0,0,.3);font-family:oswald,sans-serif;padding:15px 30px 18.5px;outline:2px dashed transparent;outline-offset:3px;text-shadow:0 1px 0 var(--lpress),1px 0 0 var(--lpress);transition:color .3s ease,opacity .2s ease,outline-color .2s ease,padding .2s ease}details.toc summary:hover{opacity:.75}details.toc summary:focus{outline-color:var(--accent)}details.toc[open] summary{border-radius:2px 2px 0 0;box-shadow:inset 0 1px 0 rgba(255,255,255,.2);padding:15px 30px}details.toc[open] summary~*{animation:smoothReveal .3s ease-in-out}details.toc nav#TableOfContents{border-style:solid;border-color:rgba(0,0,0,.3);border-width:0 1px 1px;border-radius:0 0 2px 2px;box-shadow:inset 0 -3px 0 rgba(0,0,0,.3);padding:6px 15px 15px 9px}details.toc nav#TableOfContents li:first-of-type{margin-top:.3rem}details.toc nav#TableOfContents ul li:not(:last-of-type),details.toc nav#TableOfContents ul li ul li:first-of-type,details.toc nav#TableOfContents ul li ol li:first-of-type,details.toc nav#TableOfContents ol li:not(:last-of-type),details.toc nav#TableOfContents ol li ul li:first-of-type,details.toc nav#TableOfContents ol li ol li:first-of-type{margin-bottom:.3rem}#TableOfContents,section.footnotes ol,article>ul,article>ol{line-height:1.5rem}#TableOfContents ul,section.footnotes ol{padding-left:24px}article>ul,article>ul ul,article>ol,article>ol ol{padding:0 24px}#TableOfContents ul li:before,article>ul li:before{content:'';margin-right:12px;background:var(--fg);border-radius:2px;width:18px;height:18px;display:inline-block;margin-bottom:-3px}@keyframes smoothReveal{0%{opacity:0}100%{opacity:1}}a.btn,a.footnote-backref,section.search-box button,section.social a,input[type=submit]{background:var(--accent);border:1px solid rgba(0,0,0,.3);color:var(--dtl);transition:background-color .3s ease,color .3s ease,opacity .2s ease-in-out,outline-color .3s ease;border-radius:2px;box-shadow:inset 0 1px 0 rgba(255,255,255,.2),inset 0 -3px 0 rgba(0,0,0,.3);text-decoration:none;text-shadow:0 1px 0 var(--lpress),1px 0 0 var(--lpress)}a.btn:hover,a.footnote-backref:hover,section.search-box button:hover,section.social a:hover,input[type=submit]:hover{opacity:.75}button,input[type=color],summary{cursor:pointer}li.cats a{font-weight:700}ul.tags{display:flex;flex-wrap:wrap;padding:0}ul.tags a{display:flex;flex:1;align-items:center;margin:0 9px 9px 0;padding:7.5px 18px 10.5px;word-break:keep-all}ul.tags a span{background-image:linear-gradient(0deg,var(--bgmod),100%,transparent);border-radius:2px;margin-left:.45rem;padding:0 6px 1px;font-size:.85rem}ul.pagination{font-family:open sans,sans-serif;font-weight:700;text-align:center;margin:3rem auto 1rem;padding:0;display:flex;flex-wrap:wrap;justify-content:center}ul.pagination li{display:inline-block;transition:background .2s ease-in-out,border .2s ease-in-out}ul.pagination li a,ul.pagination li.current p{display:block;margin:0 9px 9px 0;padding:7.5px 12px 10.5px;width:21px}ul.pagination li a{color:var(--dtl)}ul.pagination li.current p{background:var(--alt-bg);border:1px solid rgba(0,0,0,.45);border-radius:2px;color:var(--alt-fg);line-height:inherit;user-select:none;box-shadow:inset 0 1px 0 rgba(255,255,255,.2),inset 0 -3px 0 rgba(0,0,0,.3);text-shadow:0 1px 0 var(--lpress),1px 0 0 var(--lpress)}ul.pagination svg{fill:currentColor;width:18px;height:18px;display:inline-block;margin:auto auto -2px}section.search-box form{display:flex;flex-wrap:wrap;justify-content:center;align-items:stretch}section.search-box label{color:var(--fg);font-family:oswald,sans-serif;font-weight:700;flex-basis:100%;text-align:left;font-size:.9rem;letter-spacing:.5px;line-height:2rem;text-transform:uppercase}section.search-box input[name=q]{background:var(--input-bg);border:1px solid var(--input-bd);color:var(--input-fg);font-family:open sans,sans-serif;font-size:.9rem;line-height:1.5rem;padding:6px 12px;flex:1;transition:background-color .3s ease,border .3s ease,outline .2s ease-in-out;border-radius:2px 0 0 2px;outline:2px solid transparent}section.search-box input[name=q]:focus{outline-color:var(--accent)}section.search-box button{border-radius:0 2px 2px 0;padding:6px 30px;outline:2px dashed transparent;outline-offset:2px}section.search-box button:focus{outline-color:var(--accent)}section.search-box button:hover{opacity:.75}section.search-box button svg{width:15px;height:15px;fill:currentColor;stroke:var(--lpress);stroke-width:9px}#search-info{margin:1rem 0 2rem}#search-info+ul{margin:0 0 6rem}p.error{color:var(--err)}mark{background:var(--accent);filter:contrast(1.2)invert(1)}abbr{text-decoration-style:solid}blockquote{background:var(--alt-bg);border-style:solid;border-width:1px 1px 1px 12px;color:var(--alt-fg);margin:var(--blk-mg);padding:0 30px}blockquote p{margin:1.2rem 0}kbd{background-color:#eee;border:1px solid #b4b4b4;border-radius:2px;box-shadow:0 1px 1px rgba(0,0,0,.2),0 2px 0 0 rgba(255,255,255,.7)inset;color:#333;display:inline-block;font-size:.85em;font-weight:700;line-height:1;padding:2px;white-space:nowrap}kbd>kbd{margin:0 2px}main{margin:90px auto;padding:0 15px;max-width:660px}article{margin:90px auto 120px}html{--blk-mg: 1.05rem .75rem;--il-pad: 0 12px;--hl-pad: 15.75px 18px}@media(min-width:769px){html{--blk-mg: 2.1rem 1.5rem;--il-pad: 6px 24px;--hl-pad: 21px 24px}}@media(min-width:769px){a.anchor:not(:focus){opacity:0}h6>a:focus+a.anchor,h6:hover>a.anchor,h5>a:focus+a.anchor,h5:hover>a.anchor,h4>a:focus+a.anchor,h4:hover>a.anchor,h3>a:focus+a.anchor,h3:hover>a.anchor,h2>a:focus+a.anchor,h2:hover>a.anchor{opacity:1}}p.noscript{font-weight:700}blockquote.twitter-tweet{border-color:#1da0f1;padding:0 30px 27px}div.__h_instagram{margin:2rem auto}div.__h_instagram a:nth-child(2){display:block;margin:.6rem 0;line-height:0}div.__h_instagram a:nth-child(2):hover{opacity:.75}div.__h_instagram img{border:1px solid var(--fg);max-width:100%;object-fit:cover}h2#vimeo-simple-shortcode{margin-bottom:1rem}div.s_video_simple{margin:0 auto;width:96%}div.s_video_simple a{border:1px solid var(--fg);display:block;margin:6px;line-height:0}div.s_video_simple a:hover{opacity:.75}section.youtube{border:1px solid var(--fg);margin:2rem 0;padding-bottom:56.25%;position:relative;overflow:hidden;height:0}section.info img{border:3px solid var(--fg);border-radius:9px} \ No newline at end of file +@font-face{font-family:oswald;font-style:normal;font-weight:700;font-display:swap;src:local("Oswald"),url(../fonts/oswald-v29-latin-700.woff2)format("woff2"),url(../fonts/oswald-v29-latin-700.woff)format("woff")}@font-face{font-family:open sans;font-style:normal;font-weight:400;font-display:swap;src:local("Open Sans Regular"),local("OpenSans-Regular"),url(../fonts/open-sans-v17-latin-regular.woff2)format("woff2"),url(../fonts/open-sans-v17-latin-regular.woff)format("woff")}@font-face{font-family:open sans;font-style:normal;font-weight:700;font-display:swap;src:local("Open Sans Bold"),local("OpenSans-Bold"),url(../fonts/open-sans-v17-latin-700.woff2)format("woff2"),url(../fonts/open-sans-v17-latin-700.woff)format("woff")}@font-face{font-family:open sans;font-style:italic;font-weight:400;font-display:swap;src:local("Open Sans Italic"),local("OpenSans-Italic"),url(../fonts/open-sans-v17-latin-italic.woff2)format("woff2"),url(../fonts/open-sans-v17-latin-italic.woff)format("woff")}:root{font-size:18px}html{scroll-behavior:smooth}html[data-mode=light]{--bg: #ddd;--fg: #444;--alt-bg: #d6d6d6;--alt-fg: #333;--dtl: #fdfdfd;--err: #c70000;--bgmod: rgba(0, 0, 0, 0.3);--input-bg: #fefefe;--input-fg: #111;--input-bd: #ccc;--lpress: rgba(0, 0, 0, 0.2);--rlpress: rgba(255, 255, 255, 0.2)}html[data-mode=light] .chroma,html[data-mode=light] pre,html[data-mode=light] p code,html[data-mode=light] li code{color:#93a1a1;background-color:#002b36}html[data-mode=light] .chroma .lntd{vertical-align:top;padding:0;margin:0;border:0}html[data-mode=light] .chroma .lntable{border-spacing:0;margin:0;border:0;width:auto;display:block}html[data-mode=light] .chroma .hl{display:block;width:100%;background-color:rgba(0,0,0,.3)}html[data-mode=light] .chroma .nb{color:#b58900}html[data-mode=light] .chroma .ge{font-style:italic}html[data-mode=light] .chroma .gr{color:#e8625f;font-weight:700}html[data-mode=light] .chroma .gs{font-weight:700}html[data-mode=light] .chroma .x,html[data-mode=light] .chroma .kc,html[data-mode=light] .chroma .no,html[data-mode=light] .chroma .ni,html[data-mode=light] .chroma .ne,html[data-mode=light] .chroma .se,html[data-mode=light] .chroma .gh{color:#e9662f}html[data-mode=light] .chroma .lnt,html[data-mode=light] .chroma .ln{margin-right:.4em;padding:0 .4em;color:#848f8f}html[data-mode=light] .chroma .k,html[data-mode=light] .chroma .kn,html[data-mode=light] .chroma .kp,html[data-mode=light] .chroma .o,html[data-mode=light] .chroma .ow,html[data-mode=light] .chroma .cs,html[data-mode=light] .chroma .cp,html[data-mode=light] .chroma .cpf,html[data-mode=light] .chroma .gi{color:#859900}html[data-mode=light] .chroma .kd,html[data-mode=light] .chroma .kr,html[data-mode=light] .chroma .bp,html[data-mode=light] .chroma .nc,html[data-mode=light] .chroma .nd,html[data-mode=light] .chroma .nf,html[data-mode=light] .chroma .nt,html[data-mode=light] .chroma .nv,html[data-mode=light] .chroma .gu{color:#3294da}html[data-mode=light] .chroma .kt,html[data-mode=light] .chroma .sr,html[data-mode=light] .chroma .gd{color:#e8625f}html[data-mode=light] .chroma .s,html[data-mode=light] .chroma .sa,html[data-mode=light] .chroma .sc,html[data-mode=light] .chroma .dl,html[data-mode=light] .chroma .s2,html[data-mode=light] .chroma .si,html[data-mode=light] .chroma .sx,html[data-mode=light] .chroma .s1,html[data-mode=light] .chroma .ss,html[data-mode=light] .chroma .m,html[data-mode=light] .chroma .mb,html[data-mode=light] .chroma .mf,html[data-mode=light] .chroma .mh,html[data-mode=light] .chroma .mi,html[data-mode=light] .chroma .il,html[data-mode=light] .chroma .mo{color:#2aa198}html[data-mode=light] .chroma .sb,html[data-mode=light] .chroma .c,html[data-mode=light] .chroma .ch,html[data-mode=light] .chroma .cm,html[data-mode=light] .chroma .c1{color:#759299}html[data-mode=dark]{--bg: #1f1f1f;--fg: #bbb;--alt-bg: #1c1c1c;--alt-fg: #ddd;--dtl: #1a1a1a;--err: #ff3131;--bgmod: rgba(255, 255, 255, 0.3);--input-bg: #222;--input-fg: #f0f0f0;--input-bd: #262626;--lpress: rgba(255, 255, 255, 0.2);--rlpress: rgba(0, 0, 0, 0.2)}html[data-mode=dark] img{filter:contrast(0.85)grayscale(0.3)}html[data-mode=dark] .chroma,html[data-mode=dark] pre,html[data-mode=dark] p code,html[data-mode=dark] li code{color:#f8f8f2;background:#272822}html[data-mode=dark] .chroma .err{color:#eb0083;background-color:#1e0010}html[data-mode=dark] .chroma .lntd{vertical-align:top;padding:0;margin:0;border:0}html[data-mode=dark] .chroma .lntable{border-spacing:0;margin:0;border:0;width:auto;display:block}html[data-mode=dark] .chroma .hl{display:block;width:100%;background-color:rgba(0,0,0,.3)}html[data-mode=dark] .chroma .ge{font-style:italic}html[data-mode=dark] .chroma .gs{font-weight:700}html[data-mode=dark] .chroma .lnt,html[data-mode=dark] .chroma .ln{margin-right:.4em;padding:0 .4em;color:#8e8e8e}html[data-mode=dark] .chroma .k,html[data-mode=dark] .chroma .kc,html[data-mode=dark] .chroma .kd,html[data-mode=dark] .chroma .kp,html[data-mode=dark] .chroma .kr,html[data-mode=dark] .chroma .kt,html[data-mode=dark] .chroma .no{color:#66d9ef}html[data-mode=dark] .chroma .kn,html[data-mode=dark] .chroma .nt,html[data-mode=dark] .chroma .o,html[data-mode=dark] .chroma .ow,html[data-mode=dark] .chroma .gd{color:#f94e8a}html[data-mode=dark] .chroma .na,html[data-mode=dark] .chroma .nc,html[data-mode=dark] .chroma .nd,html[data-mode=dark] .chroma .ne,html[data-mode=dark] .chroma .nf,html[data-mode=dark] .chroma .nx,html[data-mode=dark] .chroma .gi{color:#a6e22e}html[data-mode=dark] .chroma .l,html[data-mode=dark] .chroma .se,html[data-mode=dark] .chroma .m,html[data-mode=dark] .chroma .mb,html[data-mode=dark] .chroma .mf,html[data-mode=dark] .chroma .mh,html[data-mode=dark] .chroma .mi,html[data-mode=dark] .chroma .il,html[data-mode=dark] .chroma .mo{color:#ae81ff}html[data-mode=dark] .chroma .ld,html[data-mode=dark] .chroma .s,html[data-mode=dark] .chroma .sa,html[data-mode=dark] .chroma .sb,html[data-mode=dark] .chroma .sc,html[data-mode=dark] .chroma .dl,html[data-mode=dark] .chroma .sd,html[data-mode=dark] .chroma .s2,html[data-mode=dark] .chroma .sh,html[data-mode=dark] .chroma .si,html[data-mode=dark] .chroma .sx,html[data-mode=dark] .chroma .sr,html[data-mode=dark] .chroma .s1,html[data-mode=dark] .chroma .ss{color:#e6db74}html[data-mode=dark] .chroma .c,html[data-mode=dark] .chroma .ch,html[data-mode=dark] .chroma .cm,html[data-mode=dark] .chroma .c1,html[data-mode=dark] .chroma .cs,html[data-mode=dark] .chroma .cp,html[data-mode=dark] .chroma .cpf,html[data-mode=dark] .chroma .gu{color:#949076}body{margin:0;padding:0;font-family:open sans,sans-serif;background:var(--bg);color:var(--fg);display:flex;min-height:100vh;flex-direction:column}body a{color:var(--accent);outline:2px dashed transparent;outline-offset:2px;transition:opacity .2s ease-in-out,outline .2s ease-in-out;word-break:break-word}body a:focus{outline-color:var(--accent)}body a:hover{opacity:.75}body>header,body>footer{background:var(--alt-bg);color:var(--alt-fg);text-align:center}body>header{padding:0 1.5rem 1rem}body>header nav{margin:.5rem 0 0}body>header nav ul{margin:0;padding:0;display:flex;flex-wrap:wrap;justify-content:center}body>header nav ul a{display:block;word-break:keep-all;margin:0 7.5px 15px;padding:9px 21px 12px;font-size:.75rem;font-weight:700;text-transform:uppercase}body>footer{padding:1rem 3rem}body>footer p{line-height:1.8rem;margin:.75rem 0;white-space:pre-wrap}body>footer a{transition:opacity .2s ease-in-out,outline-color .3s ease}body>footer a:hover{opacity:.75}body>footer section{padding:6px 0 12px}body>footer section input{border:1px solid var(--fg);outline-offset:3px;padding:0}body>footer section input::-webkit-color-swatch{border:none}body>footer section input::-webkit-color-swatch-wrapper{padding:0}body>footer section button{background:0;border:0;padding:3px 3px 0}body>footer section button svg{fill:var(--fg);stroke:var(--lpress);stroke-width:.6rem}body>footer section input,body>footer section button{margin:0 7.5px;outline:2px dashed transparent;transition:outline .2s ease-in-out,transform .2s ease-in-out}body>footer section input:focus,body>footer section button:focus{outline-color:var(--accent)}body>footer section input:hover,body>footer section button:hover{transform:scale(1.2)}body>footer section input::-moz-focus-inner,body>footer section button::-moz-focus-inner{border:0}body>footer section input,body>footer section button svg{width:42px;height:42px}ol,ul{list-style:none}h1{text-shadow:0 1px 0 var(--rlpress),1px 0 0 var(--rlpress)}hr{border:1px solid var(--lpress);margin:2.4rem 0 1.2rem}::selection{background:var(--accent);color:#f0f0f0;text-shadow:none}div.filler{flex:1;align-items:center;justify-content:center}article>header h1{line-height:3rem}article>header img{margin:1rem 0 0}article>header p{font-size:.9rem;font-style:italic}h6,h5,h4,h3,h2,h1{font-family:oswald,sans-serif;font-weight:700}h1{font-size:2.25rem}h2{font-size:2rem}h3{font-size:1.75rem}h4{font-size:1.5rem}h5{font-size:1.25rem}h6{font-size:1rem}main p{line-height:1.65rem}code{font-family:monospace}body>header>a{font-family:oswald,sans-serif;font-size:2.1rem;font-weight:700;transition:color .3s ease,opacity .2s ease-in-out,outline-color .3s ease;text-shadow:0 1px 0 var(--rlpress),1px 0 0 var(--rlpress);display:inline-block;margin:1.5rem 0 .75rem}article>header{margin:0 0 2rem}article>header h1{margin:9px 0}article>header p{margin:0}article h2,article h3{margin:2rem 0 1rem}article p{margin:1.5rem 0}h6+p,h5+p,h4+p,h3+p,h2+p,h1+p{margin-top:0}h6,h5,h4,h3,h2{padding-top:1rem}audio,img,video{margin:1.8rem auto}a.anchor{background-image:none}a.anchor svg{fill:var(--accent);vertical-align:middle;width:24px;height:24px}h2 a.anchor{margin:0 0 0 .65rem}h2 a.anchor svg{transform:scale(1.7)}h3 a.anchor{margin:0 0 0 .55rem}h3 a.anchor svg{transform:scale(1.525)}h4 a.anchor{margin:0 0 0 .45rem}h4 a.anchor svg{transform:scale(1.35)}h5 a.anchor{margin:0 0 0 .35rem}h5 a.anchor svg{transform:scale(1.175)}h6 a.anchor{margin:0 0 0 .25rem}h6 a.anchor svg{transform:scale(1)}label,span.lnt,summary,sup.footnote-ref{user-select:none}article ol li,article ul li{margin-bottom:.45rem}ol{counter-reset:a-counter}ol li{counter-increment:a-counter}ol li::before{content:counter(a-counter)"";font-size:.85rem;font-weight:700;text-shadow:0 1px 0 var(--lpress),1px 0 0 var(--lpress);background:var(--fg);border:1px solid var(--lpress);border-radius:2px;color:var(--bg);margin-right:12px;padding:2px 7.5px}section.footnotes{border-top:2px solid var(--fg);display:block;margin-top:2.4rem;padding:1rem 1rem 1.8rem}section.footnotes h2{margin:0 0 2rem}section.footnotes a{word-break:break-word}section.footnotes ol li p:first-of-type{display:inline}section.footnotes a.footnote-backref{margin:0 0 0 9px;padding:0 9px;vertical-align:middle}section.footnotes a.footnote-backref svg{fill:var(--dtl);stroke:var(--lpress);stroke-width:.6rem;width:18px;height:18px}section.footnotes hr{display:none}sup{line-height:0}sup a.footnote-ref{text-decoration:none}sup a.footnote-ref::before{content:'['}sup a.footnote-ref::after{content:']'}code,.chroma,.chroma span{transition:background-color .3s ease,color .3s ease}article>pre,section.scroll,span.katex-display,div.highlight>pre,div.highlight>div{overflow-x:auto;transition:background-color .3s ease,color .3s ease,outline-color .3s ease;outline:3px solid transparent}article>pre:focus,section.scroll:focus,span.katex-display:focus,div.highlight>pre:focus,div.highlight>div:focus{outline-color:var(--accent)}section.scroll{border:1px solid var(--fg)}section.scroll>table{border-collapse:collapse;color:var(--fg);font-family:open sans,sans-serif;min-width:600px;width:100%}section.scroll>table td+td{border-left:1px solid var(--fg)}section.scroll>table tr+tr{border-top:1px solid var(--fg)}section.scroll>table tr:not(:first-child):last-of-type{border-bottom:1px solid var(--fg)}section.scroll>table td,section.scroll>table th{padding:9px}section.scroll>table th{background:var(--fg);color:var(--bg)}section.scroll>table tr{transition:background .2s ease-in-out,color .2s ease-in-out}section.scroll>table tr:nth-child(even){background:var(--alt-bg)}section.scroll>table tr:nth-child(odd){background:var(--bg)}section.scroll>table tr:hover{background:var(--accent);color:var(--dtl)}div.highlight>div table{padding:0 24px;max-height:75vh}div.chroma td:first-of-type{padding:0 18px 0 0}article>pre,span.katex-display,div.highlight>pre{padding:var(--hl-pad)}article>pre,span.katex-display,div.highlight>pre,div.highlight>div.chroma{border:1px solid #222;line-height:1.5rem;max-height:75vh}mark,p code,li code{border-radius:2px;padding:1px 3px}li a{word-break:break-all}article>header section.tags{margin:.9rem 0 .6rem}article>header section.tags ul{padding:0}article>header section.tags li{display:inline}article>header section.tags a{display:inline-block;margin:0 7.5px 9px 0;padding:6px 15px 9px}ul.posts{padding:0}ul.posts li{margin:.5rem 0}ul.posts a{background:var(--accent);color:var(--dtl);display:flex;margin:15px auto;padding:15px 30px 18px;text-decoration:none;align-items:center;word-break:break-word}ul.posts a p{flex:1;margin:0}ul.posts a time{background-image:linear-gradient(0deg,var(--bgmod),100%,transparent);border-radius:2px;font-size:.85rem;margin-left:1.8rem;padding:0 9px 2px}@media(max-width:768px){ul.posts a{flex-direction:column-reverse;align-items:unset}ul.posts a time{margin:.3rem 0}}span.katex-display{border:1px dashed var(--alt-fg);overflow-x:auto;padding:15px 30px}span.katex-display:focus{border:1px solid #222}img{display:block;max-width:100%;max-height:75vh;outline:3px solid transparent;transition:border-color .3s ease,outline-color .3s ease,filter .3s ease}img.cover{border:1px solid var(--fg);object-fit:cover;width:100%}article p>img{display:block;margin:2rem auto;max-width:100%}figure{margin:1.8rem auto}figure img{display:block;margin:0 auto;max-width:90%}figure figcaption{font-size:.85rem;text-align:center;margin:.75rem;line-height:1.5rem}video{display:block;max-width:91%;max-height:75vh;outline:3px solid transparent;transition:border-color .3s ease,outline-color .3s ease}video:focus,video:hover{border-color:var(--accent);outline-color:var(--accent)}video.gifoid{margin:3rem auto;max-width:90%}audio{display:block;width:90%}img.border,video.border{border:1px solid var(--fg)}img.borderless,video.borderless{border:0}details.toc{background:var(--alt-bg);color:var(--dtl);transition:background-color .3s ease,border .3s ease,linear-gradient .3s ease}details.toc summary{background:var(--accent);border:1px solid rgba(0,0,0,.3);border-radius:2px;box-shadow:inset 0 1px 0 rgba(255,255,255,.2),inset 0 -3px 0 rgba(0,0,0,.3);font-family:oswald,sans-serif;padding:15px 30px 18.5px;outline:2px dashed transparent;outline-offset:3px;text-shadow:0 1px 0 var(--lpress),1px 0 0 var(--lpress);transition:color .3s ease,opacity .2s ease,outline-color .3s ease,padding .2s ease}details.toc summary:hover{opacity:.75}details.toc summary:focus{outline-color:var(--accent)}details.toc[open] summary{border-radius:2px 2px 0 0;box-shadow:inset 0 1px 0 rgba(255,255,255,.2);padding:15px 30px}details.toc[open] summary~*{animation:smoothReveal .3s ease-in-out}details.toc nav#TableOfContents{border-style:solid;border-color:rgba(0,0,0,.3);border-width:0 1px 1px;border-radius:0 0 2px 2px;box-shadow:inset 0 -3px 0 rgba(0,0,0,.3);padding:6px 15px 15px 9px}details.toc nav#TableOfContents li:first-of-type{margin-top:.3rem}details.toc nav#TableOfContents ul li:not(:last-of-type),details.toc nav#TableOfContents ul li ul li:first-of-type,details.toc nav#TableOfContents ul li ol li:first-of-type,details.toc nav#TableOfContents ol li:not(:last-of-type),details.toc nav#TableOfContents ol li ul li:first-of-type,details.toc nav#TableOfContents ol li ol li:first-of-type{margin-bottom:.3rem}#TableOfContents,section.footnotes ol,article>ul,article>ol{line-height:1.5rem}#TableOfContents ul,section.footnotes ol{padding-left:24px}article>ul,article>ul ul,article>ol,article>ol ol{padding:0 24px}#TableOfContents ul li:before,article>ul li:before{content:'';margin-right:12px;background:var(--fg);border-radius:2px;width:18px;height:18px;display:inline-block;margin-bottom:-3px}@keyframes smoothReveal{0%{opacity:0}100%{opacity:1}}.btn,a.footnote-backref,input[type=submit]{background:var(--accent);border:1px solid rgba(0,0,0,.3);color:var(--dtl);transition:background-color .3s ease,color .3s ease,opacity .2s ease-in-out,outline-color .3s ease;border-radius:2px;box-shadow:inset 0 1px 0 rgba(255,255,255,.2),inset 0 -3px 0 rgba(0,0,0,.3);text-decoration:none;text-shadow:0 1px 0 var(--lpress),1px 0 0 var(--lpress)}.btn:hover,a.footnote-backref:hover,input[type=submit]:hover{opacity:.75}button,input[type=color],summary{cursor:pointer}li.cats a{font-weight:700}ul.tags{display:flex;flex-wrap:wrap;padding:0}ul.tags a{display:flex;flex:1;align-items:center;margin:0 9px 9px 0;padding:7.5px 18px 10.5px;word-break:keep-all}ul.tags a span{background-image:linear-gradient(0deg,var(--bgmod),100%,transparent);border-radius:2px;margin-left:.45rem;padding:0 6px 1px;font-size:.85rem}ul.pagination{font-family:open sans,sans-serif;font-weight:700;text-align:center;margin:3rem auto 1rem;display:flex;flex-wrap:wrap;justify-content:center}ul.pagination li{display:inline-block;transition:background .2s ease-in-out,border .2s ease-in-out}ul.pagination li a,ul.pagination li.current p{display:block;margin:0 9px 9px 0;padding:7.5px 12px 10.5px;width:21px}ul.pagination li a{color:var(--dtl)}ul.pagination li.current p{background:var(--alt-bg);border:1px solid rgba(0,0,0,.45);border-radius:2px;color:var(--alt-fg);line-height:inherit;user-select:none;box-shadow:inset 0 1px 0 rgba(255,255,255,.2),inset 0 -3px 0 rgba(0,0,0,.3);text-shadow:0 1px 0 var(--lpress),1px 0 0 var(--lpress)}ul.pagination svg{fill:currentColor;width:18px;height:18px;display:inline-block;margin:auto auto -2px}.label-form{margin-top:1rem;font-family:oswald,sans-serif;font-weight:700;font-size:.9rem;letter-spacing:.5px;text-transform:uppercase;user-select:none}.input-text{background:var(--input-bg);border:1px solid var(--input-bd);color:var(--input-fg);font-family:open sans,sans-serif;font-size:.9rem;line-height:1.5rem;transition:background-color .3s ease,border .3s ease,outline .2s ease-in-out;outline:2px solid transparent}.input-text:focus{outline-color:var(--accent)}section.search-box form{display:flex;flex-wrap:wrap;justify-content:center;align-items:stretch}section.search-box label{flex-basis:100%;line-height:2rem}section.search-box input[name=q]{padding:6px 12px;flex:1;border-radius:2px 0 0 2px}section.search-box button{border-radius:0 2px 2px 0;padding:6px 30px;outline:2px dashed transparent;outline-offset:2px}section.search-box button:focus{outline-color:var(--accent)}section.search-box button:hover{opacity:.75}section.search-box button svg{width:15px;height:15px;fill:currentColor;stroke:var(--lpress);stroke-width:9px}#search-info{margin:1rem 0 2rem}#search-info+ul{margin:0 0 6rem}p.error{color:var(--err)}mark{background:var(--accent);filter:contrast(1.2)invert(1)}abbr{text-decoration-style:solid}blockquote{background:var(--alt-bg);border-style:solid;border-width:1px 1px 1px 12px;color:var(--alt-fg);margin:var(--blk-mg);padding:0 30px}blockquote p{margin:1.2rem 0}kbd{background-color:#eee;border:1px solid #b4b4b4;border-radius:2px;box-shadow:0 1px 1px rgba(0,0,0,.2),0 2px 0 0 rgba(255,255,255,.7)inset;color:#333;display:inline-block;font-size:.85em;font-weight:700;line-height:1;padding:2px;white-space:nowrap}kbd>kbd{margin:0 2px}main{margin:90px auto;padding:0 15px;max-width:660px}article{margin:90px auto 120px}html{--blk-mg: 1.05rem .75rem;--il-pad: 0 12px;--hl-pad: 15.75px 18px}@media(min-width:769px){html{--blk-mg: 2.1rem 1.5rem;--il-pad: 6px 24px;--hl-pad: 21px 24px}}@media(min-width:769px){a.anchor:not(:focus){opacity:0}h6>a:focus+a.anchor,h6:hover>a.anchor,h5>a:focus+a.anchor,h5:hover>a.anchor,h4>a:focus+a.anchor,h4:hover>a.anchor,h3>a:focus+a.anchor,h3:hover>a.anchor,h2>a:focus+a.anchor,h2:hover>a.anchor{opacity:1}}p.noscript{font-weight:700}blockquote.twitter-tweet{border-color:#1da0f1;padding:0 30px 27px}div.__h_instagram{margin:2rem auto}div.__h_instagram a:nth-child(2){display:block;margin:.6rem 0;line-height:0}div.__h_instagram a:nth-child(2):hover{opacity:.75}div.__h_instagram img{border:1px solid var(--fg);max-width:100%;object-fit:cover}h2#vimeo-simple-shortcode{margin-bottom:1rem}div.s_video_simple{margin:0 auto;width:96%}div.s_video_simple a{border:1px solid var(--fg);display:block;margin:6px;line-height:0}div.s_video_simple a:hover{opacity:.75}section.youtube{border:1px solid var(--fg);margin:2rem 0;padding-bottom:56.25%;position:relative;overflow:hidden;height:0}section.info img{border:3px solid var(--fg);border-radius:9px} \ No newline at end of file diff --git a/exampleSite/resources/_gen/assets/scss/scss/main.scss_694b6a5caed62875bf9278dff98b7f5e.json b/exampleSite/resources/_gen/assets/scss/scss/main.scss_694b6a5caed62875bf9278dff98b7f5e.json index fd5720f..97fca3a 100644 --- a/exampleSite/resources/_gen/assets/scss/scss/main.scss_694b6a5caed62875bf9278dff98b7f5e.json +++ b/exampleSite/resources/_gen/assets/scss/scss/main.scss_694b6a5caed62875bf9278dff98b7f5e.json @@ -1 +1 @@ -{"Target":"css/main.min.b7a690e66eaa7eff6e5255325a9837b4f4d5ac221a1a7470ea99498ebb4b394c0e4b02b7b3260ca730bb2846ed69aab02b7879101a4bcd889e7e0c65175097f0.css","MediaType":"text/css","Data":{"Integrity":"sha512-t6aQ5m6qfv9uUlUyWpg3tPTVrCIaGnRw6plJjrtLOUwOSwK3syYMpzC7KEbtaaqwK3h5EBpLzYiefgxlF1CX8A=="}} \ No newline at end of file +{"Target":"css/main.min.a0e13b917aed3a4adadf6313a5ca68ad211a0a36e20085d3b41bddb6bf79cf5666718864b01c859b42f8c186e1643b3640e572de822bba43ad17b2e08289b227.css","MediaType":"text/css","Data":{"Integrity":"sha512-oOE7kXrtOkra32MTpcporSEaCjbiAIXTtBvdtr95z1ZmcYhksByFm0L4wYbhZDs2QOVy3oIrukOtF7LggomyJw=="}} \ No newline at end of file diff --git a/layouts/partials/head.html b/layouts/partials/head.html index 2d334f8..d6b53cc 100644 --- a/layouts/partials/head.html +++ b/layouts/partials/head.html @@ -375,8 +375,10 @@ -{{ range (readDir "/public/fonts") }} - +{{ with (readDir "/public/fonts") }} + {{ range . }} + + {{ end }} {{ end }} diff --git a/layouts/partials/search-form.html b/layouts/partials/search-form.html index 8f3813d..84d67e6 100644 --- a/layouts/partials/search-form.html +++ b/layouts/partials/search-form.html @@ -13,7 +13,7 @@ {{ else }}
{{ end }} - +

diff --git a/layouts/shortcodes/contact-form.html b/layouts/shortcodes/contact-form.html index 8dd4401..43f165e 100644 --- a/layouts/shortcodes/contact-form.html +++ b/layouts/shortcodes/contact-form.html @@ -6,16 +6,16 @@
-