Skip to content

Commit 0502a19

Browse files
authored
Merge pull request #2680 from themeum/v4-dynamic-illustreations
✨ Integrate themed SVG illustrations across dashboard and learning area templates
2 parents 0cebf3e + daa7907 commit 0502a19

100 files changed

Lines changed: 989 additions & 293 deletions

File tree

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

assets/core/scss/themes/_dark.scss

Lines changed: 11 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -144,7 +144,7 @@
144144
--tutor-tab-sidebar-l4-active: #{$tutor-gray-750};
145145
--tutor-tab-l3: #{$tutor-gray-750};
146146
--tutor-tab-l3-hover: #{$tutor-gray-700};
147-
--tutor-tab-l3-active: #{$tutor-gray-900};
147+
--tutor-tab-l3-active: #{$tutor-gray-750};
148148
--tutor-tab-l3-active-hover: #{$tutor-gray-750};
149149

150150
// =============================================================================
@@ -188,11 +188,21 @@
188188
--tutor-visual-gray-1: #{$tutor-gray-800};
189189
--tutor-visual-gray-2: #{$tutor-gray-700};
190190
--tutor-visual-gray-3: #{$tutor-gray-600};
191+
--tutor-visual-gray-4: #{$tutor-yellow-800};
191192
--tutor-visual-brand-1: #{$tutor-brand-600};
192193
--tutor-visual-brand-2: #{$tutor-brand-800};
194+
--tutor-visual-brand-3: #{$tutor-brand-900};
193195
--tutor-visual-success-1: #{$tutor-success-500};
196+
--tutor-visual-success-2: #{$tutor-success-500};
194197
--tutor-visual-critical-1: #{$tutor-error-600};
198+
--tutor-visual-critical-2: #{$tutor-error-900};
195199
--tutor-visual-caution-1: #{$tutor-yellow-600};
200+
--tutor-visual-caution-2: #{$tutor-yellow-700};
201+
--tutor-visual-caution-3: #{$tutor-yellow-900};
202+
--tutor-visual-orange-1: #{$tutor-orange-400};
203+
--tutor-visual-exception-1: #{$tutor-exception-3};
204+
--tutor-visual-exception-2: #{$tutor-exception-9};
205+
--tutor-visual-exception-3: #{$tutor-exception-2};
196206

197207
// =============================================================================
198208
// TYPOGRAPHY TOKENS

assets/core/scss/themes/_deuteranomaly.scss

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -47,6 +47,11 @@
4747
--tutor-text-critical-hover: #{$tutor-orange-700};
4848
--tutor-text-warning: #{$tutor-orange-700};
4949
--tutor-text-caution: #{$tutor-yellow-700};
50+
51+
// VISUAL COLORS
52+
--tutor-visual-success-1: #{$tutor-cyan-500};
53+
--tutor-visual-success-2: #{$tutor-cyan-500};
54+
--tutor-visual-exception-1: #{$tutor-cyan-200};
5055
}
5156

5257
// =============================================================================
@@ -82,6 +87,10 @@
8287
--tutor-actions-warning-secondary: #{$tutor-orange-100};
8388
--tutor-actions-warning-exception: #{$tutor-orange-600};
8489
--tutor-actions-critical-secondary: #{$tutor-orange-100};
90+
91+
// VISUAL COLORS
92+
--tutor-visual-critical-1: #{$tutor-error-500};
93+
--tutor-visual-critical-2: #{$tutor-orange-100};
8594
}
8695

8796
// =============================================================================
@@ -119,6 +128,10 @@
119128
--tutor-actions-warning-secondary: #{$tutor-gray-700};
120129
--tutor-actions-warning-exception: #{$tutor-orange-50};
121130
--tutor-actions-critical-secondary: #{$tutor-gray-700};
131+
132+
// VISUAL COLORS
133+
--tutor-visual-critical-1: #{$tutor-error-600};
134+
--tutor-visual-critical-2: #{$tutor-orange-900};
122135
}
123136

124137
[data-tutor-theme='light'][data-tutor-vision='deuteranomaly'],

assets/core/scss/themes/_deuteranopia.scss

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -48,6 +48,10 @@
4848
--tutor-text-critical: #{$tutor-orange-500};
4949
--tutor-text-warning: #{$tutor-orange-600};
5050
--tutor-text-caution: #{$tutor-yellow-600};
51+
52+
// VISUAL COLORS
53+
--tutor-visual-success-1: #{$tutor-cyan-500};
54+
--tutor-visual-exception-1: #{$tutor-cyan-400};
5155
}
5256

5357
// =============================================================================
@@ -78,6 +82,11 @@
7882
--tutor-actions-warning-exception: #{$tutor-orange-500};
7983
--tutor-actions-critical-primary: #{$tutor-orange-500};
8084
--tutor-actions-critical-secondary: #{$tutor-orange-100};
85+
86+
// VISUAL COLORS
87+
--tutor-visual-success-2: #{$tutor-cyan-500};
88+
--tutor-visual-critical-1: #{$tutor-orange-500};
89+
--tutor-visual-critical-2: #{$tutor-orange-300};
8190
}
8291

8392
// =============================================================================
@@ -112,6 +121,11 @@
112121
--tutor-actions-critical-primary: #{$tutor-orange-600};
113122
--tutor-actions-critical-secondary: #{$tutor-gray-700};
114123
--tutor-actions-caution: #{$tutor-yellow-500};
124+
125+
// VISUAL COLORS
126+
--tutor-visual-success-2: #{$tutor-cyan-600};
127+
--tutor-visual-critical-1: #{$tutor-orange-600};
128+
--tutor-visual-critical-2: #{$tutor-orange-900};
115129
}
116130

117131
[data-tutor-theme='light'][data-tutor-vision='deuteranopia'],

assets/core/scss/themes/_high-contrast.scss

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -30,6 +30,13 @@
3030
--tutor-border-brand: #{$tutor-brand-600};
3131
--tutor-border-brand-secondary: #{$tutor-brand-800};
3232
--tutor-border-brand-tertiary: #{$tutor-brand-800};
33+
34+
// VISUAL COLORS
35+
--tutor-visual-success-1: #{$tutor-success-500};
36+
--tutor-visual-success-2: #{$tutor-success-500};
37+
--tutor-visual-critical-1: #{$tutor-error-500};
38+
--tutor-visual-critical-2: #{$tutor-error-100};
39+
--tutor-visual-exception-1: #{$tutor-exception-3};
3340
}
3441

3542
// =============================================================================
@@ -57,6 +64,13 @@
5764
--tutor-border-brand: #{$tutor-brand-200};
5865
--tutor-border-brand-secondary: #{$tutor-brand-800};
5966
--tutor-border-brand-tertiary: #{$tutor-brand-700};
67+
68+
// VISUAL COLORS
69+
--tutor-visual-success-1: #{$tutor-success-500};
70+
--tutor-visual-success-2: #{$tutor-success-500};
71+
--tutor-visual-critical-1: #{$tutor-error-600};
72+
--tutor-visual-critical-2: #{$tutor-error-900};
73+
--tutor-visual-exception-1: #{$tutor-exception-3};
6074
}
6175

6276
[data-tutor-theme='light'][data-tutor-contrast='high'],

assets/core/scss/themes/_light.scss

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -188,11 +188,21 @@
188188
--tutor-visual-gray-1: #{$tutor-gray-1};
189189
--tutor-visual-gray-2: #{$tutor-gray-200};
190190
--tutor-visual-gray-3: #{$tutor-gray-300};
191+
--tutor-visual-gray-4: #{$tutor-gray-750};
191192
--tutor-visual-brand-1: #{$tutor-brand-500};
192193
--tutor-visual-brand-2: #{$tutor-brand-400};
194+
--tutor-visual-brand-3: #{$tutor-brand-300};
193195
--tutor-visual-success-1: #{$tutor-success-500};
196+
--tutor-visual-success-2: #{$tutor-success-500};
194197
--tutor-visual-critical-1: #{$tutor-error-500};
198+
--tutor-visual-critical-2: #{$tutor-error-100};
195199
--tutor-visual-caution-1: #{$tutor-yellow-300};
200+
--tutor-visual-caution-2: #{$tutor-yellow-700};
201+
--tutor-visual-caution-3: #{$tutor-yellow-900};
202+
--tutor-visual-orange-1: #{$tutor-orange-400};
203+
--tutor-visual-exception-1: #{$tutor-exception-3};
204+
--tutor-visual-exception-2: #{$tutor-exception-9};
205+
--tutor-visual-exception-3: #{$tutor-exception-2};
196206

197207
// =============================================================================
198208
// TYPOGRAPHY TOKENS

assets/core/scss/themes/_protanopia.scss

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -55,6 +55,11 @@
5555
--tutor-text-critical-hover: #{$tutor-orange-700};
5656
--tutor-text-warning: #{$tutor-orange-700};
5757
--tutor-text-caution: #{$tutor-yellow-700};
58+
59+
// VISUAL COLORS
60+
--tutor-visual-success-1: #{$tutor-cyan-500};
61+
--tutor-visual-success-2: #{$tutor-cyan-500};
62+
--tutor-visual-exception-1: #{$tutor-cyan-200};
5863
}
5964

6065
// =============================================================================
@@ -74,6 +79,10 @@
7479
--tutor-actions-warning-secondary: #{$tutor-orange-100};
7580
--tutor-actions-warning-exception: #{$tutor-orange-600};
7681
--tutor-actions-critical-secondary: #{$tutor-orange-100};
82+
83+
// VISUAL COLORS
84+
--tutor-visual-critical-1: #{$tutor-orange-500};
85+
--tutor-visual-critical-2: #{$tutor-orange-100};
7786
}
7887

7988
// =============================================================================
@@ -91,6 +100,10 @@
91100
// ACTION COLORS
92101
--tutor-actions-success-exception: #{$tutor-cyan-950};
93102
--tutor-actions-warning-exception: #{$tutor-orange-50};
103+
104+
// VISUAL COLORS
105+
--tutor-visual-critical-1: #{$tutor-orange-600};
106+
--tutor-visual-critical-2: #{$tutor-orange-900};
94107
}
95108

96109
[data-tutor-theme='light'][data-tutor-vision='protanopia'],

assets/core/scss/tokens/_colors.scss

Lines changed: 7 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -91,7 +91,7 @@ $tutor-yellow-900: #713b12;
9191
$tutor-yellow-950: #542c0d;
9292

9393
// Cyan Colors (CVD accessibility - replaces green/success)
94-
$tutor-cyan-50: #ecfeff;
94+
$tutor-cyan-50: #ecfeff;
9595
$tutor-cyan-100: #cefafe;
9696
$tutor-cyan-200: #a2f4fd;
9797
$tutor-cyan-300: #53eafd;
@@ -104,7 +104,7 @@ $tutor-cyan-900: #104e64;
104104
$tutor-cyan-950: #053345;
105105

106106
// Orange Colors (CVD accessibility - replaces red/error)
107-
$tutor-orange-50: #fefbe8;
107+
$tutor-orange-50: #fefbe8;
108108
$tutor-orange-100: #ffedd4;
109109
$tutor-orange-200: #ffd6a7;
110110
$tutor-orange-300: #ffb86a;
@@ -123,8 +123,9 @@ $tutor-exception-2-tertiary: #330020;
123123
$tutor-exception-3: #cbfd78;
124124
$tutor-exception-5: #9747ff;
125125
$tutor-exception-6: #f2e8ff;
126-
$tutor-exception-7: #242A37;
127-
$tutor-exception-8: #2C0066;
126+
$tutor-exception-7: #242a37;
127+
$tutor-exception-8: #2c0066;
128+
$tutor-exception-9: #f4f433;
128129

129130
// =============================================================================
130131
// COLOR MAPS (for utility generation)
@@ -232,7 +233,7 @@ $tutor-exception-colors: (
232233
);
233234

234235
$tutor-cyan-colors: (
235-
50: $tutor-cyan-50,
236+
50: $tutor-cyan-50,
236237
100: $tutor-cyan-100,
237238
200: $tutor-cyan-200,
238239
300: $tutor-cyan-300,
@@ -246,7 +247,7 @@ $tutor-cyan-colors: (
246247
);
247248

248249
$tutor-orange-colors: (
249-
50: $tutor-orange-50,
250+
50: $tutor-orange-50,
250251
100: $tutor-orange-100,
251252
200: $tutor-orange-200,
252253
300: $tutor-orange-300,

assets/core/scss/tokens/_visual.scss

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,11 +8,21 @@
88
$tutor-visual-gray-1: var(--tutor-visual-gray-1);
99
$tutor-visual-gray-2: var(--tutor-visual-gray-2);
1010
$tutor-visual-gray-3: var(--tutor-visual-gray-3);
11+
$tutor-visual-gray-4: var(--tutor-visual-gray-4);
1112
$tutor-visual-brand-1: var(--tutor-visual-brand-1);
1213
$tutor-visual-brand-2: var(--tutor-visual-brand-2);
14+
$tutor-visual-brand-3: var(--tutor-visual-brand-3);
1315
$tutor-visual-success-1: var(--tutor-visual-success-1);
16+
$tutor-visual-success-2: var(--tutor-visual-success-2);
1417
$tutor-visual-critical-1: var(--tutor-visual-critical-1);
18+
$tutor-visual-critical-2: var(--tutor-visual-critical-2);
1519
$tutor-visual-caution-1: var(--tutor-visual-caution-1);
20+
$tutor-visual-caution-2: var(--tutor-visual-caution-2);
21+
$tutor-visual-caution-3: var(--tutor-visual-caution-3);
22+
$tutor-visual-orange-1: var(--tutor-visual-orange-1);
23+
$tutor-visual-exception-1: var(--tutor-visual-exception-1);
24+
$tutor-visual-exception-2: var(--tutor-visual-exception-2);
25+
$tutor-visual-exception-3: var(--tutor-visual-exception-3);
1626

1727
// =============================================================================
1828
// VISUAL COLOR MAP (for utility generation)
@@ -22,9 +32,19 @@ $tutor-visual-colors: (
2232
gray-1: $tutor-visual-gray-1,
2333
gray-2: $tutor-visual-gray-2,
2434
gray-3: $tutor-visual-gray-3,
35+
gray-4: $tutor-visual-gray-4,
2536
brand-1: $tutor-visual-brand-1,
2637
brand-2: $tutor-visual-brand-2,
38+
brand-3: $tutor-visual-brand-3,
2739
success-1: $tutor-visual-success-1,
40+
success-2: $tutor-visual-success-2,
2841
critical-1: $tutor-visual-critical-1,
42+
critical-2: $tutor-visual-critical-2,
2943
caution-1: $tutor-visual-caution-1,
44+
caution-2: $tutor-visual-caution-2,
45+
caution-3: $tutor-visual-caution-3,
46+
orange-1: $tutor-visual-orange-1,
47+
exception-1: $tutor-visual-exception-1,
48+
exception-2: $tutor-visual-exception-2,
49+
exception-3: $tutor-visual-exception-3,
3050
);

0 commit comments

Comments
 (0)