From b3a68d6838bfa3560b4718cf8437ffb4b1fa3eea Mon Sep 17 00:00:00 2001 From: Toby Vincent Date: Thu, 18 May 2023 00:54:27 -0500 Subject: feat: create templates and basic content pages --- sass/style.scss | 166 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 166 insertions(+) create mode 100644 sass/style.scss (limited to 'sass') diff --git a/sass/style.scss b/sass/style.scss new file mode 100644 index 0000000..833d2c7 --- /dev/null +++ b/sass/style.scss @@ -0,0 +1,166 @@ +// gruvbox colors +@media (prefers-color-scheme: dark) { + :root { + // --bg: #1d2021; // hard + // --bg: #32302f; // soft + --bg: #282828; + --bg1: #3c3836; + --bg2: #504945; + --bg3: #665c54; + --bg4: #7c6f64; + + --fg: #fbf1c7; + --fg1: #ebdbb2; + --fg2: #d5c4a1; + --fg3: #bdae93; + --fg4: #a89984; + + --red: #fb4934; + --green: #b8bb26; + --yellow: #fabd2f; + --blue: #83a598; + --purple: #d3869b; + --aqua: #8ec07c; + --gray: #928374; + --orange: #fe8019; + + --red-dim: #cc2412; + --green-dim: #98971a; + --yellow-dim: #d79921; + --blue-dim: #458588; + --purple-dim: #b16286; + --aqua-dim: #689d6a; + --gray-dim: #a89984; + --orange-dim: #d65d0e; + } +} + +@media (prefers-color-scheme: light) { + :root { + // --bg: #f9f5d7; // hard + // --bg: #f2e5bc; // soft + --bg: #fbf1c7; + --bg1: #ebdbb2; + --bg2: #d5c4a1; + --bg3: #bdae93; + --bg4: #a89984; + + --fg: #282828; + --fg1: #3c3836; + --fg2: #504945; + --fg3: #665c54; + --fg4: #7c6f64; + + --red: #9d0006; + --green: #79740e; + --yellow: #b57614; + --blue: #076678; + --purple: #8f3f71; + --aqua: #427b58; + --orange: #af3a03; + --gray: #928374; + + --red-dim: #cc2412; + --green-dim: #98971a; + --yellow-dim: #d79921; + --blue-dim: #458598; + --purple-dim: #b16286; + --aqua-dim: #689d6a; + --orange-dim: #d65d0e; + --gray-dim: #7c6f64; + } +} + +html { + background: var(--bg); + color: var(--fg); + font-size: 14pt; + font-family: monospace; +} + +::selection { + color: var(--bg); + background-color: var(--fg); +} + +body { + line-height: 1.4; + max-width: 900px; + margin: 0 auto; +} + +a { + color: var(--blue); +} + +a:visited { + color: var(--blue-dim); +} + +a:hover { + text-decoration: none; +} + +a:active { + background: var(--fg1); +} + +header > h2:has(+ p) { + margin-bottom: 0; +} + +header > h2 + p { + margin-top: 0; +} + +nav a { + color: var(--aqua); + font-weight: bold; + text-decoration: none; +} + +nav a.active { + color: var(--orange-dim); +} + +nav a:hover { + text-decoration: underline; +} + +nav a:active { + background: var(--fg); +} + +nav.toc { + text-align: left; + font-size: 0.9rem; + margin-bottom: 2rem; +} + +header.banner > nav { + display: flex; + justify-content: space-between; +} + +header.banner > nav h1 { + display: flex; +} + +header.banner > nav ul { + display: flex; + list-style: none; +} + +header.banner > nav li + li { + margin-inline-start: 1em; +} + +header.banner > nav a { + font-size: 1.2rem; +} + +footer { + margin-top: 2rem; + text-align: center; + font-size: 0.8rem; +} -- cgit v1.2.3-70-g09d2