a lightweight, interval-based utility to combat digital strain through "Ma" (intentional pauses) for the eyes and body.
fix(ui): switch from slate+sage to muted dark+light blue
+10
-9
+10
-9
ui/theme.slint
+10
-9
ui/theme.slint
···
1
1
// Design token system for ioma.
2
2
// Import this file in any .slint UI file that needs themed colors.
3
-
// Set Theme.dark = true to switch to warm-slate dark mode.
3
+
// Set Theme.dark = true to switch to dark mode.
4
4
5
5
export global Theme {
6
6
// Set by each window via `changed is-dark => { Theme.dark = root.is-dark; }`
7
7
in-out property <bool> dark: false;
8
8
9
9
// ── Window background ─────────────────────────────────────────────────────
10
-
// Light: warm cream / Dark: deep warm charcoal (not blue-black)
11
-
out property <color> bg: self.dark ? #1C1A17 : #F3EFE7;
10
+
// Light: warm cream / Dark: gentle dark blue (desaturated, not tech-stark)
11
+
out property <color> bg: self.dark ? #1A1D2B : #F3EFE7;
12
12
13
13
// ── Ink scale: primary text → near-invisible ──────────────────────────────
14
14
// Light base: #232028 (near-black, warm cast)
···
36
36
// ── Primary button (inverted palette) ─────────────────────────────────────
37
37
out property <color> btn-bg: self.dark ? #EDE9E1 : #232028;
38
38
out property <color> btn-bg-hov: self.dark ? #F0ECE5 : #3A3542;
39
-
out property <color> btn-fg: self.dark ? #1C1A17 : #F3EFE7;
39
+
out property <color> btn-fg: self.dark ? #1A1D2B : #F3EFE7;
40
40
41
41
// ── Window chrome (decorative circles) ────────────────────────────────────
42
42
out property <color> chrome: self.dark ? #EDE9E109 : #00000009;
43
43
44
-
// ── Accent: sage green — same in both modes ────────────────────────────────
45
-
out property <color> accent: #8A9A82;
46
-
out property <color> accent-muted: #8A9A8260; // focus border / ring
47
-
out property <color> accent-sel: #8A9A8230; // text selection highlight
44
+
// ── Accent: dusty baby blue — same in both modes ──────────────────────────
45
+
// ~207° hue, muted saturation — clearly blue without reading as corporate or electric
46
+
out property <color> accent: #82AACC;
47
+
out property <color> accent-muted: #82AACC60; // focus border / ring
48
+
out property <color> accent-sel: #82AACC30; // text selection highlight
48
49
49
50
// ── Interactive thumb (toggle, slider) ────────────────────────────────────
50
51
// Warm off-white in both modes — avoids clinical pure white against warm surfaces
···
54
55
out property <color> shadow: #00000026;
55
56
56
57
// ── Overlay-specific ──────────────────────────────────────────────────────
57
-
out property <color> progress-track: self.dark ? #2E2A25 : #D8D2C6;
58
+
out property <color> progress-track: self.dark ? #252838 : #D8D2C6;
58
59
}