From a24b51a5d2798ca4beedece745a98163410a8b0d Mon Sep 17 00:00:00 2001 From: triethyl Date: Sun, 15 Feb 2026 23:37:03 -0500 Subject: themes overhaul and new font --- site/themes/sine/static/css/style.css | 19 +++++++++++++------ .../sine/static/css/themes/melatonin-dark.css | 22 ++++++++++++++++++++++ .../sine/static/css/themes/melatonin-light.css | 22 ++++++++++++++++++++++ .../sine/static/css/themes/oxocarbon-dark.css | 2 +- .../sine/static/css/themes/oxocarbon-light.css | 2 +- site/themes/sine/static/css/themes/themes.css | 5 +++++ 6 files changed, 64 insertions(+), 8 deletions(-) create mode 100644 site/themes/sine/static/css/themes/melatonin-dark.css create mode 100644 site/themes/sine/static/css/themes/melatonin-light.css create mode 100644 site/themes/sine/static/css/themes/themes.css (limited to 'site/themes/sine/static/css') diff --git a/site/themes/sine/static/css/style.css b/site/themes/sine/static/css/style.css index c14e227..9470d48 100644 --- a/site/themes/sine/static/css/style.css +++ b/site/themes/sine/static/css/style.css @@ -1,8 +1,7 @@ /* COLORS */ -@import url('themes/oxocarbon-light.css'); -@import url('themes/oxocarbon-dark.css'); +@import url('themes/themes.css'); -#toggleTheme { +#switchTheme { font-family: "kirsch"; font-size: 2rem; color: var(--fg); @@ -10,8 +9,8 @@ background: none; cursor: pointer; position: relative; - top: 2px; - margin: -4px 2px; + /* top: 2px; */ + /* margin: -4px 2px; */ } #logoContainer { @@ -29,6 +28,13 @@ font-display: block; } +@font-face { + font-family: 'Jacquard12'; + src: url('/fonts/Jacquard12-Regular.ttf') format('truetype'); + font-weight: normal; + font-style: normal; +} + /* LAYOUT */ body { @@ -152,9 +158,10 @@ body { margin: 14px 0; } -#content h1 { +#content :is(h1, h2, h3, h4, h5, h6) { margin: 0; text-align: center; + font-family: "Jacquard12"; } #content ul { diff --git a/site/themes/sine/static/css/themes/melatonin-dark.css b/site/themes/sine/static/css/themes/melatonin-dark.css new file mode 100644 index 0000000..bd12429 --- /dev/null +++ b/site/themes/sine/static/css/themes/melatonin-dark.css @@ -0,0 +1,22 @@ +/* COLORS */ +[data-theme="melatonin-dark"] { + --base00: #152233; + --base01: #253850; + --base02: #415d81; + --base03: #5b7aa2; + --base04: #84a3cb; + --base05: #c8d7eb; + --base06: #b9cce5; + --base07: #dce7f6; + --base08: #d87595; + --base09: #dd9f6b; + --base0A: #c88953; + --base0B: #90a254; + --base0C: #55aa9b; + --base0D: #5ba1d0; + --base0E: #a586d9; + --base0F: #a06f42; + + --fg: var(--base06); + --bg: var(--base00); +} diff --git a/site/themes/sine/static/css/themes/melatonin-light.css b/site/themes/sine/static/css/themes/melatonin-light.css new file mode 100644 index 0000000..f0d167b --- /dev/null +++ b/site/themes/sine/static/css/themes/melatonin-light.css @@ -0,0 +1,22 @@ +/* COLORS */ +[data-theme="melatonin-light"] { + --base00: #e5edfa; + --base01: #cedef6; + --base02: #b8cef1; + --base03: #6e8db8; + --base04: #2f548a; + --base05: #294069; + --base06: #132745; + --base07: #02060e; + --base08: #d87595; + --base09: #dd9f6b; + --base0A: #c88953; + --base0B: #90a254; + --base0C: #55aa9b; + --base0D: #5ba1d0; + --base0E: #a586d9; + --base0F: #9a6c40; + + --fg: var(--base06); + --bg: var(--base00); +} diff --git a/site/themes/sine/static/css/themes/oxocarbon-dark.css b/site/themes/sine/static/css/themes/oxocarbon-dark.css index 3283009..5388115 100644 --- a/site/themes/sine/static/css/themes/oxocarbon-dark.css +++ b/site/themes/sine/static/css/themes/oxocarbon-dark.css @@ -1,5 +1,5 @@ /* COLORS */ -[data-theme="dark"] { +[data-theme="oxocarbon-dark"] { --base00: #161616; --base01: #262626; --base02: #393939; diff --git a/site/themes/sine/static/css/themes/oxocarbon-light.css b/site/themes/sine/static/css/themes/oxocarbon-light.css index 7cd48ee..018eba4 100644 --- a/site/themes/sine/static/css/themes/oxocarbon-light.css +++ b/site/themes/sine/static/css/themes/oxocarbon-light.css @@ -1,5 +1,5 @@ /* COLORS */ -[data-theme="light"] { +[data-theme="oxocarbon-light"] { --base00: #ffffff; --base01: #f2f2f2; --base02: #d0d0d0; diff --git a/site/themes/sine/static/css/themes/themes.css b/site/themes/sine/static/css/themes/themes.css new file mode 100644 index 0000000..a691171 --- /dev/null +++ b/site/themes/sine/static/css/themes/themes.css @@ -0,0 +1,5 @@ +/* Import all themes */ +@import url('melatonin-dark.css'); +@import url('melatonin-light.css'); +@import url('oxocarbon-light.css'); +@import url('oxocarbon-dark.css'); -- cgit v1.2.3