neuwirth
/
ozymandias
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Cappuccino theme

This commit is contained in:
Levi Neuwirth 2026-05-03 22:03:38 -04:00
parent cf0f9f37c3
commit 00c2cf6256
10 changed files with 72 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
cabal.project.freeze
View File

@ -41,11 +41,11 @@ constraints: any.Glob ==0.10.2,
any.cborg ==0.2.10.0,
any.cereal ==0.5.8.3,
any.citeproc ==0.8.1.1,
any.colour ==2.3.6,
any.colour ==2.3.7,
any.commonmark ==0.2.6.1,
any.commonmark-extensions ==0.2.5.6,
any.commonmark-pandoc ==0.2.2.3,
any.comonad ==5.0.9,
any.comonad ==5.0.10,
any.conduit ==1.3.6.1,
any.conduit-extra ==1.3.8,
any.containers ==0.6.7,
@ -70,7 +70,7 @@ constraints: any.Glob ==0.10.2,
any.distributive ==0.6.2.1,
any.djot ==0.1.2.3,
any.dlist ==1.0,
any.doclayout ==0.5,
any.doclayout ==0.5.0.1,
any.doctemplates ==0.11.0.1,
any.easy-file ==0.2.5,
any.emojis ==0.1.4.1,
@ -85,13 +85,11 @@ constraints: any.Glob ==0.10.2,
any.ghc-prim ==0.10.0,
any.gridtables ==0.1.1.0,
any.haddock-library ==1.11.0,
any.hakyll ==4.16.8.0,
any.hakyll ==4.16.7.1,
hakyll -buildwebsite +checkexternal +previewserver +usepandoc +watchserver,
any.half ==0.3.3,
any.hashable ==1.4.7.0,
any.haskell-lexer ==1.2,
any.haskell-src-exts ==1.23.1,
any.haskell-src-meta ==0.8.15,
any.hinotify ==0.4.2,
any.hourglass ==0.2.12,
any.http-client ==0.7.19,
@ -110,19 +108,12 @@ constraints: any.Glob ==0.10.2,
any.ipynb ==0.2,
any.jira-wiki-markup ==1.5.1,
any.libyaml ==0.1.4,
any.lifted-base ==0.2.3.12,
any.lrucache ==1.2.0.1,
any.memory ==0.18.0,
any.mime-types ==0.1.2.1,
any.monad-control ==1.0.3.1,
any.monad-logger ==0.3.42,
monad-logger +template_haskell,
any.monad-loops ==0.4.3,
monad-loops +base4,
any.mono-traversable ==1.0.21.0,
any.mtl ==2.3.1,
any.mtl-compat ==0.2.2,
mtl-compat -two-point-one -two-point-two,
any.network ==3.1.4.0,
any.network-byte-order ==0.1.7,
any.network-control ==0.1.3,
@ -148,8 +139,6 @@ constraints: any.Glob ==0.10.2,
any.regex-base ==0.94.0.3,
any.regex-tdfa ==1.3.2.5,
any.resourcet ==1.2.6,
any.retry ==0.9.3.1,
retry -lib-werror,
any.rts ==1.0.2,
any.safe ==0.3.21,
any.safe-exceptions ==0.1.7.4,
@ -167,11 +156,8 @@ constraints: any.Glob ==0.10.2,
any.split ==0.2.5,
any.splitmix ==0.1.3,
any.stm ==2.5.1.0,
any.stm-chans ==3.0.0.11,
any.streaming-commons ==0.2.3.1,
any.strict ==0.5.1,
any.string-interpolate ==0.3.4.0,
string-interpolate -bytestring-builder -extended-benchmarks -text-builder,
any.syb ==0.7.3,
any.tagged ==0.8.9,
any.tagsoup ==0.14.8,
@ -185,11 +171,8 @@ constraints: any.Glob ==0.10.2,
any.text-short ==0.1.6.1,
any.th-abstraction ==0.6.0.0,
any.th-compat ==0.1.7,
any.th-expand-syns ==0.4.12.0,
any.th-lift ==0.8.6,
any.th-lift-instances ==0.1.20,
any.th-orphans ==0.13.17,
any.th-reify-many ==0.1.10,
any.these ==1.2.1,
any.time ==1.12.2,
any.time-compat ==1.9.9,
@ -232,4 +215,4 @@ constraints: any.Glob ==0.10.2,
any.yaml ==0.11.11.2,
any.zip-archive ==0.4.3.2,
any.zlib ==0.7.0.0
index-state: hackage.haskell.org 2026-04-02T12:38:26Z
index-state: hackage.haskell.org 2026-04-30T12:51:47Z

14
static/css/annotations.css
View File

@ -30,12 +30,18 @@ mark.user-annotation:hover { filter: brightness(0.80); }
[data-theme="dark"] mark.user-annotation.user-annotation--steel { background-color: rgba(112, 150, 184, 0.42); }
[data-theme="dark"] mark.user-annotation.user-annotation--rose { background-color: rgba(200, 116, 116, 0.42); }
/* Cappuccino — dark warm bg, so highlights need dark-mode-level opacity */
[data-theme="cappuccino"] mark.user-annotation.user-annotation--amber { background-color: rgba(245, 180, 70, 0.42); }
[data-theme="cappuccino"] mark.user-annotation.user-annotation--sage { background-color: rgba(130, 175, 140, 0.42); }
[data-theme="cappuccino"] mark.user-annotation.user-annotation--steel { background-color: rgba(140, 170, 200, 0.42); }
[data-theme="cappuccino"] mark.user-annotation.user-annotation--rose { background-color: rgba(220, 140, 140, 0.42); }
/* System dark mode fallback (for prefers-color-scheme without explicit data-theme) */
@media (prefers-color-scheme: dark) {
:root:not([data-theme="light"]) mark.user-annotation.user-annotation--amber { background-color: rgba(245, 158, 11, 0.40); }
:root:not([data-theme="light"]) mark.user-annotation.user-annotation--sage { background-color: rgba(107, 158, 120, 0.42); }
:root:not([data-theme="light"]) mark.user-annotation.user-annotation--steel { background-color: rgba(112, 150, 184, 0.42); }
:root:not([data-theme="light"]) mark.user-annotation.user-annotation--rose { background-color: rgba(200, 116, 116, 0.42); }
:root:not([data-theme]) mark.user-annotation.user-annotation--amber { background-color: rgba(245, 158, 11, 0.40); }
:root:not([data-theme]) mark.user-annotation.user-annotation--sage { background-color: rgba(107, 158, 120, 0.42); }
:root:not([data-theme]) mark.user-annotation.user-annotation--steel { background-color: rgba(112, 150, 184, 0.42); }
:root:not([data-theme]) mark.user-annotation.user-annotation--rose { background-color: rgba(200, 116, 116, 0.42); }
}
/* ============================================================

34
static/css/base.css
View File

@ -193,9 +193,41 @@
--hm-4: #d4d0c8;
}
/* ============================================================
CAPPUCCINO (warm milky-coffee — opt-in only, no system trigger)
============================================================ */
[data-theme="cappuccino"] {
--bg: #553a28;
--bg-nav: #503626;
--bg-offset: #4a3324;
--text: #ead0a0; /* warm microfoam — golden cream */
--text-muted: #d0b888;
--text-faint: #b09575;
--border: #7a5d44;
--border-muted: #6a4f38;
--link: #ead0a0;
--link-underline: #b09575;
--link-hover: #f5e6c0;
--link-hover-underline: #f5e6c0;
--link-visited: #d0b888;
--selection-bg: #ead0a0;
--selection-text: #3a2418;
--bg-subtle: var(--bg-offset);
--hm-0: #4a3324;
--hm-1: #6a4f38;
--hm-2: #8d6c4e;
--hm-3: #b09575;
--hm-4: #ead0a0;
}
/* System dark mode fallback */
@media (prefers-color-scheme: dark) {
:root:not([data-theme="light"]) {
:root:not([data-theme]) {
--bg: #121212;
--bg-nav: #181818;
--bg-offset: #1a1a1a;

3
static/css/print.css
View File

@ -10,7 +10,8 @@
reaching for hardcoded #fff/#000 again.
---------------------------------------------------------------- */
:root,
[data-theme="dark"] {
[data-theme="dark"],
[data-theme="cappuccino"] {
--bg: #ffffff;
--bg-offset: #f5f5f5;
--bg-subtle: #f9f9f9;

7
static/css/reading.css
View File

@ -35,8 +35,13 @@ body.reading-mode {
background-color: var(--bg);
}
[data-theme="cappuccino"] body.reading-mode {
--bg: #634432;
background-color: var(--bg);
}
@media (prefers-color-scheme: dark) {
:root:not([data-theme="light"]) body.reading-mode {
:root:not([data-theme]) body.reading-mode {
--bg: #1c1917;
background-color: var(--bg);
}

11
static/css/typography.css
View File

@ -240,8 +240,17 @@ sub { font-variant-position: sub; line-height: 1; }
rgba(80, 110, 160, 0) 100%
);
}
[data-theme="cappuccino"] #markdownBody mark:not(.user-annotation) {
background-image: linear-gradient(
104deg,
rgba(245, 215, 130, 0) 0%,
rgba(245, 215, 130, 0.45) 2%,
rgba(230, 195, 110, 0.55) 98%,
rgba(230, 195, 110, 0) 100%
);
}
@media (prefers-color-scheme: dark) {
:root:not([data-theme="light"]) #markdownBody mark:not(.user-annotation) {
:root:not([data-theme]) #markdownBody mark:not(.user-annotation) {
background-image: linear-gradient(
104deg,
rgba(100, 130, 180, 0) 0%,

5
static/js/settings.js
View File

@ -90,8 +90,9 @@
------------------------------------------------------------------ */
function handle(action) {
if (action === 'theme-light') setTheme('light');
else if (action === 'theme-dark') setTheme('dark');
if (action === 'theme-light') setTheme('light');
else if (action === 'theme-dark') setTheme('dark');
else if (action === 'theme-cappuccino') setTheme('cappuccino');
else if (action === 'text-smaller') shiftSize(-1);
else if (action === 'text-larger') shiftSize(+1);
else if (action === 'focus-mode') toggleDataAttr('focus-mode', 'data-focus-mode');

2
static/js/theme.js
View File

@ -14,7 +14,7 @@
/* Theme */
var storedTheme = safeGet('theme');
if (storedTheme === 'dark' || storedTheme === 'light') {
if (storedTheme === 'dark' || storedTheme === 'light' || storedTheme === 'cappuccino') {
document.documentElement.setAttribute('data-theme', storedTheme);
}

1
templates/partials/nav.html
View File

@ -18,6 +18,7 @@
<div class="settings-row">
<button type="button" class="settings-btn" data-action="theme-light">Light</button>
<button type="button" class="settings-btn" data-action="theme-dark">Dark</button>
<button type="button" class="settings-btn" data-action="theme-cappuccino">Cappuccino</button>
</div>
</div>
<div class="settings-section">

1
templates/score-reader.html
View File

@ -18,6 +18,7 @@
<div class="settings-row">
<button class="settings-btn" data-action="theme-light">Light</button>
<button class="settings-btn" data-action="theme-dark">Dark</button>
<button class="settings-btn" data-action="theme-cappuccino">Cappuccino</button>
</div>
</div>
</div>