1use getset::{Getters, Setters};
2use orbital_macros::WriteCSSVars;
3
4#[derive(Clone, WriteCSSVars, Getters, Setters)]
5#[getset(get = "pub", set = "pub")]
6pub struct CommonTheme {
7 font_family_base: String,
8 font_family_monospace: String,
9 font_family_numeric: String,
10 font_family_display: String,
11
12 font_size_base_100: String,
13 font_size_base_200: String,
14 font_size_base_300: String,
15 font_size_base_400: String,
16 font_size_base_500: String,
17 font_size_base_600: String,
18 font_size_base_700: String,
19 font_size_base_800: String,
20 font_size_base_900: String,
21 font_size_base_1000: String,
22
23 line_height_base_200: String,
24 line_height_base_300: String,
25 line_height_base_400: String,
26 line_height_base_500: String,
27
28 font_weight_regular: String,
29 font_weight_semibold: String,
30 font_weight_bold: String,
31
32 stroke_width_thin: String,
33 stroke_width_thick: String,
34 stroke_width_thicker: String,
35 stroke_width_thickest: String,
36
37 border_radius_none: String,
38 border_radius_small: String,
39 border_radius_medium: String,
40 border_radius_large: String,
41 border_radius_x_large: String,
42 border_radius_floating: String,
43 border_radius_circular: String,
44
45 spacing_horizontal_none: String,
46 spacing_horizontal_x_x_s: String,
47 spacing_horizontal_x_s: String,
48 spacing_horizontal_s_nudge: String,
49 spacing_horizontal_s: String,
50 spacing_horizontal_m_nudge: String,
51 spacing_horizontal_m: String,
52 spacing_horizontal_l: String,
53 spacing_horizontal_x_l: String,
54 spacing_horizontal_x_x_l: String,
55 spacing_horizontal_x_x_x_l: String,
56 spacing_vertical_none: String,
57 spacing_vertical_x_x_s: String,
58 spacing_vertical_x_s: String,
59 spacing_vertical_s_nudge: String,
60 spacing_vertical_s: String,
61 spacing_vertical_m_nudge: String,
62 spacing_vertical_m: String,
63 spacing_vertical_l: String,
64 spacing_vertical_x_l: String,
65 spacing_vertical_x_x_l: String,
66 spacing_vertical_x_x_x_l: String,
67
68 duration_ultra_fast: String,
69 duration_faster: String,
70 duration_normal: String,
71 duration_gentle: String,
72 duration_slow: String,
73 curve_accelerate_mid: String,
74 curve_decelerate_max: String,
75 curve_decelerate_mid: String,
76 curve_easy_ease: String,
77 curve_easy_ease_max: String,
78}
79
80impl Default for CommonTheme {
81 fn default() -> Self {
82 Self::new()
83 }
84}
85
86impl CommonTheme {
87 pub fn new() -> Self {
88 Self {
89 font_family_base:
90 "'League Spartan', ui-sans-serif, system-ui, -apple-system, sans-serif".into(),
91 font_family_monospace: "'League Mono', ui-monospace, monospace".into(),
92 font_family_numeric: "'League Spartan', ui-sans-serif, system-ui, sans-serif".into(),
93 font_family_display:
94 "'Orbitron', 'League Spartan', ui-sans-serif, system-ui, sans-serif".into(),
95
96 font_size_base_100: "10px".into(),
97 font_size_base_200: "12px".into(),
98 font_size_base_300: "14px".into(),
99 font_size_base_400: "16px".into(),
100 font_size_base_500: "20px".into(),
101 font_size_base_600: "24px".into(),
102 font_size_base_700: "28px".into(),
103 font_size_base_800: "32px".into(),
104 font_size_base_900: "40px".into(),
105 font_size_base_1000: "60px".into(),
106
107 line_height_base_200: "16px".into(),
108 line_height_base_300: "20px".into(),
109 line_height_base_400: "22px".into(),
110 line_height_base_500: "28px".into(),
111
112 font_weight_regular: "400".into(),
113 font_weight_semibold: "600".into(),
114 font_weight_bold: "700".into(),
115
116 stroke_width_thin: "1px".into(),
117 stroke_width_thick: "2px".into(),
118 stroke_width_thicker: "3px".into(),
119 stroke_width_thickest: "4px".into(),
120
121 border_radius_none: "0".into(),
122 border_radius_small: "2px".into(),
123 border_radius_medium: "4px".into(),
124 border_radius_large: "6px".into(),
125 border_radius_x_large: "8px".into(),
126 border_radius_floating: "16px".into(),
127 border_radius_circular: "10000px".into(),
128
129 spacing_horizontal_none: "0".into(),
130 spacing_horizontal_x_x_s: "2px".into(),
131 spacing_horizontal_x_s: "4px".into(),
132 spacing_horizontal_s_nudge: "6px".into(),
133 spacing_horizontal_s: "8px".into(),
134 spacing_horizontal_m_nudge: "10px".into(),
135 spacing_horizontal_m: "12px".into(),
136 spacing_horizontal_l: "16px".into(),
137 spacing_horizontal_x_l: "20px".into(),
138 spacing_horizontal_x_x_l: "24px".into(),
139 spacing_horizontal_x_x_x_l: "32px".into(),
140 spacing_vertical_none: "0".into(),
141 spacing_vertical_x_x_s: "2px".into(),
142 spacing_vertical_x_s: "4px".into(),
143 spacing_vertical_s_nudge: "6px".into(),
144 spacing_vertical_s: "8px".into(),
145 spacing_vertical_m_nudge: "10px".into(),
146 spacing_vertical_m: "12px".into(),
147 spacing_vertical_l: "16px".into(),
148 spacing_vertical_x_l: "20px".into(),
149 spacing_vertical_x_x_l: "24px".into(),
150 spacing_vertical_x_x_x_l: "32px".into(),
151
152 duration_ultra_fast: "50ms".into(),
153 duration_faster: "100ms".into(),
154 duration_normal: "200ms".into(),
155 duration_gentle: "250ms".into(),
156 duration_slow: "300ms".into(),
157 curve_accelerate_mid: "cubic-bezier(1,0,1,1)".into(),
158 curve_decelerate_max: "cubic-bezier(0.1,0.9,0.2,1)".into(),
159 curve_decelerate_mid: "cubic-bezier(0,0,0,1)".into(),
160 curve_easy_ease: "cubic-bezier(0.33,0,0.67,1)".into(),
161 curve_easy_ease_max: "cubic-bezier(0.8,0,0.2,1)".into(),
162 }
163 }
164
165 pub fn write_orb_motion_css_vars(&self, css_vars: &mut String) {
167 const DURATION_FAST: &str = "150ms";
168 const DURATION_SLOWER: &str = "400ms";
169 const DURATION_ULTRA_SLOW: &str = "500ms";
170 const CURVE_LINEAR: &str = "cubic-bezier(0, 0, 1, 1)";
171 const CURVE_ACCELERATE_MAX: &str = "cubic-bezier(0.9, 0.1, 1, 0.2)";
172 const CURVE_ACCELERATE_MIN: &str = "cubic-bezier(0.8, 0, 0.78, 1)";
173 const CURVE_DECELERATE_MIN: &str = "cubic-bezier(0.33, 0, 0.1, 1)";
174
175 let durations = [
176 (
177 "--orb-motion-duration-2xs",
178 "--durationUltraFast",
179 self.duration_ultra_fast.as_str(),
180 ),
181 (
182 "--orb-motion-duration-xs",
183 "--durationFaster",
184 self.duration_faster.as_str(),
185 ),
186 ("--orb-motion-duration-sm", "--durationFast", DURATION_FAST),
187 (
188 "--orb-motion-duration-md",
189 "--durationNormal",
190 self.duration_normal.as_str(),
191 ),
192 (
193 "--orb-motion-duration-lg",
194 "--durationGentle",
195 self.duration_gentle.as_str(),
196 ),
197 (
198 "--orb-motion-duration-xl",
199 "--durationSlow",
200 self.duration_slow.as_str(),
201 ),
202 (
203 "--orb-motion-duration-2xl",
204 "--durationSlower",
205 DURATION_SLOWER,
206 ),
207 (
208 "--orb-motion-duration-3xl",
209 "--durationUltraSlow",
210 DURATION_ULTRA_SLOW,
211 ),
212 ];
213
214 for (orb, legacy, value) in durations {
215 css_vars.push_str(&format!("{orb}: {value};"));
216 css_vars.push_str(&format!("{legacy}: {value};"));
217 }
218
219 let curves = [
220 ("--orb-motion-ease-linear", "--curveLinear", CURVE_LINEAR),
221 (
222 "--orb-motion-ease-accelerate-strong",
223 "--curveAccelerateMax",
224 CURVE_ACCELERATE_MAX,
225 ),
226 (
227 "--orb-motion-ease-accelerate",
228 "--curveAccelerateMid",
229 self.curve_accelerate_mid.as_str(),
230 ),
231 (
232 "--orb-motion-ease-accelerate-subtle",
233 "--curveAccelerateMin",
234 CURVE_ACCELERATE_MIN,
235 ),
236 (
237 "--orb-motion-ease-decelerate-strong",
238 "--curveDecelerateMax",
239 self.curve_decelerate_max.as_str(),
240 ),
241 (
242 "--orb-motion-ease-decelerate",
243 "--curveDecelerateMid",
244 self.curve_decelerate_mid.as_str(),
245 ),
246 (
247 "--orb-motion-ease-decelerate-subtle",
248 "--curveDecelerateMin",
249 CURVE_DECELERATE_MIN,
250 ),
251 (
252 "--orb-motion-ease-standard",
253 "--curveEasyEase",
254 self.curve_easy_ease.as_str(),
255 ),
256 (
257 "--orb-motion-ease-emphasis",
258 "--curveEasyEaseMax",
259 self.curve_easy_ease_max.as_str(),
260 ),
261 ];
262
263 for (orb, legacy, value) in curves {
264 css_vars.push_str(&format!("{orb}: {value};"));
265 css_vars.push_str(&format!("{legacy}: {value};"));
266 }
267 }
268}