blinc_theme 0.5.1

Theming system for Blinc UI framework - colors, typography, and design tokens
Documentation 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302

//! Linux GNOME Adwaita theme
//!
//! Implements the GNOME Human Interface Guidelines with libadwaita design language:
//! - Accent colors: GNOME Blue (#3584E4)
//! - Typography: Cantarell (13px base)
//! - Spacing: 6px base unit
//! - Corner radii: 6px default
//! - Characteristic Adwaita shadows

use crate::theme::{ColorScheme, Theme, ThemeBundle};
use crate::tokens::*;
use blinc_core::Color;

/// Linux-native theme inspired by GNOME Adwaita (libadwaita/GTK 4)
#[derive(Clone, Debug)]
pub struct LinuxTheme {
    scheme: ColorScheme,
    colors: ColorTokens,
    typography: TypographyTokens,
    spacing: SpacingTokens,
    radii: RadiusTokens,
    shadows: ShadowTokens,
    animations: AnimationTokens,
}

impl LinuxTheme {
    /// Create the light variant (Adwaita Light)
    pub fn light() -> Self {
        Self {
            scheme: ColorScheme::Light,
            colors: ColorTokens {
                // Primary - GNOME Accent Blue
                primary: Color::from_hex(0x3584E4),
                primary_hover: Color::from_hex(0x1C71D8),
                primary_active: Color::from_hex(0x1A63C4),

                // Secondary
                secondary: Color::from_hex(0x5E5C64),
                secondary_hover: Color::from_hex(0x504E55),
                secondary_active: Color::from_hex(0x434147),

                // Semantic Colors
                success: Color::from_hex(0x26AB2D),
                success_bg: Color::from_hex(0x26AB2D).with_alpha(0.1),
                warning: Color::from_hex(0xF57D00),
                warning_bg: Color::from_hex(0xF57D00).with_alpha(0.1),
                error: Color::from_hex(0xE01B24),
                error_bg: Color::from_hex(0xE01B24).with_alpha(0.1),
                info: Color::from_hex(0x3584E4),
                info_bg: Color::from_hex(0x3584E4).with_alpha(0.1),

                // Surfaces
                background: Color::from_hex(0xFAFAFA), // window_bg_color
                surface: Color::WHITE,                 // view_bg_color
                surface_elevated: Color::WHITE,
                surface_overlay: Color::from_hex(0xF6F5F4), // card_bg_color

                // Text
                text_primary: Color::from_hex(0x000000), // view_fg_color (pure black)
                text_secondary: Color::from_hex(0x5E5C64), // secondary_fg_color
                text_tertiary: Color::from_hex(0x9A9996), // tertiary_fg_color
                text_inverse: Color::WHITE,
                text_link: Color::from_hex(0x3584E4),

                // Borders
                border: Color::from_hex(0xCDCDCD),
                border_secondary: Color::from_hex(0xBBBBBB), // Adwaita borders_color — form controls
                border_hover: Color::from_hex(0xBBBBBB),
                border_focus: Color::from_hex(0x3584E4),
                border_error: Color::from_hex(0xE01B24),

                // Inputs
                input_bg: Color::WHITE,
                input_bg_hover: Color::from_hex(0xF8F8F8),
                input_bg_focus: Color::WHITE,
                input_bg_disabled: Color::from_hex(0xF5F5F5),

                // Selection
                selection: Color::from_hex(0x3584E4).with_alpha(0.3),
                selection_text: Color::from_hex(0x000000),

                // Accent
                accent: Color::from_hex(0x3584E4),
                accent_subtle: Color::from_hex(0x3584E4).with_alpha(0.1),
                // Tooltip (inverted for light theme)
                tooltip_bg: Color::from_hex(0x242424),
                tooltip_text: Color::from_hex(0xFAFAFA),
            },
            typography: TypographyTokens {
                font_sans: FontFamily::new(
                    "Cantarell",
                    vec!["Ubuntu", "DejaVu Sans", "system-ui", "sans-serif"],
                ),
                font_serif: FontFamily::new(
                    "DejaVu Serif",
                    vec!["Liberation Serif", "Georgia", "serif"],
                ),
                font_mono: FontFamily::new(
                    "Source Code Pro",
                    vec!["Liberation Mono", "DejaVu Sans Mono", "monospace"],
                ),
                // GNOME Typography Scale (13px base)
                text_xs: 11.0,   // Caption
                text_sm: 13.0,   // Small/Body (GNOME default)
                text_base: 13.0, // Body
                text_lg: 16.0,   // Heading 2
                text_xl: 18.0,   // Heading 1
                text_2xl: 22.0,
                text_3xl: 28.0,
                text_4xl: 34.0,
                text_5xl: 44.0,
                ..Default::default()
            },
            spacing: SpacingTokens::with_base(6.0), // Adwaita uses 6px base
            radii: RadiusTokens {
                radius_none: 0.0,
                radius_sm: 3.0,
                radius_default: 6.0, // Adwaita default
                radius_md: 6.0,      // Cards, buttons
                radius_lg: 8.0,      // Large surfaces
                radius_xl: 8.0,
                radius_2xl: 12.0,
                radius_3xl: 16.0,
                radius_full: 9999.0,
            },
            shadows: Self::light_shadows(),
            animations: AnimationTokens::default(),
        }
    }

    /// Create the dark variant (Adwaita Dark)
    pub fn dark() -> Self {
        Self {
            scheme: ColorScheme::Dark,
            colors: ColorTokens {
                // Primary - GNOME Accent Blue (consistent in dark mode)
                primary: Color::from_hex(0x3584E4),
                primary_hover: Color::from_hex(0x2878D9),
                primary_active: Color::from_hex(0x1F6FBF),

                // Secondary
                secondary: Color::from_hex(0xD0CFCC),
                secondary_hover: Color::from_hex(0xBDBCB8),
                secondary_active: Color::from_hex(0xA9A8A4),

                // Semantic Colors
                success: Color::from_hex(0x26AB2D),
                success_bg: Color::from_hex(0x26AB2D).with_alpha(0.15),
                warning: Color::from_hex(0xF57D00),
                warning_bg: Color::from_hex(0xF57D00).with_alpha(0.15),
                error: Color::from_hex(0xE01B24),
                error_bg: Color::from_hex(0xE01B24).with_alpha(0.15),
                info: Color::from_hex(0x3584E4),
                info_bg: Color::from_hex(0x3584E4).with_alpha(0.15),

                // Surfaces
                background: Color::from_hex(0x242424), // window_bg_color dark
                surface: Color::from_hex(0x1E1E1E),    // view_bg_color dark
                surface_elevated: Color::from_hex(0x2E2E2E),
                surface_overlay: Color::from_hex(0x2A2A2A), // headerbar_bg_color

                // Text
                text_primary: Color::WHITE,
                text_secondary: Color::from_hex(0xD0CFCC),
                text_tertiary: Color::from_hex(0x949390),
                text_inverse: Color::from_hex(0x000000),
                text_link: Color::from_hex(0x3584E4),

                // Borders
                border: Color::from_hex(0x3A3A3A),
                border_secondary: Color::from_hex(0x5E5E5E), // Adwaita dark borders_color — form controls
                border_hover: Color::from_hex(0x4A4A4A),
                border_focus: Color::from_hex(0x3584E4),
                border_error: Color::from_hex(0xE01B24),

                // Inputs
                input_bg: Color::from_hex(0x3A3A3A),
                input_bg_hover: Color::from_hex(0x3E3E3E),
                input_bg_focus: Color::from_hex(0x3A3A3A),
                input_bg_disabled: Color::from_hex(0x333333),

                // Selection
                selection: Color::from_hex(0x3584E4).with_alpha(0.35),
                selection_text: Color::WHITE,

                // Accent
                accent: Color::from_hex(0x3584E4),
                accent_subtle: Color::from_hex(0x3584E4).with_alpha(0.15),
                // Tooltip (inverted for dark theme)
                tooltip_bg: Color::from_hex(0xFAFAFA),
                tooltip_text: Color::from_hex(0x242424),
            },
            typography: TypographyTokens {
                font_sans: FontFamily::new(
                    "Cantarell",
                    vec!["Ubuntu", "DejaVu Sans", "system-ui", "sans-serif"],
                ),
                font_serif: FontFamily::new(
                    "DejaVu Serif",
                    vec!["Liberation Serif", "Georgia", "serif"],
                ),
                font_mono: FontFamily::new(
                    "Source Code Pro",
                    vec!["Liberation Mono", "DejaVu Sans Mono", "monospace"],
                ),
                text_xs: 11.0,
                text_sm: 13.0,
                text_base: 13.0,
                text_lg: 16.0,
                text_xl: 18.0,
                text_2xl: 22.0,
                text_3xl: 28.0,
                text_4xl: 34.0,
                text_5xl: 44.0,
                ..Default::default()
            },
            spacing: SpacingTokens::with_base(6.0),
            radii: RadiusTokens {
                radius_none: 0.0,
                radius_sm: 3.0,
                radius_default: 6.0,
                radius_md: 6.0,
                radius_lg: 8.0,
                radius_xl: 8.0,
                radius_2xl: 12.0,
                radius_3xl: 16.0,
                radius_full: 9999.0,
            },
            shadows: Self::dark_shadows(),
            animations: AnimationTokens::default(),
        }
    }

    /// Create a theme bundle with light and dark variants
    pub fn bundle() -> ThemeBundle {
        ThemeBundle::new("Linux", Self::light(), Self::dark())
    }

    /// Adwaita light mode shadows
    fn light_shadows() -> ShadowTokens {
        let base_color = Color::BLACK;
        ShadowTokens {
            shadow_sm: Shadow::new(0.0, 1.0, 3.0, 0.0, base_color.with_alpha(0.12)),
            shadow_default: Shadow::new(0.0, 1.0, 3.0, 0.0, base_color.with_alpha(0.12)),
            shadow_md: Shadow::new(0.0, 2.0, 4.0, 0.0, base_color.with_alpha(0.15)),
            shadow_lg: Shadow::new(0.0, 3.0, 6.0, 0.0, base_color.with_alpha(0.20)),
            shadow_xl: Shadow::new(0.0, 4.0, 8.0, 0.0, base_color.with_alpha(0.25)),
            shadow_2xl: Shadow::new(0.0, 6.0, 12.0, 0.0, base_color.with_alpha(0.30)),
            shadow_inner: Shadow::new(0.0, 1.0, 2.0, 0.0, base_color.with_alpha(0.08)),
            shadow_none: Shadow::none(),
        }
    }

    /// Adwaita dark mode shadows (more pronounced)
    fn dark_shadows() -> ShadowTokens {
        let base_color = Color::BLACK;
        ShadowTokens {
            shadow_sm: Shadow::new(0.0, 1.0, 3.0, 0.0, base_color.with_alpha(0.36)),
            shadow_default: Shadow::new(0.0, 1.0, 3.0, 0.0, base_color.with_alpha(0.36)),
            shadow_md: Shadow::new(0.0, 2.0, 4.0, 0.0, base_color.with_alpha(0.40)),
            shadow_lg: Shadow::new(0.0, 3.0, 6.0, 0.0, base_color.with_alpha(0.50)),
            shadow_xl: Shadow::new(0.0, 4.0, 8.0, 0.0, base_color.with_alpha(0.60)),
            shadow_2xl: Shadow::new(0.0, 6.0, 12.0, 0.0, base_color.with_alpha(0.70)),
            shadow_inner: Shadow::new(0.0, 1.0, 2.0, 0.0, base_color.with_alpha(0.20)),
            shadow_none: Shadow::none(),
        }
    }
}

impl Theme for LinuxTheme {
    fn name(&self) -> &str {
        "Linux"
    }

    fn color_scheme(&self) -> ColorScheme {
        self.scheme
    }

    fn colors(&self) -> &ColorTokens {
        &self.colors
    }

    fn typography(&self) -> &TypographyTokens {
        &self.typography
    }

    fn spacing(&self) -> &SpacingTokens {
        &self.spacing
    }

    fn radii(&self) -> &RadiusTokens {
        &self.radii
    }

    fn shadows(&self) -> &ShadowTokens {
        &self.shadows
    }

    fn animations(&self) -> &AnimationTokens {
        &self.animations
    }
}