From 027705772368dc49efb801aa2d71f251c5df241e Mon Sep 17 00:00:00 2001 From: Katherina Walshe-Grey Date: Sun, 30 Jun 2024 16:30:20 +0100 Subject: [PATCH] Basic CSS --- assets/css/main.css | 163 +++++++++++++++++++++++++++++++---- layouts/_default/baseof.html | 8 +- layouts/_default/home.html | 4 +- layouts/_default/list.html | 4 +- layouts/_default/single.html | 6 +- layouts/partials/footer.html | 1 + layouts/partials/header.html | 4 +- layouts/partials/menu.html | 2 +- 8 files changed, 165 insertions(+), 27 deletions(-) diff --git a/assets/css/main.css b/assets/css/main.css index 166ade9..9893845 100644 --- a/assets/css/main.css +++ b/assets/css/main.css @@ -1,22 +1,153 @@ +/* TYPOGRAPHY */ + body { - color: #222; - font-family: sans-serif; - line-height: 1.5; - margin: 1rem; - max-width: 768px; -} - -header { - border-bottom: 1px solid #222; - margin-bottom: 1rem; -} - -footer { - border-top: 1px solid #222; - margin-top: 1rem; + /* TODO: add custom font */ + font-family: "Palatino Linotype", Palatino, Palladio, "URW Palladio L", "Book Antiqua", Baskerville, "Bookman Old Style", "Bitstream Charter", "Nimbus Roman No9 L", Garamond, "Apple Garamond", "ITC Garamond Narrow", "New Century Schoolbook", "Century Schoolbook", "Century Schoolbook L", Georgia, serif; + font-size-adjust: 0.5; + background-color: white; + color: #111; } a { - color: #00e; text-decoration: none; } + +a:hover { + text-decoration: underline; +} + +h1 a { + color: black; + transition-duration: 0.2s; +} + +h1 a:hover { + color: #303030; + text-decoration: none; +} + +h1 { + line-height: 1.2; +} + +hr { + border: 0; + height: 1px; + background: #ccc; + max-width: 40em; + margin: 4em auto; + text-align: center; +} + + +/* LAYOUT */ + +body { + margin: 0; + padding: 0; + font-size: 100%; +} + +.layout-header { + margin: 0 auto; + padding: 1rem 2rem; + opacity: 0.4; + transition-property: opacity; + transition-duration: 0.4s; +} + +.layout-header:hover { + opacity: 1; +} + +.layout-page-title { + display: inline; + font-size: 1.6rem; +} + +.layout-description { + display: none; +} + +.layout-menu { + display: inline; + margin: 0 1rem; + line-height: 2.4em; +} + +.layout-menu ul { + list-style: none; + margin: 0; + padding: 0; + + display: inline-flex; + gap: 1em; +} + +.layout-menu a { + color: #767676; +} + +.layout-description { + color: #444; + font-size: 1.1em; + margin-top: 0.5em; + line-height: 1.5; +} + +.layout-main { + max-width: 50rem; + margin: 1rem auto; +} + +.layout-post { + padding: 0.5em 2rem 1.5em; +} + +.layout-footer { + text-align: center; + padding: 0 2rem 4rem; + color: #444; +} + + +/* LAYOUT (SPECIFIC PAGES) */ + +.kind-home .layout-header { + margin: 3rem auto 4rem; + padding: 0 1rem; + text-align: center; + max-width: 50rem; + opacity: 1; +} + +.kind-home .layout-menu { + display: block; + margin: 1rem 0; +} + +.kind-home .layout-menu ul { + gap: 1.5em; +} + +.kind-home .layout-description { + display: block; +} + +.kind-page .layout-post { + max-width: 40rem; + margin: 0 auto 2rem; + font-size: 1.2em; + line-height: 1.5; +} + +.kind-page .layout-post-title { + font-size: 1.5em; + margin: 0 0 1em; +} + +.kind-page .layout-post-time { + display: block; + color: #666; + margin: -1em 0 1em; +} \ No newline at end of file diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html index 479c897..e722db3 100644 --- a/layouts/_default/baseof.html +++ b/layouts/_default/baseof.html @@ -3,14 +3,14 @@ {{ partial "head.html" . }} - -
+ +
{{ partial "header.html" . }}
-
+
{{ block "main" . }}{{ end }}
-