Skip to content

Commit 3bf8b68

Browse files
b-l-i-n-db-l-i-n-d
committed
Merge branch '4.0.0-dev' into v4-quiz
2 parents f5a6395 + 8bdc0ab commit 3bf8b68

97 files changed

Lines changed: 4138 additions & 1901 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/_tabs.scss‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -57,6 +57,10 @@
5757
}
5858
}
5959

60+
&-sm {
61+
height: 32px;
62+
}
63+
6064
&:hover:not(:disabled):not(.tutor-tabs-tab-active),
6165
&:focus:not(:disabled):not(.tutor-tabs-tab-active) {
6266
color: $tutor-text-primary;

‎assets/core/scss/components/_tooltip.scss‎

Lines changed: 2 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -8,13 +8,7 @@
88
.tutor-tooltip-wrap {
99
position: relative;
1010
display: inline-block;
11-
12-
&:hover {
13-
.tutor-tooltip:not([x-data]) {
14-
opacity: 1;
15-
visibility: visible;
16-
}
17-
}
11+
line-height: 0;
1812
}
1913

2014
.tutor-tooltip {
@@ -28,6 +22,7 @@
2822
box-shadow: $tutor-shadow-md;
2923
word-wrap: break-word;
3024
text-align: center;
25+
pointer-events: none;
3126

3227
&-large {
3328
max-width: 320px;
@@ -73,8 +68,6 @@
7368
}
7469

7570
&-top {
76-
margin-bottom: $tutor-spacing-2;
77-
7871
&::before {
7972
top: 100%;
8073
border-top-color: $tutor-surface-dark;
@@ -83,8 +76,6 @@
8376
}
8477

8578
&-bottom {
86-
margin-top: $tutor-spacing-2;
87-
8879
&::before {
8980
bottom: 100%;
9081
border-bottom-color: $tutor-surface-dark;
@@ -93,8 +84,6 @@
9384
}
9485

9586
&-start {
96-
margin-inline-end: $tutor-spacing-2;
97-
9887
&::before {
9988
top: 50%;
10089
inset-inline-start: 100%;
@@ -104,8 +93,6 @@
10493
}
10594

10695
&-end {
107-
margin-inline-start: $tutor-spacing-2;
108-
10996
&::before {
11097
top: 50%;
11198
inset-inline-end: 100%;

‎assets/core/scss/mixins/_avatars.scss‎

Lines changed: 97 additions & 96 deletions
Original file line numberDiff line numberDiff line change
@@ -1,119 +1,120 @@
11
// Avatar Mixins
2-
@use "../tokens" as *;
3-
@use "typography" as *;
4-
@use "layout" as *;
2+
@use '../tokens' as *;
3+
@use 'typography' as *;
4+
@use 'layout' as *;
55

66
@mixin tutor-avatar-base {
7-
@include tutor-flex-center;
8-
position: relative;
9-
border-radius: $tutor-radius-full;
10-
overflow: hidden;
11-
background-color: $tutor-button-primary-soft;
12-
color: $tutor-text-primary;
13-
flex-shrink: 0;
14-
user-select: none;
7+
@include tutor-flex-center;
8+
position: relative;
9+
border-radius: $tutor-radius-full;
10+
overflow: hidden;
11+
background-color: $tutor-button-primary-soft;
12+
color: $tutor-text-primary;
13+
flex-shrink: 0;
14+
user-select: none;
1515
}
1616

1717
@mixin tutor-avatar-image {
18-
width: 100%;
19-
height: 100%;
20-
object-fit: cover;
18+
width: 100%;
19+
height: 100%;
20+
object-fit: cover;
21+
aspect-ratio: 1/1;
2122
}
2223

2324
@mixin tutor-avatar-initials {
24-
@include tutor-typography('small', 'medium');
25-
color: inherit;
26-
text-transform: uppercase;
27-
letter-spacing: 0.5px;
25+
@include tutor-typography('small', 'medium');
26+
color: inherit;
27+
text-transform: uppercase;
28+
letter-spacing: 0.5px;
2829
}
2930

3031
// Avatar sizes map
3132
$tutor-avatar-sizes: (
32-
20: (
33-
font-size: 'tiny',
34-
icon-size: 12px
35-
),
36-
24: (
37-
font-size: 'tiny',
38-
icon-size: 12px
39-
),
40-
32: (
41-
font-size: 'tiny',
42-
icon-size: 16px
43-
),
44-
40: (
45-
font-size: 'small',
46-
icon-size: 20px
47-
),
48-
48: (
49-
font-size: 'small',
50-
icon-size: 24px
51-
),
52-
56: (
53-
font-size: 'medium',
54-
icon-size: 28px
55-
),
56-
64: (
57-
font-size: 'medium',
58-
icon-size: 32px
59-
),
60-
80: (
61-
font-size: $tutor-font-size-h4,
62-
icon-size: 40px
63-
),
64-
104: (
65-
font-size: $tutor-font-size-h3,
66-
icon-size: 48px
67-
)
33+
20: (
34+
font-size: 'tiny',
35+
icon-size: 12px,
36+
),
37+
24: (
38+
font-size: 'tiny',
39+
icon-size: 12px,
40+
),
41+
32: (
42+
font-size: 'tiny',
43+
icon-size: 16px,
44+
),
45+
40: (
46+
font-size: 'small',
47+
icon-size: 20px,
48+
),
49+
48: (
50+
font-size: 'small',
51+
icon-size: 24px,
52+
),
53+
56: (
54+
font-size: 'medium',
55+
icon-size: 28px,
56+
),
57+
64: (
58+
font-size: 'medium',
59+
icon-size: 32px,
60+
),
61+
80: (
62+
font-size: $tutor-font-size-h4,
63+
icon-size: 40px,
64+
),
65+
104: (
66+
font-size: $tutor-font-size-h3,
67+
icon-size: 48px,
68+
),
6869
);
6970

7071
@mixin tutor-avatar-size($size) {
71-
@if map-has-key($tutor-avatar-sizes, $size) {
72-
$config: map-get($tutor-avatar-sizes, $size);
73-
$font-size: map-get($config, font-size);
74-
$icon-size: map-get($config, icon-size);
72+
@if map-has-key($tutor-avatar-sizes, $size) {
73+
$config: map-get($tutor-avatar-sizes, $size);
74+
$font-size: map-get($config, font-size);
75+
$icon-size: map-get($config, icon-size);
7576

76-
width: #{$size}px;
77-
height: #{$size}px;
77+
width: #{$size}px;
78+
height: #{$size}px;
7879

79-
.tutor-avatar-initials {
80-
@if type-of($font-size) == 'string' {
81-
@include tutor-typography($font-size, 'medium');
82-
} @else {
83-
font-size: $font-size;
84-
font-weight: $tutor-font-weight-medium;
85-
}
86-
}
80+
.tutor-avatar-initials {
81+
@if type-of($font-size) == 'string' {
82+
@include tutor-typography($font-size, 'medium');
83+
} @else {
84+
font-size: $font-size;
85+
font-weight: $tutor-font-weight-medium;
86+
}
87+
}
8788

88-
svg {
89-
width: $icon-size;
90-
height: $icon-size;
91-
}
92-
}
89+
svg {
90+
width: $icon-size;
91+
height: $icon-size;
92+
}
93+
}
9394
}
9495

9596
// Avatar variants
9697
@mixin tutor-avatar-variant($variant: default) {
97-
@if $variant == square {
98-
border-radius: $tutor-radius-md;
99-
100-
svg,
101-
.tutor-avatar-image {
102-
border-radius: $tutor-radius-md;
103-
}
104-
} @else if $variant == icon {
105-
background-color: $tutor-surface-brand-tertiary;
106-
color: $tutor-text-secondary;
107-
108-
&:hover {
109-
background-color: $tutor-actions-brand-tertiary;
110-
color: $tutor-actions-brand-primary;
111-
}
112-
} @else if $variant == border {
113-
border: 2px solid $tutor-surface-l2;
114-
svg,
115-
.tutor-avatar-image {
116-
border-radius: 0px;
117-
}
118-
}
119-
}
98+
@if $variant == square {
99+
border-radius: $tutor-radius-md;
100+
101+
svg,
102+
.tutor-avatar-image {
103+
border-radius: $tutor-radius-md;
104+
}
105+
} @else if $variant == icon {
106+
background-color: $tutor-surface-brand-tertiary;
107+
color: $tutor-text-secondary;
108+
109+
&:hover {
110+
background-color: $tutor-actions-brand-tertiary;
111+
color: $tutor-actions-brand-primary;
112+
}
113+
} @else if $variant == border {
114+
border: 2px solid $tutor-surface-l2;
115+
svg,
116+
.tutor-avatar-image {
117+
border-radius: 0px;
118+
}
119+
}
120+
}

‎assets/core/scss/mixins/_badges.scss‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@
1010
align-items: center;
1111
gap: $tutor-spacing-3;
1212
background-color: $tutor-actions-gray-secondary;
13+
width: fit-content;
1314

1415
img,
1516
svg {

0 commit comments

Comments
 (0)