Skip to content

Commit d01312c

Browse files
shewa12shewa12
committed
Merge branch '4.0.0-dev' of https://github.com/themeum/tutor into query-optimize
2 parents d6675ba + fef9000 commit d01312c

167 files changed

Lines changed: 2103 additions & 655 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/components/_star-rating.scss‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,12 @@
33

44
.tutor-star-rating-container {
55
@include tutor-flex(row, center, space-between);
6+
7+
button.tutor-star-rating-icon-btn {
8+
@include tutor-button-reset();
9+
min-height: unset;
10+
}
11+
612
&.is-emoji-view {
713
@include tutor-flex-column;
814
gap: $tutor-spacing-7;

‎assets/core/scss/mixins/_buttons.scss‎

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -41,12 +41,12 @@
4141

4242
&:disabled,
4343
&.disabled {
44-
color: $tutor-text-disabled;
44+
color: $tutor-text-subdued;
4545
cursor: not-allowed;
4646
pointer-events: none;
4747

4848
svg:not([class]) {
49-
color: $tutor-icon-disabled;
49+
color: $tutor-icon-subdued;
5050
}
5151
}
5252
}
@@ -103,7 +103,6 @@
103103
&:disabled,
104104
&.disabled {
105105
background-color: $tutor-button-disabled;
106-
color: $tutor-text-brand;
107106
--tutor-button-border-shadow: #{$tutor-button-primary-soft-border-shadow-disabled};
108107
}
109108
} @else if $variant == destructive {
@@ -130,7 +129,6 @@
130129
&:disabled,
131130
&.disabled {
132131
background-color: $tutor-button-disabled;
133-
color: $tutor-text-primary-inverse;
134132
--tutor-button-border-shadow: #{$tutor-button-destructive-border-shadow-disabled};
135133
}
136134
} @else if $variant == destructive-soft {

‎assets/core/scss/mixins/_inputs.scss‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -55,6 +55,13 @@
5555
@if $size == lg {
5656
padding: $tutor-spacing-5;
5757
}
58+
59+
// Prevent iOS Safari from auto-zooming focused fields and exposing
60+
// horizontal overflow on mobile layouts.
61+
@media (hover: none) and (pointer: coarse) {
62+
font-size: $tutor-font-size-medium;
63+
line-height: $tutor-line-height-medium;
64+
}
5865
}
5966

6067
@mixin tutor-textarea($min-height: 92px) {

‎assets/core/scss/themes/_dark.scss‎

Lines changed: 26 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,8 @@
33

44
@use '../tokens' as *;
55

6-
[data-tutor-theme='dark'] {
6+
// Mixin containing all dark theme tokens
7+
@mixin dark-theme-tokens {
78
// =============================================================================
89
// SURFACE COLORS
910
// =============================================================================
@@ -143,7 +144,7 @@
143144
--tutor-tab-sidebar-l4-active: #{$tutor-gray-750};
144145
--tutor-tab-l3: #{$tutor-gray-750};
145146
--tutor-tab-l3-hover: #{$tutor-gray-700};
146-
--tutor-tab-l3-active: #{$tutor-gray-900};
147+
--tutor-tab-l3-active: #{$tutor-gray-750};
147148
--tutor-tab-l3-active-hover: #{$tutor-gray-750};
148149

149150
// =============================================================================
@@ -187,11 +188,21 @@
187188
--tutor-visual-gray-1: #{$tutor-gray-800};
188189
--tutor-visual-gray-2: #{$tutor-gray-700};
189190
--tutor-visual-gray-3: #{$tutor-gray-600};
191+
--tutor-visual-gray-4: #{$tutor-yellow-800};
190192
--tutor-visual-brand-1: #{$tutor-brand-600};
191193
--tutor-visual-brand-2: #{$tutor-brand-800};
194+
--tutor-visual-brand-3: #{$tutor-brand-900};
192195
--tutor-visual-success-1: #{$tutor-success-500};
196+
--tutor-visual-success-2: #{$tutor-success-500};
193197
--tutor-visual-critical-1: #{$tutor-error-600};
198+
--tutor-visual-critical-2: #{$tutor-error-900};
194199
--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};
195206

196207
// =============================================================================
197208
// TYPOGRAPHY TOKENS
@@ -214,3 +225,16 @@
214225
--tutor-shadow-2xl: #{$tutor-shadow-2xl};
215226
--tutor-shadow-3xl: #{$tutor-shadow-3xl};
216227
}
228+
229+
// Apply dark theme when explicitly set
230+
[data-tutor-theme='dark'] {
231+
@include dark-theme-tokens;
232+
}
233+
234+
// Apply dark theme when system preference is dark
235+
// This prevents flash of light theme before JS loads
236+
@media (prefers-color-scheme: dark) {
237+
[data-tutor-theme='system'] {
238+
@include dark-theme-tokens;
239+
}
240+
}

‎assets/core/scss/themes/_deuteranomaly.scss‎

Lines changed: 30 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -47,13 +47,18 @@
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
// =============================================================================
5358
// LIGHT — overrides specific to the light base theme
5459
// =============================================================================
5560

56-
[data-tutor-theme='light'][data-tutor-vision='deuteranomaly'] {
61+
@mixin deuteranomaly-light-tokens {
5762
// SURFACE COLORS
5863
--tutor-surface-warning: #{$tutor-warning-50};
5964
--tutor-surface-warning-hover: #{$tutor-warning-100};
@@ -82,13 +87,17 @@
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
// =============================================================================
8897
// DARK — overrides specific to the dark base theme
8998
// =============================================================================
9099

91-
[data-tutor-theme='dark'][data-tutor-vision='deuteranomaly'] {
100+
@mixin deuteranomaly-dark-tokens {
92101
// SURFACE COLORS
93102
--tutor-surface-warning: #{$tutor-gray-750};
94103
--tutor-surface-warning-hover: #{$tutor-warning-900};
@@ -119,4 +128,23 @@
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};
135+
}
136+
137+
[data-tutor-theme='light'][data-tutor-vision='deuteranomaly'],
138+
[data-tutor-theme='system'][data-tutor-vision='deuteranomaly'] {
139+
@include deuteranomaly-light-tokens;
140+
}
141+
142+
[data-tutor-theme='dark'][data-tutor-vision='deuteranomaly'] {
143+
@include deuteranomaly-dark-tokens;
144+
}
145+
146+
@media (prefers-color-scheme: dark) {
147+
[data-tutor-theme='system'][data-tutor-vision='deuteranomaly'] {
148+
@include deuteranomaly-dark-tokens;
149+
}
122150
}

‎assets/core/scss/themes/_deuteranopia.scss‎

Lines changed: 31 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -48,13 +48,17 @@
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
// =============================================================================
5458
// LIGHT — overrides specific to the light base theme
5559
// =============================================================================
5660

57-
[data-tutor-theme='light'][data-tutor-vision='deuteranopia'] {
61+
@mixin deuteranopia-light-tokens {
5862
// SURFACE COLORS
5963
--tutor-surface-warning: #{$tutor-warning-50};
6064
--tutor-surface-warning-hover: #{$tutor-warning-100};
@@ -78,13 +82,18 @@
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
// =============================================================================
8493
// DARK — overrides specific to the dark base theme
8594
// =============================================================================
8695

87-
[data-tutor-theme='dark'][data-tutor-vision='deuteranopia'] {
96+
@mixin deuteranopia-dark-tokens {
8897
// SURFACE COLORS
8998
--tutor-surface-warning: #{$tutor-gray-750};
9099
--tutor-surface-warning-hover: #{$tutor-warning-900};
@@ -112,4 +121,24 @@
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};
129+
}
130+
131+
[data-tutor-theme='light'][data-tutor-vision='deuteranopia'],
132+
[data-tutor-theme='system'][data-tutor-vision='deuteranopia'] {
133+
@include deuteranopia-light-tokens;
134+
}
135+
136+
[data-tutor-theme='dark'][data-tutor-vision='deuteranopia'] {
137+
@include deuteranopia-dark-tokens;
138+
}
139+
140+
@media (prefers-color-scheme: dark) {
141+
[data-tutor-theme='system'][data-tutor-vision='deuteranopia'] {
142+
@include deuteranopia-dark-tokens;
143+
}
115144
}

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

Lines changed: 31 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@
99
// LIGHT — overrides specific to the light base theme
1010
// =============================================================================
1111

12-
[data-tutor-theme='light'][data-tutor-contrast='high'] {
12+
@mixin high-contrast-light-tokens {
1313
// TEXT COLORS
1414
--tutor-text-primary: #{$tutor-gray-950};
1515
--tutor-text-secondary: #{$tutor-gray-950};
@@ -30,13 +30,20 @@
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
// =============================================================================
3643
// DARK — overrides specific to the dark base theme
3744
// =============================================================================
3845

39-
[data-tutor-theme='dark'][data-tutor-contrast='high'] {
46+
@mixin high-contrast-dark-tokens {
4047
// TEXT COLORS
4148
--tutor-text-primary: #{$tutor-gray-100};
4249
--tutor-text-secondary: #{$tutor-gray-50};
@@ -57,4 +64,26 @@
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};
74+
}
75+
76+
[data-tutor-theme='light'][data-tutor-contrast='high'],
77+
[data-tutor-theme='system'][data-tutor-contrast='high'] {
78+
@include high-contrast-light-tokens;
79+
}
80+
81+
[data-tutor-theme='dark'][data-tutor-contrast='high'] {
82+
@include high-contrast-dark-tokens;
83+
}
84+
85+
@media (prefers-color-scheme: dark) {
86+
[data-tutor-theme='system'][data-tutor-contrast='high'] {
87+
@include high-contrast-dark-tokens;
88+
}
6089
}

‎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: 30 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -55,13 +55,18 @@
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
// =============================================================================
6166
// LIGHT — overrides specific to the light base theme
6267
// =============================================================================
6368

64-
[data-tutor-theme='light'][data-tutor-vision='protanopia'] {
69+
@mixin protanopia-light-tokens {
6570
// SURFACE COLORS
6671
--tutor-surface-success: #{$tutor-cyan-50};
6772
--tutor-surface-critical: #{$tutor-orange-100};
@@ -74,13 +79,17 @@
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
// =============================================================================
8089
// DARK — overrides specific to the dark base theme
8190
// =============================================================================
8291

83-
[data-tutor-theme='dark'][data-tutor-vision='protanopia'] {
92+
@mixin protanopia-dark-tokens {
8493
// SURFACE COLORS
8594
--tutor-surface-success: #{$tutor-cyan-900};
8695
--tutor-surface-critical: #{$tutor-orange-900};
@@ -91,4 +100,23 @@
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};
107+
}
108+
109+
[data-tutor-theme='light'][data-tutor-vision='protanopia'],
110+
[data-tutor-theme='system'][data-tutor-vision='protanopia'] {
111+
@include protanopia-light-tokens;
112+
}
113+
114+
[data-tutor-theme='dark'][data-tutor-vision='protanopia'] {
115+
@include protanopia-dark-tokens;
116+
}
117+
118+
@media (prefers-color-scheme: dark) {
119+
[data-tutor-theme='system'][data-tutor-vision='protanopia'] {
120+
@include protanopia-dark-tokens;
121+
}
94122
}

0 commit comments

Comments
 (0)