@dialpad/dialtone-css 8.71.5 → 8.71.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -10,6 +10,7 @@
|
|
|
10
10
|
// • TRANSITION CLASSES - GRADIENT IN
|
|
11
11
|
// • TRANSITION CLASSES - FADE IN
|
|
12
12
|
// • TRANSITION CLASSES - SLIDE IN
|
|
13
|
+
// • GRADIENT IN
|
|
13
14
|
// • GRADIENT SWEEP & SHIMMER
|
|
14
15
|
// • MODIFIERS
|
|
15
16
|
// • ACCESSIBILITY
|
|
@@ -100,6 +101,16 @@
|
|
|
100
101
|
}
|
|
101
102
|
}
|
|
102
103
|
|
|
104
|
+
@keyframes dt-recipe-motion-text-gradient-in-char-reveal {
|
|
105
|
+
from {
|
|
106
|
+
color: var(--dt-color-neutral-transparent);
|
|
107
|
+
}
|
|
108
|
+
|
|
109
|
+
to {
|
|
110
|
+
color: inherit;
|
|
111
|
+
}
|
|
112
|
+
}
|
|
113
|
+
|
|
103
114
|
@keyframes dt-recipe-motion-text-gradient-in-word-reveal {
|
|
104
115
|
from {
|
|
105
116
|
--dt-recipe-motion-text-mask-pos: 100%;
|
|
@@ -213,6 +224,14 @@
|
|
|
213
224
|
animation: dt-recipe-motion-text-slide-in-word-appear calc(var(--dt-recipe-motion-text-word-duration) * 0.5) var(--ttf-out-quint) reverse;
|
|
214
225
|
}
|
|
215
226
|
|
|
227
|
+
// ============================================================================
|
|
228
|
+
// $ GRADIENT IN
|
|
229
|
+
// ----------------------------------------------------------------------------
|
|
230
|
+
// Delay reveal of character text color to prevent a flash on the first letter
|
|
231
|
+
.dt-recipe-motion-text--gradient-in .dt-recipe-motion-text__char {
|
|
232
|
+
animation: dt-recipe-motion-text-gradient-in-char-reveal var(--dt-recipe-motion-text-char-duration) var(--ttf-in-out);
|
|
233
|
+
}
|
|
234
|
+
|
|
216
235
|
// ============================================================================
|
|
217
236
|
// $ GRADIENT SWEEP & SHIMMER
|
|
218
237
|
// ----------------------------------------------------------------------------
|
|
@@ -10208,6 +10208,22 @@ ul {
|
|
|
10208
10208
|
opacity: 1;
|
|
10209
10209
|
}
|
|
10210
10210
|
}
|
|
10211
|
+
@-webkit-keyframes dt-recipe-motion-text-gradient-in-char-reveal {
|
|
10212
|
+
from {
|
|
10213
|
+
color: var(--dt-color-neutral-transparent);
|
|
10214
|
+
}
|
|
10215
|
+
to {
|
|
10216
|
+
color: inherit;
|
|
10217
|
+
}
|
|
10218
|
+
}
|
|
10219
|
+
@keyframes dt-recipe-motion-text-gradient-in-char-reveal {
|
|
10220
|
+
from {
|
|
10221
|
+
color: var(--dt-color-neutral-transparent);
|
|
10222
|
+
}
|
|
10223
|
+
to {
|
|
10224
|
+
color: inherit;
|
|
10225
|
+
}
|
|
10226
|
+
}
|
|
10211
10227
|
@-webkit-keyframes dt-recipe-motion-text-gradient-in-word-reveal {
|
|
10212
10228
|
from {
|
|
10213
10229
|
--dt-recipe-motion-text-mask-pos: 100%;
|
|
@@ -10346,6 +10362,10 @@ ul {
|
|
|
10346
10362
|
.dt-recipe-motion-text-word-slide-in-leave-active {
|
|
10347
10363
|
animation: dt-recipe-motion-text-slide-in-word-appear calc(var(--dt-recipe-motion-text-word-duration) * 0.5) var(--ttf-out-quint) reverse;
|
|
10348
10364
|
}
|
|
10365
|
+
.dt-recipe-motion-text--gradient-in .dt-recipe-motion-text__char {
|
|
10366
|
+
-webkit-animation: dt-recipe-motion-text-gradient-in-char-reveal var(--dt-recipe-motion-text-char-duration) var(--ttf-in-out);
|
|
10367
|
+
animation: dt-recipe-motion-text-gradient-in-char-reveal var(--dt-recipe-motion-text-char-duration) var(--ttf-in-out);
|
|
10368
|
+
}
|
|
10349
10369
|
.dt-recipe-motion-text--gradient-sweep,
|
|
10350
10370
|
.dt-recipe-motion-text--shimmer {
|
|
10351
10371
|
position: relative;
|