@dialpad/dialtone-css 8.31.2 → 8.32.0
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.
- package/lib/build/less/components/empty-state.less +56 -0
- package/lib/build/less/components/link.less +41 -0
- package/lib/build/less/components/tooltip.less +161 -4
- package/lib/build/less/dialtone.less +1 -0
- package/lib/dist/dialtone.css +212 -2
- package/lib/dist/dialtone.min.css +1 -1
- package/package.json +1 -1
|
@@ -0,0 +1,56 @@
|
|
|
1
|
+
//
|
|
2
|
+
// DIALTONE
|
|
3
|
+
// COMPONENTS: EMPTY-STATE
|
|
4
|
+
//
|
|
5
|
+
// These are the styles for empty-state component.
|
|
6
|
+
//
|
|
7
|
+
//
|
|
8
|
+
// TABLE OF CONTENTS
|
|
9
|
+
// • BASE STYLE
|
|
10
|
+
|
|
11
|
+
// @@ BASE STYLE
|
|
12
|
+
// ----------------------------------------------------------------------------
|
|
13
|
+
.d-empty-state {
|
|
14
|
+
display: flex;
|
|
15
|
+
flex-direction: column;
|
|
16
|
+
align-items: center;
|
|
17
|
+
justify-content: center;
|
|
18
|
+
text-align: center;
|
|
19
|
+
margin: 0 auto;
|
|
20
|
+
|
|
21
|
+
&--size-sm {
|
|
22
|
+
width: 50%;
|
|
23
|
+
padding: var(--dt-space-500);
|
|
24
|
+
|
|
25
|
+
h1{
|
|
26
|
+
font: var(--dt-typography-headline-md);
|
|
27
|
+
}
|
|
28
|
+
p{
|
|
29
|
+
font: var(--dt-typography-body-sm);
|
|
30
|
+
}
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
&--size-md {
|
|
34
|
+
width: 70%;
|
|
35
|
+
padding: var(--dt-space-500);
|
|
36
|
+
|
|
37
|
+
h1{
|
|
38
|
+
font: var(--dt-typography-headline-xl);
|
|
39
|
+
}
|
|
40
|
+
p{
|
|
41
|
+
font: var(--dt-typography-body-sm);
|
|
42
|
+
}
|
|
43
|
+
}
|
|
44
|
+
|
|
45
|
+
&--size-lg {
|
|
46
|
+
width: 100%;
|
|
47
|
+
padding: var(--dt-space-600);
|
|
48
|
+
|
|
49
|
+
h1{
|
|
50
|
+
font: var(--dt-typography-headline-xxl);
|
|
51
|
+
}
|
|
52
|
+
p{
|
|
53
|
+
font: var(--dt-typography-body-md);
|
|
54
|
+
}
|
|
55
|
+
}
|
|
56
|
+
}
|
|
@@ -130,6 +130,47 @@
|
|
|
130
130
|
}
|
|
131
131
|
}
|
|
132
132
|
|
|
133
|
+
// $$ INVERTED DANGER
|
|
134
|
+
// ----------------------------------------------------------------------------
|
|
135
|
+
&--inverted-danger {
|
|
136
|
+
--link-color-default: var(--dt-color-link-critical-inverted);
|
|
137
|
+
--link-color-default-hover: var(--dt-color-link-critical-inverted-hover);
|
|
138
|
+
}
|
|
139
|
+
|
|
140
|
+
// $$ INVERTED SUCCESS
|
|
141
|
+
// ----------------------------------------------------------------------------
|
|
142
|
+
&--inverted-success {
|
|
143
|
+
--link-color-default: var(--dt-color-link-success-inverted);
|
|
144
|
+
--link-color-default-hover: var(--dt-color-link-success-inverted-hover);
|
|
145
|
+
}
|
|
146
|
+
|
|
147
|
+
// $$ INVERTED WARNING
|
|
148
|
+
// ----------------------------------------------------------------------------
|
|
149
|
+
&--inverted-warning {
|
|
150
|
+
--link-color-default: var(--dt-color-link-warning-inverted);
|
|
151
|
+
--link-color-default-hover: var(--dt-color-link-warning-inverted-hover);
|
|
152
|
+
}
|
|
153
|
+
|
|
154
|
+
// $$ INVERTED MUTED
|
|
155
|
+
// ----------------------------------------------------------------------------
|
|
156
|
+
&--inverted-muted {
|
|
157
|
+
--link-color-default: var(--dt-color-link-muted-inverted);
|
|
158
|
+
--link-color-default-hover: var(--dt-color-link-muted-inverted-hover);
|
|
159
|
+
}
|
|
160
|
+
|
|
161
|
+
// $$ INVERTED MENTION
|
|
162
|
+
// ----------------------------------------------------------------------------
|
|
163
|
+
&--inverted-mention {
|
|
164
|
+
--link-color-default: var(--dt-color-link-primary-inverted);
|
|
165
|
+
--link-color-default-hover: var(--dt-color-link-primary-inverted-hover);
|
|
166
|
+
--link-text-decoration: none;
|
|
167
|
+
--link-padding: 0 var(--dt-space-200);
|
|
168
|
+
--link-background-color: hsl(var(--dt-color-purple-400-hsl) / 0.2);
|
|
169
|
+
|
|
170
|
+
line-height: var(--dt-font-line-height-200);
|
|
171
|
+
border-radius: var(--dt-size-radius-200);
|
|
172
|
+
}
|
|
173
|
+
|
|
133
174
|
// $$ MENTION
|
|
134
175
|
// ----------------------------------------------------------------------------
|
|
135
176
|
// Styling specific to mentions such as @brad.paugh. The underline highlighting
|
|
@@ -56,6 +56,12 @@
|
|
|
56
56
|
text-align: center;
|
|
57
57
|
background-color: var(--tooltip-color-background);
|
|
58
58
|
border-radius: var(--tooltip-border-radius);
|
|
59
|
+
|
|
60
|
+
&::after {
|
|
61
|
+
position: absolute;
|
|
62
|
+
border: var(--dt-size-350) solid transparent;
|
|
63
|
+
content: '';
|
|
64
|
+
}
|
|
59
65
|
}
|
|
60
66
|
|
|
61
67
|
// ============================================================================
|
|
@@ -98,13 +104,164 @@
|
|
|
98
104
|
// ----------------------------------------------------------------------------
|
|
99
105
|
.d-tooltip--hover {
|
|
100
106
|
.d-tooltip {
|
|
101
|
-
|
|
107
|
+
&:extend(.d-tooltip--hide);
|
|
102
108
|
}
|
|
103
109
|
|
|
104
110
|
&:hover,
|
|
105
111
|
&:focus-visible {
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
112
|
+
.d-tooltip {
|
|
113
|
+
&:extend(.d-tooltip--show);
|
|
114
|
+
}
|
|
109
115
|
}
|
|
110
116
|
}
|
|
117
|
+
|
|
118
|
+
// ============================================================================
|
|
119
|
+
// $ TOOLTIP DIRECTIONS
|
|
120
|
+
// ============================================================================
|
|
121
|
+
// $$ TOP
|
|
122
|
+
// ----------------------------------------------------------------------------
|
|
123
|
+
.d-tooltip__arrow-tippy--bottom-start,
|
|
124
|
+
.d-tooltip__arrow-tippy--bottom,
|
|
125
|
+
.d-tooltip__arrow-tippy--bottom-end,
|
|
126
|
+
.d-tooltip__arrow--top-left,
|
|
127
|
+
.d-tooltip__arrow--top-center,
|
|
128
|
+
.d-tooltip__arrow--top-right {
|
|
129
|
+
top: calc(100% + var(--dt-space-450)); // 100% + 12
|
|
130
|
+
transform: translateY(var(--dt-space-500)); // 16
|
|
131
|
+
|
|
132
|
+
&::after {
|
|
133
|
+
top: calc(var(--dt-space-350-negative) - var(--dt-space-50-negative)); // -5.5
|
|
134
|
+
border-top-width: 0;
|
|
135
|
+
border-bottom-color: var(--tooltip-color-background);
|
|
136
|
+
}
|
|
137
|
+
}
|
|
138
|
+
|
|
139
|
+
// $$ BOTTOM
|
|
140
|
+
// ----------------------------------------------------------------------------
|
|
141
|
+
.d-tooltip__arrow-tippy--top-start,
|
|
142
|
+
.d-tooltip__arrow-tippy--top,
|
|
143
|
+
.d-tooltip__arrow-tippy--top-end,
|
|
144
|
+
.d-tooltip__arrow--bottom-left,
|
|
145
|
+
.d-tooltip__arrow--bottom-center,
|
|
146
|
+
.d-tooltip__arrow--bottom-right {
|
|
147
|
+
bottom: calc(100% + var(--dt-space-450)); // 100% + 12
|
|
148
|
+
transform: translateY(var(--dt-space-500-negative)); // -16
|
|
149
|
+
|
|
150
|
+
&::after {
|
|
151
|
+
bottom: calc(var(--dt-space-350-negative) - var(--dt-space-50-negative)); // -5.5
|
|
152
|
+
border-top-color: var(--tooltip-color-background);
|
|
153
|
+
border-bottom-width: 0;
|
|
154
|
+
}
|
|
155
|
+
}
|
|
156
|
+
|
|
157
|
+
// $$ TOP / BOTTOM LEFT
|
|
158
|
+
// ----------------------------------------------------------------------------
|
|
159
|
+
.d-tooltip__arrow-tippy--bottom-start,
|
|
160
|
+
.d-tooltip__arrow-tippy--top-start,
|
|
161
|
+
.d-tooltip__arrow--top-left,
|
|
162
|
+
.d-tooltip__arrow--bottom-left {
|
|
163
|
+
left: var(--dt-space-200-negative); // -2
|
|
164
|
+
|
|
165
|
+
&::after {
|
|
166
|
+
left: var(--dt-space-500); // 16
|
|
167
|
+
}
|
|
168
|
+
}
|
|
169
|
+
|
|
170
|
+
// $$ TOP / BOTTOM CENTER
|
|
171
|
+
// ----------------------------------------------------------------------------
|
|
172
|
+
.d-tooltip__arrow-tippy--bottom,
|
|
173
|
+
.d-tooltip__arrow-tippy--top,
|
|
174
|
+
.d-tooltip__arrow--top-center,
|
|
175
|
+
.d-tooltip__arrow--bottom-center {
|
|
176
|
+
&::after {
|
|
177
|
+
left: 50%;
|
|
178
|
+
margin-left: var(--dt-space-350-negative); // -6
|
|
179
|
+
}
|
|
180
|
+
}
|
|
181
|
+
|
|
182
|
+
// $$ TOP / BOTTOM RIGHT
|
|
183
|
+
// ----------------------------------------------------------------------------
|
|
184
|
+
.d-tooltip__arrow-tippy--bottom-end,
|
|
185
|
+
.d-tooltip__arrow-tippy--top-end,
|
|
186
|
+
.d-tooltip__arrow--top-right,
|
|
187
|
+
.d-tooltip__arrow--bottom-right {
|
|
188
|
+
right: var(--dt-space-200-negative); // -2
|
|
189
|
+
|
|
190
|
+
&::after {
|
|
191
|
+
right: var(--dt-space-500); // 16
|
|
192
|
+
}
|
|
193
|
+
}
|
|
194
|
+
|
|
195
|
+
// $$ RIGHT
|
|
196
|
+
// ----------------------------------------------------------------------------
|
|
197
|
+
.d-tooltip__arrow-tippy--left-start,
|
|
198
|
+
.d-tooltip__arrow-tippy--left,
|
|
199
|
+
.d-tooltip__arrow-tippy--left-end,
|
|
200
|
+
.d-tooltip__arrow--right-top,
|
|
201
|
+
.d-tooltip__arrow--right-center,
|
|
202
|
+
.d-tooltip__arrow--right-bottom {
|
|
203
|
+
right: calc(100% + var(--dt-space-450)); // 100% + 12
|
|
204
|
+
transform: translateX(var(--dt-space-500-negative)); // -16
|
|
205
|
+
|
|
206
|
+
&::after {
|
|
207
|
+
right: calc(var(--dt-space-350-negative) - var(--dt-space-50-negative)); // -5.5
|
|
208
|
+
border-right-width: 0;
|
|
209
|
+
border-left-color: var(--tooltip-color-background);
|
|
210
|
+
}
|
|
211
|
+
}
|
|
212
|
+
|
|
213
|
+
// $$ LEFT
|
|
214
|
+
// ----------------------------------------------------------------------------
|
|
215
|
+
.d-tooltip__arrow-tippy--right-start,
|
|
216
|
+
.d-tooltip__arrow-tippy--right,
|
|
217
|
+
.d-tooltip__arrow-tippy--right-end,
|
|
218
|
+
.d-tooltip__arrow--left-top,
|
|
219
|
+
.d-tooltip__arrow--left-center,
|
|
220
|
+
.d-tooltip__arrow--left-bottom {
|
|
221
|
+
left: calc(100% + var(--dt-space-450)); // 100% + 12
|
|
222
|
+
transform: translateX(var(--dt-space-500)); // 16
|
|
223
|
+
|
|
224
|
+
&::after {
|
|
225
|
+
left: calc(var(--dt-space-350-negative) - var(--dt-space-50-negative)); // -5.5
|
|
226
|
+
border-right-color: var(--tooltip-color-background);
|
|
227
|
+
border-left-width: 0;
|
|
228
|
+
}
|
|
229
|
+
}
|
|
230
|
+
|
|
231
|
+
// $$ RIGHT / LEFT TOP
|
|
232
|
+
// ----------------------------------------------------------------------------
|
|
233
|
+
.d-tooltip__arrow-tippy--right-start,
|
|
234
|
+
.d-tooltip__arrow-tippy--left-start,
|
|
235
|
+
.d-tooltip__arrow--right-top,
|
|
236
|
+
.d-tooltip__arrow--left-top {
|
|
237
|
+
top: var(--dt-space-100-negative); // -1
|
|
238
|
+
|
|
239
|
+
&::after {
|
|
240
|
+
top: var(--dt-space-400); // 8
|
|
241
|
+
}
|
|
242
|
+
}
|
|
243
|
+
|
|
244
|
+
// $$ RIGHT / LEFT CENTER
|
|
245
|
+
// ----------------------------------------------------------------------------
|
|
246
|
+
.d-tooltip__arrow-tippy--right,
|
|
247
|
+
.d-tooltip__arrow-tippy--left,
|
|
248
|
+
.d-tooltip__arrow--right-center,
|
|
249
|
+
.d-tooltip__arrow--left-center {
|
|
250
|
+
&::after {
|
|
251
|
+
top: 50%;
|
|
252
|
+
margin-top: var(--dt-space-350-negative); // -6
|
|
253
|
+
}
|
|
254
|
+
}
|
|
255
|
+
|
|
256
|
+
// $$ RIGHT / LEFT BOTTOM
|
|
257
|
+
// ----------------------------------------------------------------------------
|
|
258
|
+
.d-tooltip__arrow-tippy--right-end,
|
|
259
|
+
.d-tooltip__arrow-tippy--left-end,
|
|
260
|
+
.d-tooltip__arrow--right-bottom,
|
|
261
|
+
.d-tooltip__arrow--left-bottom {
|
|
262
|
+
bottom: var(--dt-space-100-negative); // -1
|
|
263
|
+
|
|
264
|
+
&::after {
|
|
265
|
+
bottom: var(--dt-space-400); // 8
|
|
266
|
+
}
|
|
267
|
+
}
|
package/lib/dist/dialtone.css
CHANGED
|
@@ -1871,6 +1871,44 @@ template {
|
|
|
1871
1871
|
width: 100%;
|
|
1872
1872
|
max-width: calc(var(--dt-size-905) + var(--dt-size-550) + var(--dt-size-200));
|
|
1873
1873
|
}
|
|
1874
|
+
.d-empty-state {
|
|
1875
|
+
display: flex;
|
|
1876
|
+
flex-direction: column;
|
|
1877
|
+
align-items: center;
|
|
1878
|
+
justify-content: center;
|
|
1879
|
+
text-align: center;
|
|
1880
|
+
margin: 0 auto;
|
|
1881
|
+
}
|
|
1882
|
+
.d-empty-state--size-sm {
|
|
1883
|
+
width: 50%;
|
|
1884
|
+
padding: var(--dt-space-500);
|
|
1885
|
+
}
|
|
1886
|
+
.d-empty-state--size-sm h1 {
|
|
1887
|
+
font: var(--dt-typography-headline-md);
|
|
1888
|
+
}
|
|
1889
|
+
.d-empty-state--size-sm p {
|
|
1890
|
+
font: var(--dt-typography-body-sm);
|
|
1891
|
+
}
|
|
1892
|
+
.d-empty-state--size-md {
|
|
1893
|
+
width: 70%;
|
|
1894
|
+
padding: var(--dt-space-500);
|
|
1895
|
+
}
|
|
1896
|
+
.d-empty-state--size-md h1 {
|
|
1897
|
+
font: var(--dt-typography-headline-xl);
|
|
1898
|
+
}
|
|
1899
|
+
.d-empty-state--size-md p {
|
|
1900
|
+
font: var(--dt-typography-body-sm);
|
|
1901
|
+
}
|
|
1902
|
+
.d-empty-state--size-lg {
|
|
1903
|
+
width: 100%;
|
|
1904
|
+
padding: var(--dt-space-600);
|
|
1905
|
+
}
|
|
1906
|
+
.d-empty-state--size-lg h1 {
|
|
1907
|
+
font: var(--dt-typography-headline-xxl);
|
|
1908
|
+
}
|
|
1909
|
+
.d-empty-state--size-lg p {
|
|
1910
|
+
font: var(--dt-typography-body-md);
|
|
1911
|
+
}
|
|
1874
1912
|
fieldset {
|
|
1875
1913
|
min-width: 0;
|
|
1876
1914
|
margin: 0;
|
|
@@ -2475,6 +2513,31 @@ legend .d-label {
|
|
|
2475
2513
|
.d-link--inverted-disabled:hover {
|
|
2476
2514
|
cursor: not-allowed;
|
|
2477
2515
|
}
|
|
2516
|
+
.d-link--inverted-danger {
|
|
2517
|
+
--link-color-default: var(--dt-color-link-critical-inverted);
|
|
2518
|
+
--link-color-default-hover: var(--dt-color-link-critical-inverted-hover);
|
|
2519
|
+
}
|
|
2520
|
+
.d-link--inverted-success {
|
|
2521
|
+
--link-color-default: var(--dt-color-link-success-inverted);
|
|
2522
|
+
--link-color-default-hover: var(--dt-color-link-success-inverted-hover);
|
|
2523
|
+
}
|
|
2524
|
+
.d-link--inverted-warning {
|
|
2525
|
+
--link-color-default: var(--dt-color-link-warning-inverted);
|
|
2526
|
+
--link-color-default-hover: var(--dt-color-link-warning-inverted-hover);
|
|
2527
|
+
}
|
|
2528
|
+
.d-link--inverted-muted {
|
|
2529
|
+
--link-color-default: var(--dt-color-link-muted-inverted);
|
|
2530
|
+
--link-color-default-hover: var(--dt-color-link-muted-inverted-hover);
|
|
2531
|
+
}
|
|
2532
|
+
.d-link--inverted-mention {
|
|
2533
|
+
--link-color-default: var(--dt-color-link-primary-inverted);
|
|
2534
|
+
--link-color-default-hover: var(--dt-color-link-primary-inverted-hover);
|
|
2535
|
+
--link-text-decoration: none;
|
|
2536
|
+
--link-padding: 0 var(--dt-space-200);
|
|
2537
|
+
--link-background-color: hsl(var(--dt-color-purple-400-hsl) / 0.2);
|
|
2538
|
+
line-height: var(--dt-font-line-height-200);
|
|
2539
|
+
border-radius: var(--dt-size-radius-200);
|
|
2540
|
+
}
|
|
2478
2541
|
.d-link--mention {
|
|
2479
2542
|
--link-text-decoration: none;
|
|
2480
2543
|
--link-padding: 0 var(--dt-space-200);
|
|
@@ -3836,6 +3899,11 @@ legend .d-label {
|
|
|
3836
3899
|
background-color: var(--tooltip-color-background);
|
|
3837
3900
|
border-radius: var(--tooltip-border-radius);
|
|
3838
3901
|
}
|
|
3902
|
+
.d-tooltip::after {
|
|
3903
|
+
position: absolute;
|
|
3904
|
+
border: var(--dt-size-350) solid transparent;
|
|
3905
|
+
content: '';
|
|
3906
|
+
}
|
|
3839
3907
|
.d-tooltip--inverted {
|
|
3840
3908
|
--tooltip-color-background: var(--dt-color-surface-moderate);
|
|
3841
3909
|
--tooltip-color-text: var(--dt-color-foreground-secondary);
|
|
@@ -3859,6 +3927,148 @@ legend .d-label {
|
|
|
3859
3927
|
transition: visibility 0s 0s, transform 200ms var(--ttf-in-out) 10ms, opacity 200ms var(--ttf-in-out) 10ms;
|
|
3860
3928
|
transition: visibility 0s 0s, transform 200ms var(--ttf-in-out) 10ms, opacity 200ms var(--ttf-in-out) 10ms, -webkit-transform 200ms var(--ttf-in-out) 10ms;
|
|
3861
3929
|
}
|
|
3930
|
+
.d-tooltip__arrow-tippy--bottom-start,
|
|
3931
|
+
.d-tooltip__arrow-tippy--bottom,
|
|
3932
|
+
.d-tooltip__arrow-tippy--bottom-end,
|
|
3933
|
+
.d-tooltip__arrow--top-left,
|
|
3934
|
+
.d-tooltip__arrow--top-center,
|
|
3935
|
+
.d-tooltip__arrow--top-right {
|
|
3936
|
+
top: calc(100% + var(--dt-space-450));
|
|
3937
|
+
-webkit-transform: translateY(var(--dt-space-500));
|
|
3938
|
+
transform: translateY(var(--dt-space-500));
|
|
3939
|
+
}
|
|
3940
|
+
.d-tooltip__arrow-tippy--bottom-start::after,
|
|
3941
|
+
.d-tooltip__arrow-tippy--bottom::after,
|
|
3942
|
+
.d-tooltip__arrow-tippy--bottom-end::after,
|
|
3943
|
+
.d-tooltip__arrow--top-left::after,
|
|
3944
|
+
.d-tooltip__arrow--top-center::after,
|
|
3945
|
+
.d-tooltip__arrow--top-right::after {
|
|
3946
|
+
top: calc(var(--dt-space-350-negative) - var(--dt-space-50-negative));
|
|
3947
|
+
border-top-width: 0;
|
|
3948
|
+
border-bottom-color: var(--tooltip-color-background);
|
|
3949
|
+
}
|
|
3950
|
+
.d-tooltip__arrow-tippy--top-start,
|
|
3951
|
+
.d-tooltip__arrow-tippy--top,
|
|
3952
|
+
.d-tooltip__arrow-tippy--top-end,
|
|
3953
|
+
.d-tooltip__arrow--bottom-left,
|
|
3954
|
+
.d-tooltip__arrow--bottom-center,
|
|
3955
|
+
.d-tooltip__arrow--bottom-right {
|
|
3956
|
+
bottom: calc(100% + var(--dt-space-450));
|
|
3957
|
+
-webkit-transform: translateY(var(--dt-space-500-negative));
|
|
3958
|
+
transform: translateY(var(--dt-space-500-negative));
|
|
3959
|
+
}
|
|
3960
|
+
.d-tooltip__arrow-tippy--top-start::after,
|
|
3961
|
+
.d-tooltip__arrow-tippy--top::after,
|
|
3962
|
+
.d-tooltip__arrow-tippy--top-end::after,
|
|
3963
|
+
.d-tooltip__arrow--bottom-left::after,
|
|
3964
|
+
.d-tooltip__arrow--bottom-center::after,
|
|
3965
|
+
.d-tooltip__arrow--bottom-right::after {
|
|
3966
|
+
bottom: calc(var(--dt-space-350-negative) - var(--dt-space-50-negative));
|
|
3967
|
+
border-top-color: var(--tooltip-color-background);
|
|
3968
|
+
border-bottom-width: 0;
|
|
3969
|
+
}
|
|
3970
|
+
.d-tooltip__arrow-tippy--bottom-start,
|
|
3971
|
+
.d-tooltip__arrow-tippy--top-start,
|
|
3972
|
+
.d-tooltip__arrow--top-left,
|
|
3973
|
+
.d-tooltip__arrow--bottom-left {
|
|
3974
|
+
left: var(--dt-space-200-negative);
|
|
3975
|
+
}
|
|
3976
|
+
.d-tooltip__arrow-tippy--bottom-start::after,
|
|
3977
|
+
.d-tooltip__arrow-tippy--top-start::after,
|
|
3978
|
+
.d-tooltip__arrow--top-left::after,
|
|
3979
|
+
.d-tooltip__arrow--bottom-left::after {
|
|
3980
|
+
left: var(--dt-space-500);
|
|
3981
|
+
}
|
|
3982
|
+
.d-tooltip__arrow-tippy--bottom::after,
|
|
3983
|
+
.d-tooltip__arrow-tippy--top::after,
|
|
3984
|
+
.d-tooltip__arrow--top-center::after,
|
|
3985
|
+
.d-tooltip__arrow--bottom-center::after {
|
|
3986
|
+
left: 50%;
|
|
3987
|
+
margin-left: var(--dt-space-350-negative);
|
|
3988
|
+
}
|
|
3989
|
+
.d-tooltip__arrow-tippy--bottom-end,
|
|
3990
|
+
.d-tooltip__arrow-tippy--top-end,
|
|
3991
|
+
.d-tooltip__arrow--top-right,
|
|
3992
|
+
.d-tooltip__arrow--bottom-right {
|
|
3993
|
+
right: var(--dt-space-200-negative);
|
|
3994
|
+
}
|
|
3995
|
+
.d-tooltip__arrow-tippy--bottom-end::after,
|
|
3996
|
+
.d-tooltip__arrow-tippy--top-end::after,
|
|
3997
|
+
.d-tooltip__arrow--top-right::after,
|
|
3998
|
+
.d-tooltip__arrow--bottom-right::after {
|
|
3999
|
+
right: var(--dt-space-500);
|
|
4000
|
+
}
|
|
4001
|
+
.d-tooltip__arrow-tippy--left-start,
|
|
4002
|
+
.d-tooltip__arrow-tippy--left,
|
|
4003
|
+
.d-tooltip__arrow-tippy--left-end,
|
|
4004
|
+
.d-tooltip__arrow--right-top,
|
|
4005
|
+
.d-tooltip__arrow--right-center,
|
|
4006
|
+
.d-tooltip__arrow--right-bottom {
|
|
4007
|
+
right: calc(100% + var(--dt-space-450));
|
|
4008
|
+
-webkit-transform: translateX(var(--dt-space-500-negative));
|
|
4009
|
+
transform: translateX(var(--dt-space-500-negative));
|
|
4010
|
+
}
|
|
4011
|
+
.d-tooltip__arrow-tippy--left-start::after,
|
|
4012
|
+
.d-tooltip__arrow-tippy--left::after,
|
|
4013
|
+
.d-tooltip__arrow-tippy--left-end::after,
|
|
4014
|
+
.d-tooltip__arrow--right-top::after,
|
|
4015
|
+
.d-tooltip__arrow--right-center::after,
|
|
4016
|
+
.d-tooltip__arrow--right-bottom::after {
|
|
4017
|
+
right: calc(var(--dt-space-350-negative) - var(--dt-space-50-negative));
|
|
4018
|
+
border-right-width: 0;
|
|
4019
|
+
border-left-color: var(--tooltip-color-background);
|
|
4020
|
+
}
|
|
4021
|
+
.d-tooltip__arrow-tippy--right-start,
|
|
4022
|
+
.d-tooltip__arrow-tippy--right,
|
|
4023
|
+
.d-tooltip__arrow-tippy--right-end,
|
|
4024
|
+
.d-tooltip__arrow--left-top,
|
|
4025
|
+
.d-tooltip__arrow--left-center,
|
|
4026
|
+
.d-tooltip__arrow--left-bottom {
|
|
4027
|
+
left: calc(100% + var(--dt-space-450));
|
|
4028
|
+
-webkit-transform: translateX(var(--dt-space-500));
|
|
4029
|
+
transform: translateX(var(--dt-space-500));
|
|
4030
|
+
}
|
|
4031
|
+
.d-tooltip__arrow-tippy--right-start::after,
|
|
4032
|
+
.d-tooltip__arrow-tippy--right::after,
|
|
4033
|
+
.d-tooltip__arrow-tippy--right-end::after,
|
|
4034
|
+
.d-tooltip__arrow--left-top::after,
|
|
4035
|
+
.d-tooltip__arrow--left-center::after,
|
|
4036
|
+
.d-tooltip__arrow--left-bottom::after {
|
|
4037
|
+
left: calc(var(--dt-space-350-negative) - var(--dt-space-50-negative));
|
|
4038
|
+
border-right-color: var(--tooltip-color-background);
|
|
4039
|
+
border-left-width: 0;
|
|
4040
|
+
}
|
|
4041
|
+
.d-tooltip__arrow-tippy--right-start,
|
|
4042
|
+
.d-tooltip__arrow-tippy--left-start,
|
|
4043
|
+
.d-tooltip__arrow--right-top,
|
|
4044
|
+
.d-tooltip__arrow--left-top {
|
|
4045
|
+
top: var(--dt-space-100-negative);
|
|
4046
|
+
}
|
|
4047
|
+
.d-tooltip__arrow-tippy--right-start::after,
|
|
4048
|
+
.d-tooltip__arrow-tippy--left-start::after,
|
|
4049
|
+
.d-tooltip__arrow--right-top::after,
|
|
4050
|
+
.d-tooltip__arrow--left-top::after {
|
|
4051
|
+
top: var(--dt-space-400);
|
|
4052
|
+
}
|
|
4053
|
+
.d-tooltip__arrow-tippy--right::after,
|
|
4054
|
+
.d-tooltip__arrow-tippy--left::after,
|
|
4055
|
+
.d-tooltip__arrow--right-center::after,
|
|
4056
|
+
.d-tooltip__arrow--left-center::after {
|
|
4057
|
+
top: 50%;
|
|
4058
|
+
margin-top: var(--dt-space-350-negative);
|
|
4059
|
+
}
|
|
4060
|
+
.d-tooltip__arrow-tippy--right-end,
|
|
4061
|
+
.d-tooltip__arrow-tippy--left-end,
|
|
4062
|
+
.d-tooltip__arrow--right-bottom,
|
|
4063
|
+
.d-tooltip__arrow--left-bottom {
|
|
4064
|
+
bottom: var(--dt-space-100-negative);
|
|
4065
|
+
}
|
|
4066
|
+
.d-tooltip__arrow-tippy--right-end::after,
|
|
4067
|
+
.d-tooltip__arrow-tippy--left-end::after,
|
|
4068
|
+
.d-tooltip__arrow--right-bottom::after,
|
|
4069
|
+
.d-tooltip__arrow--left-bottom::after {
|
|
4070
|
+
bottom: var(--dt-space-400);
|
|
4071
|
+
}
|
|
3862
4072
|
.d-toggle {
|
|
3863
4073
|
--toggle-transition-timing-function: var(--ttf-out-quint);
|
|
3864
4074
|
--toggle-transition-speed: var(--td300);
|
|
@@ -7338,7 +7548,7 @@ body {
|
|
|
7338
7548
|
}
|
|
7339
7549
|
/**
|
|
7340
7550
|
* Do not edit directly
|
|
7341
|
-
* Generated on Thu,
|
|
7551
|
+
* Generated on Thu, 23 May 2024 21:34:38 GMT
|
|
7342
7552
|
*/
|
|
7343
7553
|
|
|
7344
7554
|
.dialtone-theme-light {
|
|
@@ -8155,7 +8365,7 @@ body {
|
|
|
8155
8365
|
|
|
8156
8366
|
/**
|
|
8157
8367
|
* Do not edit directly
|
|
8158
|
-
* Generated on Thu,
|
|
8368
|
+
* Generated on Thu, 23 May 2024 21:34:38 GMT
|
|
8159
8369
|
*/
|
|
8160
8370
|
|
|
8161
8371
|
.dialtone-theme-dark {
|