@dialpad/dialtone 6.34.1 → 6.36.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/card.less +70 -0
- package/lib/build/less/components/modal.less +1 -0
- package/lib/build/less/dialtone.less +1 -0
- package/lib/build/less/themes/default.less +55 -16
- package/lib/build/less/utilities/colors.less +2 -0
- package/lib/build/svg/system/wifi-off.svg +3 -0
- package/lib/dist/css/dialtone.css +356 -4
- package/lib/dist/css/dialtone.min.css +1 -1
- package/lib/dist/svg/system/wifi-off.svg +1 -0
- package/lib/dist/vue/icons/IconWifiOff.vue +3 -0
- package/package.json +1 -1
|
@@ -0,0 +1,70 @@
|
|
|
1
|
+
//@import (reference) '../utilities/spacing.less';
|
|
2
|
+
|
|
3
|
+
//
|
|
4
|
+
// DIALTONE
|
|
5
|
+
// COMPONENTS: CARD
|
|
6
|
+
//
|
|
7
|
+
// These are card classes for Dialpad's design system Dialtone.
|
|
8
|
+
// For further documentation of these and other classes,
|
|
9
|
+
// visit https://dialpad.design/components/card
|
|
10
|
+
//
|
|
11
|
+
// TABLE OF CONTENTS
|
|
12
|
+
// • BASE STYLE
|
|
13
|
+
// • HEADER
|
|
14
|
+
// • CONTENT
|
|
15
|
+
// • FOOTER
|
|
16
|
+
//
|
|
17
|
+
// ============================================================================
|
|
18
|
+
// $ BASE STYLE
|
|
19
|
+
// ============================================================================
|
|
20
|
+
// $$ WRAPPER
|
|
21
|
+
// ----------------------------------------------------------------------------
|
|
22
|
+
.d-card {
|
|
23
|
+
display: flex;
|
|
24
|
+
flex-direction: column;
|
|
25
|
+
align-items: flex-start;
|
|
26
|
+
justify-content: flex-start;
|
|
27
|
+
// Component CSS Vars
|
|
28
|
+
// ------------------------------------------------------------------------
|
|
29
|
+
width: 100%;
|
|
30
|
+
max-width: var(--size264);
|
|
31
|
+
max-height: 100%;
|
|
32
|
+
background: var(--white);
|
|
33
|
+
border-radius: var(--su4);
|
|
34
|
+
box-shadow: var(--bs-card);
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
|
|
38
|
+
// ============================================================================
|
|
39
|
+
// $ CARD AREAS
|
|
40
|
+
// ----------------------------------------------------------------------------
|
|
41
|
+
// $$ HEADER
|
|
42
|
+
// ----------------------------------------------------------------------------
|
|
43
|
+
.d-card__header {
|
|
44
|
+
display: flex;
|
|
45
|
+
flex-direction: row;
|
|
46
|
+
align-items: center;
|
|
47
|
+
justify-content: space-between;
|
|
48
|
+
width: 100%;
|
|
49
|
+
padding: var(--su8) var(--su8) 0 var(--su16);
|
|
50
|
+
color: var(--black-400);
|
|
51
|
+
font-weight: var(--fw-semibold);
|
|
52
|
+
font-size: var(--fs16);
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
// $$ CONTENT
|
|
56
|
+
// ----------------------------------------------------------------------------
|
|
57
|
+
.d-card__content {
|
|
58
|
+
max-width: 100%;
|
|
59
|
+
padding: var(--su16);
|
|
60
|
+
overflow-y: auto;
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
// $$ FOOTER
|
|
64
|
+
// ----------------------------------------------------------------------------
|
|
65
|
+
.d-card__footer {
|
|
66
|
+
display: flex;
|
|
67
|
+
flex-direction: row-reverse;
|
|
68
|
+
align-items: center;
|
|
69
|
+
padding: var(--su8);
|
|
70
|
+
}
|
|
@@ -34,26 +34,65 @@
|
|
|
34
34
|
|
|
35
35
|
|
|
36
36
|
@theme-vars: {
|
|
37
|
-
primary-color-h:
|
|
38
|
-
primary-color-s:
|
|
39
|
-
primary-color-l:
|
|
40
|
-
primary-color-hsl:
|
|
41
|
-
primary-color:
|
|
42
|
-
primary-color-hover:
|
|
43
|
-
nav-background-color-h: var(--purple-800-h);
|
|
44
|
-
nav-background-color-s: var(--purple-800-s);
|
|
45
|
-
nav-background-color-l: var(--purple-800-l);
|
|
46
|
-
nav-background-color: hsl(var(--nav-background-color-h) var(--nav-background-color-s) var(--nav-background-color-l));
|
|
37
|
+
primary-color-h: var(--purple-500-h);
|
|
38
|
+
primary-color-s: var(--purple-500-s);
|
|
39
|
+
primary-color-l: var(--purple-500-l);
|
|
40
|
+
primary-color-hsl: var(--primary-color-h) var(--primary-color-s) var(--primary-color-l);
|
|
41
|
+
primary-color: hsl(var(--primary-color-h) var(--primary-color-s) var(--primary-color-l));
|
|
42
|
+
primary-color-hover: hsl(var(--primary-color-h) var(--primary-color-s) calc(var(--primary-color-l) - 10%));
|
|
47
43
|
|
|
48
|
-
topbar-height:
|
|
44
|
+
topbar-height: var(--su64);
|
|
49
45
|
|
|
50
|
-
base--font-size:
|
|
51
|
-
base--font-family:
|
|
52
|
-
base--font-feature-settings:
|
|
53
|
-
base--line-height:
|
|
54
|
-
base--corner-radius:
|
|
46
|
+
base--font-size: var(--fs16);
|
|
47
|
+
base--font-family: @ff-custom;
|
|
48
|
+
base--font-feature-settings: 'calt' 0;
|
|
49
|
+
base--line-height: var(--lh-normal);
|
|
50
|
+
base--corner-radius: 0.25em;
|
|
51
|
+
|
|
52
|
+
theme-topbar-color: hsl(var(--theme-topbar-color-hsl));
|
|
53
|
+
theme-topbar-color-hsl: var(--black-900-h) var(--black-900-s) var(--black-900-l); // Use with d-fco[##] Opacity utility
|
|
54
|
+
theme-topbar-color-background: #f9f9f9; // DT7 TBD, possibly black-100?
|
|
55
|
+
|
|
56
|
+
theme-sidebar-color: hsl(var(--theme-sidebar-color-hsl));
|
|
57
|
+
theme-sidebar-color-hsl: var(--black-900-h) var(--black-900-s) var(--black-900-l); // Use with d-fco[##] Opacity utility
|
|
58
|
+
theme-sidebar-color-background: #f9f9f9; // DT7 TBD, possibly black-100?
|
|
59
|
+
|
|
60
|
+
// theme-sidebar-row-color-background: {UNUSED}
|
|
61
|
+
theme-sidebar-row-color-background-hover: var(--purple-100);
|
|
62
|
+
theme-sidebar-active-row-color: hsl(var(--theme-sidebar-active-row-color-hsl));
|
|
63
|
+
theme-sidebar-active-row-color-hsl: var(--black-900-h) var(--black-900-s) var(--black-900-l); // Use with d-fco[##] Opacity utility
|
|
64
|
+
theme-sidebar-active-row-color-background: #e9e9e9; // DT7 TBD, possibly black-100?
|
|
65
|
+
|
|
66
|
+
theme-presence-color-background-available: var(--green-500);
|
|
67
|
+
theme-presence-color-background-busy-unavailable: var(--red-500);
|
|
68
|
+
theme-presence-color-background-busy: var(--yellow-500);
|
|
69
|
+
|
|
70
|
+
theme-mention-color-background: var(--purple-500);
|
|
55
71
|
}
|
|
56
72
|
|
|
73
|
+
// ============================================================================
|
|
74
|
+
// $ THEME CLASSES
|
|
75
|
+
// ============================================================================
|
|
76
|
+
|
|
77
|
+
.d-theme-topbar-fc {
|
|
78
|
+
--fco: 75%;
|
|
79
|
+
|
|
80
|
+
color: hsla(var(--theme-topbar-color-hsl) / var(--fco)) !important;
|
|
81
|
+
|
|
82
|
+
&:hover {
|
|
83
|
+
--fco: 100%;
|
|
84
|
+
}
|
|
85
|
+
}
|
|
86
|
+
.d-theme-topbar-bgc { background-color: var(--theme-topbar-color-background) !important; }
|
|
87
|
+
.d-theme-sidebar-fc { color: hsla(var(--theme-sidebar-color-hsl) / var(--fco)) !important; }
|
|
88
|
+
.d-theme-sidebar-bgc { background-color: var(--theme-sidebar-color-background) !important; }
|
|
89
|
+
.d-theme-sidebar-row-bgc:hover { background-color: var(--theme-sidebar-row-color-background-hover) !important; }
|
|
90
|
+
.d-theme-sidebar-row-active-fc { color: hsla(var(--theme-sidebar-active-row-color-hsl) / var(--fco)) !important; }
|
|
91
|
+
.d-theme-sidebar-row-active-bgc { background-color: var(--theme-sidebar-active-row-color-background) !important; }
|
|
92
|
+
.d-theme-presence-available { background-color: var(--theme-presence-color-background-available) !important; }
|
|
93
|
+
.d-theme-presence-busy-unavailable { background-color: var(--theme-presence-color-background-busy-unavailable) !important; }
|
|
94
|
+
.d-theme-presence-busy { background-color: var(--theme-presence-color-background-busy) !important; }
|
|
95
|
+
.d-theme-mention { background-color: var(--theme-mention-color-background) !important; }
|
|
57
96
|
|
|
58
97
|
// ============================================================================
|
|
59
98
|
// $ OUTPUT VARIABLES
|
|
@@ -121,9 +121,11 @@
|
|
|
121
121
|
|
|
122
122
|
// $ OPACITY CLASSES
|
|
123
123
|
// ----------------------------------------------------------------------------
|
|
124
|
+
#d-internals #opacity-classes(100);
|
|
124
125
|
#d-internals #opacity-classes(99);
|
|
125
126
|
#d-internals #opacity-classes(95);
|
|
126
127
|
#d-internals #opacity-classes(90);
|
|
128
|
+
#d-internals #opacity-classes(85);
|
|
127
129
|
#d-internals #opacity-classes(75);
|
|
128
130
|
#d-internals #opacity-classes(50);
|
|
129
131
|
#d-internals #opacity-classes(25);
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
2
|
+
<path d="M22.325 10.95C20.8583 9.56665 19.2667 8.46249 17.55 7.63749C15.8333 6.81249 13.9833 6.39999 12 6.39999C11.4167 6.39999 10.8625 6.43332 10.3375 6.49999C9.8125 6.56665 9.375 6.66665 9.025 6.79999L7.05 4.82499C7.78333 4.55832 8.56667 4.35415 9.4 4.21249C10.2333 4.07082 11.1 3.99999 12 3.99999C14.3333 3.99999 16.5292 4.48332 18.5875 5.44999C20.6458 6.41665 22.45 7.69165 24 9.27499L22.325 10.95ZM18.25 15.025C17.7 14.4917 17.2 14.0625 16.75 13.7375C16.3 13.4125 15.7333 13.1 15.05 12.8L12.275 10.025C13.8417 10.075 15.2167 10.4042 16.4 11.0125C17.5833 11.6208 18.7083 12.45 19.775 13.5L18.25 15.025ZM20.075 22.325L10.3 12.55C9.4 12.7833 8.58333 13.1375 7.85 13.6125C7.11667 14.0875 6.46667 14.6083 5.9 15.175L4.225 13.5C4.84167 12.8833 5.47083 12.3458 6.1125 11.8875C6.75417 11.4292 7.525 11.0167 8.425 10.65L5.75 7.97499C4.98333 8.37499 4.25833 8.82915 3.575 9.33749C2.89167 9.84582 2.25833 10.3833 1.675 10.95L0 9.27499C0.583333 8.67499 1.21667 8.10832 1.9 7.57499C2.58333 7.04165 3.275 6.58332 3.975 6.19999L1.675 3.92499L2.8 2.79999L21.2 21.2L20.075 22.325ZM12 21.275L8.3 17.55C8.78333 17.0667 9.3375 16.6875 9.9625 16.4125C10.5875 16.1375 11.2667 16 12 16C12.7333 16 13.4125 16.1375 14.0375 16.4125C14.6625 16.6875 15.2167 17.0667 15.7 17.55L12 21.275Z" fill="#0D0C0F"/>
|
|
3
|
+
</svg>
|
|
@@ -1057,6 +1057,40 @@ body {
|
|
|
1057
1057
|
.d-btn-group.d-btn-group--space-between {
|
|
1058
1058
|
justify-content: space-between;
|
|
1059
1059
|
}
|
|
1060
|
+
.d-card {
|
|
1061
|
+
display: flex;
|
|
1062
|
+
flex-direction: column;
|
|
1063
|
+
align-items: flex-start;
|
|
1064
|
+
justify-content: flex-start;
|
|
1065
|
+
width: 100%;
|
|
1066
|
+
max-width: var(--size264);
|
|
1067
|
+
max-height: 100%;
|
|
1068
|
+
background: var(--white);
|
|
1069
|
+
border-radius: var(--su4);
|
|
1070
|
+
box-shadow: var(--bs-card);
|
|
1071
|
+
}
|
|
1072
|
+
.d-card__header {
|
|
1073
|
+
display: flex;
|
|
1074
|
+
flex-direction: row;
|
|
1075
|
+
align-items: center;
|
|
1076
|
+
justify-content: space-between;
|
|
1077
|
+
width: 100%;
|
|
1078
|
+
padding: var(--su8) var(--su8) 0 var(--su16);
|
|
1079
|
+
color: var(--black-400);
|
|
1080
|
+
font-weight: var(--fw-semibold);
|
|
1081
|
+
font-size: var(--fs16);
|
|
1082
|
+
}
|
|
1083
|
+
.d-card__content {
|
|
1084
|
+
max-width: 100%;
|
|
1085
|
+
padding: var(--su16);
|
|
1086
|
+
overflow-y: auto;
|
|
1087
|
+
}
|
|
1088
|
+
.d-card__footer {
|
|
1089
|
+
display: flex;
|
|
1090
|
+
flex-direction: row-reverse;
|
|
1091
|
+
align-items: center;
|
|
1092
|
+
padding: var(--su8);
|
|
1093
|
+
}
|
|
1060
1094
|
.d-chip {
|
|
1061
1095
|
position: relative;
|
|
1062
1096
|
display: inline-flex;
|
|
@@ -1987,6 +2021,7 @@ legend .d-label {
|
|
|
1987
2021
|
}
|
|
1988
2022
|
.d-modal__banner {
|
|
1989
2023
|
position: relative;
|
|
2024
|
+
box-sizing: border-box;
|
|
1990
2025
|
width: 100%;
|
|
1991
2026
|
max-width: var(--size628);
|
|
1992
2027
|
padding: var(--su12) var(--su24);
|
|
@@ -13178,6 +13213,127 @@ body.theme-dark .d\:d-bgc-red-700 {
|
|
|
13178
13213
|
.fv\:d-bc-unset:focus-visible {
|
|
13179
13214
|
border-color: unset !important;
|
|
13180
13215
|
}
|
|
13216
|
+
.d-fco100,
|
|
13217
|
+
.h\:d-fco100:hover,
|
|
13218
|
+
.f\:d-fco100:focus {
|
|
13219
|
+
--fco: 100% !important;
|
|
13220
|
+
}
|
|
13221
|
+
.f\:d-fco100:focus-within {
|
|
13222
|
+
--fco: 100% !important;
|
|
13223
|
+
}
|
|
13224
|
+
.fv\:d-fco100.focus-visible {
|
|
13225
|
+
--fco: 100% !important;
|
|
13226
|
+
}
|
|
13227
|
+
.fv\:d-fco100:focus-visible {
|
|
13228
|
+
--fco: 100% !important;
|
|
13229
|
+
}
|
|
13230
|
+
@media (prefers-color-scheme: dark) {
|
|
13231
|
+
body.theme-system .d\:d-fco100 {
|
|
13232
|
+
--fco: 100% !important;
|
|
13233
|
+
}
|
|
13234
|
+
}
|
|
13235
|
+
body.theme-dark .d\:d-fco100 {
|
|
13236
|
+
--fco: 100% !important;
|
|
13237
|
+
}
|
|
13238
|
+
.d-bco100,
|
|
13239
|
+
.h\:d-bco100:hover,
|
|
13240
|
+
.f\:d-bco100:focus {
|
|
13241
|
+
--bco: 100% !important;
|
|
13242
|
+
}
|
|
13243
|
+
.f\:d-bco100:focus-within {
|
|
13244
|
+
--bco: 100% !important;
|
|
13245
|
+
}
|
|
13246
|
+
.fv\:d-bco100.focus-visible {
|
|
13247
|
+
--bco: 100% !important;
|
|
13248
|
+
}
|
|
13249
|
+
.fv\:d-bco100:focus-visible {
|
|
13250
|
+
--bco: 100% !important;
|
|
13251
|
+
}
|
|
13252
|
+
@media (prefers-color-scheme: dark) {
|
|
13253
|
+
body.theme-system .d\:d-bco100 {
|
|
13254
|
+
--bco: 100% !important;
|
|
13255
|
+
}
|
|
13256
|
+
}
|
|
13257
|
+
body.theme-dark .d\:d-bco100 {
|
|
13258
|
+
--bco: 100% !important;
|
|
13259
|
+
}
|
|
13260
|
+
.d-dco100 > * + * {
|
|
13261
|
+
--dco: 100% !important;
|
|
13262
|
+
}
|
|
13263
|
+
@media (prefers-color-scheme: dark) {
|
|
13264
|
+
body.theme-system .d\:d-dco100 > * + * {
|
|
13265
|
+
--dco: 100% !important;
|
|
13266
|
+
}
|
|
13267
|
+
}
|
|
13268
|
+
body.theme-dark .d\:d-dco100 > * + * {
|
|
13269
|
+
--dco: 100% !important;
|
|
13270
|
+
}
|
|
13271
|
+
.d-bgo100,
|
|
13272
|
+
.h\:d-bgo100:hover,
|
|
13273
|
+
.f\:d-bgo100:focus {
|
|
13274
|
+
--bgo: 100% !important;
|
|
13275
|
+
}
|
|
13276
|
+
.f\:d-bgo100:focus-within {
|
|
13277
|
+
--bgo: 100% !important;
|
|
13278
|
+
}
|
|
13279
|
+
.fv\:d-bgo100.focus-visible {
|
|
13280
|
+
--bgo: 100% !important;
|
|
13281
|
+
}
|
|
13282
|
+
.fv\:d-bgo100:focus-visible {
|
|
13283
|
+
--bgo: 100% !important;
|
|
13284
|
+
}
|
|
13285
|
+
@media (prefers-color-scheme: dark) {
|
|
13286
|
+
body.theme-system .d\:d-bgo100 {
|
|
13287
|
+
--bgo: 100% !important;
|
|
13288
|
+
}
|
|
13289
|
+
}
|
|
13290
|
+
body.theme-dark .d\:d-bgo100 {
|
|
13291
|
+
--bgo: 100% !important;
|
|
13292
|
+
}
|
|
13293
|
+
.d-bgg-from-o100,
|
|
13294
|
+
.h\:d-bgg-from-100:hover,
|
|
13295
|
+
.f\:d-bgg-from-100:focus {
|
|
13296
|
+
--bgg-from-opacity: 100% !important;
|
|
13297
|
+
}
|
|
13298
|
+
.f\:d-bgg-from-100:focus-within {
|
|
13299
|
+
--bgg-from-opacity: 100% !important;
|
|
13300
|
+
}
|
|
13301
|
+
.fv\:d-bgg-from-100.focus-visible {
|
|
13302
|
+
--bgg-from-opacity: 100% !important;
|
|
13303
|
+
}
|
|
13304
|
+
.fv\:d-bgg-from-100:focus-visible {
|
|
13305
|
+
--bgg-from-opacity: 100% !important;
|
|
13306
|
+
}
|
|
13307
|
+
@media (prefers-color-scheme: dark) {
|
|
13308
|
+
body.theme-system .d\:d-bgg-from-100 {
|
|
13309
|
+
--bgg-from-opacity: 100% !important;
|
|
13310
|
+
}
|
|
13311
|
+
}
|
|
13312
|
+
body.theme-dark .d\:d-bgg-from-100 {
|
|
13313
|
+
--bgg-from-opacity: 100% !important;
|
|
13314
|
+
}
|
|
13315
|
+
.d-bgg-to-o100,
|
|
13316
|
+
.h\:d-bgg-to-100:hover,
|
|
13317
|
+
.f\:d-bgg-to-100:focus {
|
|
13318
|
+
--bgg-to-opacity: 100% !important;
|
|
13319
|
+
}
|
|
13320
|
+
.f\:d-bgg-to-100:focus-within {
|
|
13321
|
+
--bgg-to-opacity: 100% !important;
|
|
13322
|
+
}
|
|
13323
|
+
.fv\:d-bgg-to-100.focus-visible {
|
|
13324
|
+
--bgg-to-opacity: 100% !important;
|
|
13325
|
+
}
|
|
13326
|
+
.fv\:d-bgg-to-100:focus-visible {
|
|
13327
|
+
--bgg-to-opacity: 100% !important;
|
|
13328
|
+
}
|
|
13329
|
+
@media (prefers-color-scheme: dark) {
|
|
13330
|
+
body.theme-system .d\:d-bgg-to-100 {
|
|
13331
|
+
--bgg-to-opacity: 100% !important;
|
|
13332
|
+
}
|
|
13333
|
+
}
|
|
13334
|
+
body.theme-dark .d\:d-bgg-to-100 {
|
|
13335
|
+
--bgg-to-opacity: 100% !important;
|
|
13336
|
+
}
|
|
13181
13337
|
.d-fco99,
|
|
13182
13338
|
.h\:d-fco99:hover,
|
|
13183
13339
|
.f\:d-fco99:focus {
|
|
@@ -13541,6 +13697,127 @@ body.theme-dark .d\:d-bgg-from-90 {
|
|
|
13541
13697
|
body.theme-dark .d\:d-bgg-to-90 {
|
|
13542
13698
|
--bgg-to-opacity: 90% !important;
|
|
13543
13699
|
}
|
|
13700
|
+
.d-fco85,
|
|
13701
|
+
.h\:d-fco85:hover,
|
|
13702
|
+
.f\:d-fco85:focus {
|
|
13703
|
+
--fco: 85% !important;
|
|
13704
|
+
}
|
|
13705
|
+
.f\:d-fco85:focus-within {
|
|
13706
|
+
--fco: 85% !important;
|
|
13707
|
+
}
|
|
13708
|
+
.fv\:d-fco85.focus-visible {
|
|
13709
|
+
--fco: 85% !important;
|
|
13710
|
+
}
|
|
13711
|
+
.fv\:d-fco85:focus-visible {
|
|
13712
|
+
--fco: 85% !important;
|
|
13713
|
+
}
|
|
13714
|
+
@media (prefers-color-scheme: dark) {
|
|
13715
|
+
body.theme-system .d\:d-fco85 {
|
|
13716
|
+
--fco: 85% !important;
|
|
13717
|
+
}
|
|
13718
|
+
}
|
|
13719
|
+
body.theme-dark .d\:d-fco85 {
|
|
13720
|
+
--fco: 85% !important;
|
|
13721
|
+
}
|
|
13722
|
+
.d-bco85,
|
|
13723
|
+
.h\:d-bco85:hover,
|
|
13724
|
+
.f\:d-bco85:focus {
|
|
13725
|
+
--bco: 85% !important;
|
|
13726
|
+
}
|
|
13727
|
+
.f\:d-bco85:focus-within {
|
|
13728
|
+
--bco: 85% !important;
|
|
13729
|
+
}
|
|
13730
|
+
.fv\:d-bco85.focus-visible {
|
|
13731
|
+
--bco: 85% !important;
|
|
13732
|
+
}
|
|
13733
|
+
.fv\:d-bco85:focus-visible {
|
|
13734
|
+
--bco: 85% !important;
|
|
13735
|
+
}
|
|
13736
|
+
@media (prefers-color-scheme: dark) {
|
|
13737
|
+
body.theme-system .d\:d-bco85 {
|
|
13738
|
+
--bco: 85% !important;
|
|
13739
|
+
}
|
|
13740
|
+
}
|
|
13741
|
+
body.theme-dark .d\:d-bco85 {
|
|
13742
|
+
--bco: 85% !important;
|
|
13743
|
+
}
|
|
13744
|
+
.d-dco85 > * + * {
|
|
13745
|
+
--dco: 85% !important;
|
|
13746
|
+
}
|
|
13747
|
+
@media (prefers-color-scheme: dark) {
|
|
13748
|
+
body.theme-system .d\:d-dco85 > * + * {
|
|
13749
|
+
--dco: 85% !important;
|
|
13750
|
+
}
|
|
13751
|
+
}
|
|
13752
|
+
body.theme-dark .d\:d-dco85 > * + * {
|
|
13753
|
+
--dco: 85% !important;
|
|
13754
|
+
}
|
|
13755
|
+
.d-bgo85,
|
|
13756
|
+
.h\:d-bgo85:hover,
|
|
13757
|
+
.f\:d-bgo85:focus {
|
|
13758
|
+
--bgo: 85% !important;
|
|
13759
|
+
}
|
|
13760
|
+
.f\:d-bgo85:focus-within {
|
|
13761
|
+
--bgo: 85% !important;
|
|
13762
|
+
}
|
|
13763
|
+
.fv\:d-bgo85.focus-visible {
|
|
13764
|
+
--bgo: 85% !important;
|
|
13765
|
+
}
|
|
13766
|
+
.fv\:d-bgo85:focus-visible {
|
|
13767
|
+
--bgo: 85% !important;
|
|
13768
|
+
}
|
|
13769
|
+
@media (prefers-color-scheme: dark) {
|
|
13770
|
+
body.theme-system .d\:d-bgo85 {
|
|
13771
|
+
--bgo: 85% !important;
|
|
13772
|
+
}
|
|
13773
|
+
}
|
|
13774
|
+
body.theme-dark .d\:d-bgo85 {
|
|
13775
|
+
--bgo: 85% !important;
|
|
13776
|
+
}
|
|
13777
|
+
.d-bgg-from-o85,
|
|
13778
|
+
.h\:d-bgg-from-85:hover,
|
|
13779
|
+
.f\:d-bgg-from-85:focus {
|
|
13780
|
+
--bgg-from-opacity: 85% !important;
|
|
13781
|
+
}
|
|
13782
|
+
.f\:d-bgg-from-85:focus-within {
|
|
13783
|
+
--bgg-from-opacity: 85% !important;
|
|
13784
|
+
}
|
|
13785
|
+
.fv\:d-bgg-from-85.focus-visible {
|
|
13786
|
+
--bgg-from-opacity: 85% !important;
|
|
13787
|
+
}
|
|
13788
|
+
.fv\:d-bgg-from-85:focus-visible {
|
|
13789
|
+
--bgg-from-opacity: 85% !important;
|
|
13790
|
+
}
|
|
13791
|
+
@media (prefers-color-scheme: dark) {
|
|
13792
|
+
body.theme-system .d\:d-bgg-from-85 {
|
|
13793
|
+
--bgg-from-opacity: 85% !important;
|
|
13794
|
+
}
|
|
13795
|
+
}
|
|
13796
|
+
body.theme-dark .d\:d-bgg-from-85 {
|
|
13797
|
+
--bgg-from-opacity: 85% !important;
|
|
13798
|
+
}
|
|
13799
|
+
.d-bgg-to-o85,
|
|
13800
|
+
.h\:d-bgg-to-85:hover,
|
|
13801
|
+
.f\:d-bgg-to-85:focus {
|
|
13802
|
+
--bgg-to-opacity: 85% !important;
|
|
13803
|
+
}
|
|
13804
|
+
.f\:d-bgg-to-85:focus-within {
|
|
13805
|
+
--bgg-to-opacity: 85% !important;
|
|
13806
|
+
}
|
|
13807
|
+
.fv\:d-bgg-to-85.focus-visible {
|
|
13808
|
+
--bgg-to-opacity: 85% !important;
|
|
13809
|
+
}
|
|
13810
|
+
.fv\:d-bgg-to-85:focus-visible {
|
|
13811
|
+
--bgg-to-opacity: 85% !important;
|
|
13812
|
+
}
|
|
13813
|
+
@media (prefers-color-scheme: dark) {
|
|
13814
|
+
body.theme-system .d\:d-bgg-to-85 {
|
|
13815
|
+
--bgg-to-opacity: 85% !important;
|
|
13816
|
+
}
|
|
13817
|
+
}
|
|
13818
|
+
body.theme-dark .d\:d-bgg-to-85 {
|
|
13819
|
+
--bgg-to-opacity: 85% !important;
|
|
13820
|
+
}
|
|
13544
13821
|
.d-fco75,
|
|
13545
13822
|
.h\:d-fco75:hover,
|
|
13546
13823
|
.f\:d-fco75:focus {
|
|
@@ -19709,6 +19986,43 @@ body {
|
|
|
19709
19986
|
.js-focus-visible :focus:not(.focus-visible) {
|
|
19710
19987
|
outline: none;
|
|
19711
19988
|
}
|
|
19989
|
+
.d-theme-topbar-fc {
|
|
19990
|
+
--fco: 75%;
|
|
19991
|
+
color: hsla(var(--theme-topbar-color-hsl) / var(--fco)) !important;
|
|
19992
|
+
}
|
|
19993
|
+
.d-theme-topbar-fc:hover {
|
|
19994
|
+
--fco: 100%;
|
|
19995
|
+
}
|
|
19996
|
+
.d-theme-topbar-bgc {
|
|
19997
|
+
background-color: var(--theme-topbar-color-background) !important;
|
|
19998
|
+
}
|
|
19999
|
+
.d-theme-sidebar-fc {
|
|
20000
|
+
color: hsla(var(--theme-sidebar-color-hsl) / var(--fco)) !important;
|
|
20001
|
+
}
|
|
20002
|
+
.d-theme-sidebar-bgc {
|
|
20003
|
+
background-color: var(--theme-sidebar-color-background) !important;
|
|
20004
|
+
}
|
|
20005
|
+
.d-theme-sidebar-row-bgc:hover {
|
|
20006
|
+
background-color: var(--theme-sidebar-row-color-background-hover) !important;
|
|
20007
|
+
}
|
|
20008
|
+
.d-theme-sidebar-row-active-fc {
|
|
20009
|
+
color: hsla(var(--theme-sidebar-active-row-color-hsl) / var(--fco)) !important;
|
|
20010
|
+
}
|
|
20011
|
+
.d-theme-sidebar-row-active-bgc {
|
|
20012
|
+
background-color: var(--theme-sidebar-active-row-color-background) !important;
|
|
20013
|
+
}
|
|
20014
|
+
.d-theme-presence-available {
|
|
20015
|
+
background-color: var(--theme-presence-color-background-available) !important;
|
|
20016
|
+
}
|
|
20017
|
+
.d-theme-presence-busy-unavailable {
|
|
20018
|
+
background-color: var(--theme-presence-color-background-busy-unavailable) !important;
|
|
20019
|
+
}
|
|
20020
|
+
.d-theme-presence-busy {
|
|
20021
|
+
background-color: var(--theme-presence-color-background-busy) !important;
|
|
20022
|
+
}
|
|
20023
|
+
.d-theme-mention {
|
|
20024
|
+
background-color: var(--theme-mention-color-background) !important;
|
|
20025
|
+
}
|
|
19712
20026
|
body {
|
|
19713
20027
|
--bgo: 100%;
|
|
19714
20028
|
--bco: 100%;
|
|
@@ -20195,16 +20509,26 @@ body {
|
|
|
20195
20509
|
--primary-color-hsl: var(--primary-color-h) var(--primary-color-s) var(--primary-color-l);
|
|
20196
20510
|
--primary-color: hsl(var(--primary-color-h) var(--primary-color-s) var(--primary-color-l));
|
|
20197
20511
|
--primary-color-hover: hsl(var(--primary-color-h) var(--primary-color-s) calc(var(--primary-color-l) - 10%));
|
|
20198
|
-
--nav-background-color-h: var(--purple-800-h);
|
|
20199
|
-
--nav-background-color-s: var(--purple-800-s);
|
|
20200
|
-
--nav-background-color-l: var(--purple-800-l);
|
|
20201
|
-
--nav-background-color: hsl(var(--nav-background-color-h) var(--nav-background-color-s) var(--nav-background-color-l));
|
|
20202
20512
|
--topbar-height: var(--su64);
|
|
20203
20513
|
--base--font-size: var(--fs16);
|
|
20204
20514
|
--base--font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
|
|
20205
20515
|
--base--font-feature-settings: 'calt' 0;
|
|
20206
20516
|
--base--line-height: var(--lh-normal);
|
|
20207
20517
|
--base--corner-radius: 0.25em;
|
|
20518
|
+
--theme-topbar-color: hsl(var(--theme-topbar-color-hsl));
|
|
20519
|
+
--theme-topbar-color-hsl: var(--black-900-h) var(--black-900-s) var(--black-900-l);
|
|
20520
|
+
--theme-topbar-color-background: #f9f9f9;
|
|
20521
|
+
--theme-sidebar-color: hsl(var(--theme-sidebar-color-hsl));
|
|
20522
|
+
--theme-sidebar-color-hsl: var(--black-900-h) var(--black-900-s) var(--black-900-l);
|
|
20523
|
+
--theme-sidebar-color-background: #f9f9f9;
|
|
20524
|
+
--theme-sidebar-row-color-background-hover: var(--purple-100);
|
|
20525
|
+
--theme-sidebar-active-row-color: hsl(var(--theme-sidebar-active-row-color-hsl));
|
|
20526
|
+
--theme-sidebar-active-row-color-hsl: var(--black-900-h) var(--black-900-s) var(--black-900-l);
|
|
20527
|
+
--theme-sidebar-active-row-color-background: #e9e9e9;
|
|
20528
|
+
--theme-presence-color-background-available: var(--green-500);
|
|
20529
|
+
--theme-presence-color-background-busy-unavailable: var(--red-500);
|
|
20530
|
+
--theme-presence-color-background-busy: var(--yellow-500);
|
|
20531
|
+
--theme-mention-color-background: var(--purple-500);
|
|
20208
20532
|
}
|
|
20209
20533
|
body.theme-dark {
|
|
20210
20534
|
--white-h: 260;
|
|
@@ -20776,6 +21100,9 @@ body.theme-dark {
|
|
|
20776
21100
|
--dco: 100%;
|
|
20777
21101
|
border-color: hsla(var(--red-700-h) var(--red-700-s) var(--red-700-l) / var(--dco)) !important;
|
|
20778
21102
|
}
|
|
21103
|
+
.sm\:d-dco100 > * + * {
|
|
21104
|
+
--dco: 100% !important;
|
|
21105
|
+
}
|
|
20779
21106
|
.sm\:d-dco99 > * + * {
|
|
20780
21107
|
--dco: 99% !important;
|
|
20781
21108
|
}
|
|
@@ -20785,6 +21112,9 @@ body.theme-dark {
|
|
|
20785
21112
|
.sm\:d-dco90 > * + * {
|
|
20786
21113
|
--dco: 90% !important;
|
|
20787
21114
|
}
|
|
21115
|
+
.sm\:d-dco85 > * + * {
|
|
21116
|
+
--dco: 85% !important;
|
|
21117
|
+
}
|
|
20788
21118
|
.sm\:d-dco75 > * + * {
|
|
20789
21119
|
--dco: 75% !important;
|
|
20790
21120
|
}
|
|
@@ -20932,6 +21262,7 @@ body.theme-dark {
|
|
|
20932
21262
|
}
|
|
20933
21263
|
.sm\:d-modal__banner {
|
|
20934
21264
|
position: relative;
|
|
21265
|
+
box-sizing: border-box;
|
|
20935
21266
|
width: 100%;
|
|
20936
21267
|
max-width: var(--size628);
|
|
20937
21268
|
padding: var(--su12) var(--su24);
|
|
@@ -22236,6 +22567,9 @@ body.theme-dark {
|
|
|
22236
22567
|
--dco: 100%;
|
|
22237
22568
|
border-color: hsla(var(--red-700-h) var(--red-700-s) var(--red-700-l) / var(--dco)) !important;
|
|
22238
22569
|
}
|
|
22570
|
+
.md\:d-dco100 > * + * {
|
|
22571
|
+
--dco: 100% !important;
|
|
22572
|
+
}
|
|
22239
22573
|
.md\:d-dco99 > * + * {
|
|
22240
22574
|
--dco: 99% !important;
|
|
22241
22575
|
}
|
|
@@ -22245,6 +22579,9 @@ body.theme-dark {
|
|
|
22245
22579
|
.md\:d-dco90 > * + * {
|
|
22246
22580
|
--dco: 90% !important;
|
|
22247
22581
|
}
|
|
22582
|
+
.md\:d-dco85 > * + * {
|
|
22583
|
+
--dco: 85% !important;
|
|
22584
|
+
}
|
|
22248
22585
|
.md\:d-dco75 > * + * {
|
|
22249
22586
|
--dco: 75% !important;
|
|
22250
22587
|
}
|
|
@@ -22392,6 +22729,7 @@ body.theme-dark {
|
|
|
22392
22729
|
}
|
|
22393
22730
|
.md\:d-modal__banner {
|
|
22394
22731
|
position: relative;
|
|
22732
|
+
box-sizing: border-box;
|
|
22395
22733
|
width: 100%;
|
|
22396
22734
|
max-width: var(--size628);
|
|
22397
22735
|
padding: var(--su12) var(--su24);
|
|
@@ -23696,6 +24034,9 @@ body.theme-dark {
|
|
|
23696
24034
|
--dco: 100%;
|
|
23697
24035
|
border-color: hsla(var(--red-700-h) var(--red-700-s) var(--red-700-l) / var(--dco)) !important;
|
|
23698
24036
|
}
|
|
24037
|
+
.lg\:d-dco100 > * + * {
|
|
24038
|
+
--dco: 100% !important;
|
|
24039
|
+
}
|
|
23699
24040
|
.lg\:d-dco99 > * + * {
|
|
23700
24041
|
--dco: 99% !important;
|
|
23701
24042
|
}
|
|
@@ -23705,6 +24046,9 @@ body.theme-dark {
|
|
|
23705
24046
|
.lg\:d-dco90 > * + * {
|
|
23706
24047
|
--dco: 90% !important;
|
|
23707
24048
|
}
|
|
24049
|
+
.lg\:d-dco85 > * + * {
|
|
24050
|
+
--dco: 85% !important;
|
|
24051
|
+
}
|
|
23708
24052
|
.lg\:d-dco75 > * + * {
|
|
23709
24053
|
--dco: 75% !important;
|
|
23710
24054
|
}
|
|
@@ -23852,6 +24196,7 @@ body.theme-dark {
|
|
|
23852
24196
|
}
|
|
23853
24197
|
.lg\:d-modal__banner {
|
|
23854
24198
|
position: relative;
|
|
24199
|
+
box-sizing: border-box;
|
|
23855
24200
|
width: 100%;
|
|
23856
24201
|
max-width: var(--size628);
|
|
23857
24202
|
padding: var(--su12) var(--su24);
|
|
@@ -25156,6 +25501,9 @@ body.theme-dark {
|
|
|
25156
25501
|
--dco: 100%;
|
|
25157
25502
|
border-color: hsla(var(--red-700-h) var(--red-700-s) var(--red-700-l) / var(--dco)) !important;
|
|
25158
25503
|
}
|
|
25504
|
+
.xl\:d-dco100 > * + * {
|
|
25505
|
+
--dco: 100% !important;
|
|
25506
|
+
}
|
|
25159
25507
|
.xl\:d-dco99 > * + * {
|
|
25160
25508
|
--dco: 99% !important;
|
|
25161
25509
|
}
|
|
@@ -25165,6 +25513,9 @@ body.theme-dark {
|
|
|
25165
25513
|
.xl\:d-dco90 > * + * {
|
|
25166
25514
|
--dco: 90% !important;
|
|
25167
25515
|
}
|
|
25516
|
+
.xl\:d-dco85 > * + * {
|
|
25517
|
+
--dco: 85% !important;
|
|
25518
|
+
}
|
|
25168
25519
|
.xl\:d-dco75 > * + * {
|
|
25169
25520
|
--dco: 75% !important;
|
|
25170
25521
|
}
|
|
@@ -25312,6 +25663,7 @@ body.theme-dark {
|
|
|
25312
25663
|
}
|
|
25313
25664
|
.xl\:d-modal__banner {
|
|
25314
25665
|
position: relative;
|
|
25666
|
+
box-sizing: border-box;
|
|
25315
25667
|
width: 100%;
|
|
25316
25668
|
max-width: var(--size628);
|
|
25317
25669
|
padding: var(--su12) var(--su24);
|