From f97270c33147199c15718f4b58b68541b824d56a Mon Sep 17 00:00:00 2001 From: "C. Lente" <7017340+clente@users.noreply.github.com> Date: Tue, 25 Apr 2023 17:57:50 -0300 Subject: Add Herman style --- assets/herman.css | 180 +++++++++++++++++++++++++++++++++++++++++++ layouts/_default/baseof.html | 2 +- layouts/_default/single.html | 2 +- 3 files changed, 182 insertions(+), 2 deletions(-) create mode 100644 assets/herman.css diff --git a/assets/herman.css b/assets/herman.css new file mode 100644 index 0000000..509af4a --- /dev/null +++ b/assets/herman.css @@ -0,0 +1,180 @@ +:root { + --color-dark: hsl(228, 15%, 11%); /* 1a1a1a */ + --color-light: #fafafa; + --color-primary: #1a8fe3; + --spacing: 1.5rem; +} + +body { + background: var(--color-dark); + color: var(--color-light); + padding: 2.5rem; + font-family: Avenir, 'Avenir Next LT Pro', Montserrat, Corbel, 'URW Gothic', + source-sans-pro, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", + "Segoe UI Symbol", "Noto Color Emoji"; + font-size: 1.2rem; + line-height: 1.4; + min-height: 100vh; + max-width: 1600px; + margin: 0 auto; + word-wrap: break-word; +} + +header, +main, +footer { + max-width: 70ch; + margin-inline: auto; +} + +header { + padding-bottom: var(--spacing); +} + +nav a, a.blog-tags { + margin-right: calc(var(--spacing) / 3); +} +a.blog-tags { + line-height: 1.8; +} + +main { + padding-bottom: var(--spacing); +} + +footer { + text-align: center; + padding-top: var(--spacing); +} + +a { + color: currentColor; + text-decoration-color: var(--color-primary); + text-decoration-thickness: 0.3ex; + text-underline-offset: 0.3ex; +} + +a:hover { + text-decoration-thickness: 0.4ex; +} + +img { + display: block; + max-width: 100%; + height: auto; +} + +h1, +h2, +h3, +h4, +h5 { + font-weight: 700; + line-height: 1.3; +} + +h1 { + font-size: 3.55rem; +} +h2 { + font-size: 2.66rem; +} +h3 { + font-size: 2rem; +} +h4 { + font-size: 1.5rem; +} +h5 { + font-size: 1.13rem; +} + +ul, +ol { + padding-inline-start: var(--spacing); +} +li { + margin-block-start: var(--spacing); +} + +blockquote { + padding-inline-start: var(--spacing); + border-inline-start: 0.2em solid; + font-style: italic; +} + +:is(h1, h2, h3, h4, h5, blockquote) { + margin-block-end: calc(var(--spacing) / 2); +} +:is(h1, h2, h3, h4, h5) + * { + margin-block-start: calc(var(--spacing) / 3); +} +:is(h1, h2, h3, h4, h5) + :where(h2, h3, h4, h5) { + margin-block-start: calc(var(--spacing) * 2); +} + +blockquote { + max-width: 50ch; +} + +.title { + text-decoration: none; +} +.title h1 { + font-size: 2rem; + margin-top: calc(var(--spacing) / 2); +} + +ul.blog-posts { + list-style-type: none; + padding: unset; +} +ul.blog-posts li { + display: flex; + flex-direction: column; +} +@media screen and (min-width: 600px) { + ul.blog-posts li { + flex-direction: row; + gap: calc(var(--spacing) / 2); + } +} +ul.blog-posts li span { + min-width: 11ch; +} +time { + opacity: 0.5; + font-style: normal; +} + +code { + padding: 1px calc(var(--spacing) / 4); + color: #f8f8f2; + background-color: #282a36; + font-size: 1rem; +} + +pre code { + display: block; + padding: calc(var(--spacing) / 2); + white-space: pre-wrap; + overflow-x: auto; +} + +table { + width: 100%; +} +table, +th, +td { + border: 1px solid; + border-collapse: collapse; + border-color: var(--color-light); + padding: calc(var(--spacing) / 2); +} + +.disabled { + color: currentColor; + cursor: not-allowed; + opacity: 0.5; +} diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html index 7aa0605..0b0cdff 100644 --- a/layouts/_default/baseof.html +++ b/layouts/_default/baseof.html @@ -11,7 +11,7 @@ {{- partial "seo_tags.html" . -}} - {{ $style := resources.Get "style.css" | minify }} + {{ $style := resources.Get "herman.css" | minify }} {{ $syntax := resources.Get "syntax.css" | minify }} diff --git a/layouts/_default/single.html b/layouts/_default/single.html index cd6b095..6c6ee69 100644 --- a/layouts/_default/single.html +++ b/layouts/_default/single.html @@ -14,7 +14,7 @@
{{ range (.GetTerms "tags") }} - #{{ .LinkTitle }} + #{{ .LinkTitle }} {{ end }}
{{ end }} -- cgit v1.2.3