@dialpad/dialtone-css 8.80.0-next.8 → 8.80.0-next.9
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/js/dialtone_migrate/index.mjs +856 -0
- package/lib/build/js/dialtone_migrate_props/index.mjs +2 -1
- package/lib/build/js/dialtone_migration_helper/configs/physical-to-logical.mjs +7 -7
- package/lib/build/js/dialtone_migration_helper/configs/vue3-to-vue-imports.mjs +17 -0
- package/lib/build/less/components/box.less +2 -2
- package/lib/build/less/components/card.less +1 -1
- package/lib/build/less/components/image-viewer.less +0 -1
- package/lib/build/less/components/modal.less +1 -1
- package/lib/build/less/components/popover.less +1 -1
- package/lib/build/less/components/toast.less +2 -2
- package/lib/build/less/recipes/contact_info.less +0 -1
- package/lib/build/less/recipes/unread_pill.less +1 -1
- package/lib/build/less/utilities/effects.less +5 -11
- package/lib/dist/dialtone-default-theme.css +74 -184
- package/lib/dist/dialtone-default-theme.min.css +1 -1
- package/lib/dist/dialtone-docs.json +1 -1
- package/lib/dist/dialtone.css +30 -23
- package/lib/dist/dialtone.min.css +1 -1
- package/lib/dist/js/dialtone_migrate/index.mjs +856 -0
- package/lib/dist/js/dialtone_migrate_props/index.mjs +2 -1
- package/lib/dist/js/dialtone_migrate_tshirt_to_numeric/index.mjs +0 -0
- package/lib/dist/js/dialtone_migration_helper/configs/physical-to-logical.mjs +7 -7
- package/lib/dist/js/dialtone_migration_helper/configs/vue3-to-vue-imports.mjs +17 -0
- package/lib/dist/tokens/tokens-base-dark.css +126 -267
- package/lib/dist/tokens/tokens-base-light.css +44 -161
- package/lib/dist/tokens/tokens-debug-base.css +41 -158
- package/lib/dist/tokens-docs.json +1 -1
- package/package.json +4 -1
|
@@ -169,6 +169,7 @@ const UPDATE_EVENT_RENAMES = {
|
|
|
169
169
|
|
|
170
170
|
// Component events removed from emits and replaced by @update:model-value
|
|
171
171
|
const EMIT_EVENT_RENAMES = {
|
|
172
|
+
'dt-checkbox': { input: 'update:model-value' },
|
|
172
173
|
'dt-input': { input: 'update:model-value' },
|
|
173
174
|
'dt-radio': { input: 'update:model-value' },
|
|
174
175
|
'dt-radio-group': { input: 'update:model-value' },
|
|
@@ -630,7 +631,7 @@ Migrations applied:
|
|
|
630
631
|
selected-values → model-value (dt-checkbox-group)
|
|
631
632
|
v-model:selected-values → v-model (dt-checkbox-group)
|
|
632
633
|
@update:selected-values → @update:model-value (dt-checkbox-group)
|
|
633
|
-
@input → @update:model-value (dt-input, dt-radio, dt-radio-group, dt-combobox-multi-select, dt-rich-text-editor, dt-input-group)
|
|
634
|
+
@input → @update:model-value (dt-checkbox, dt-input, dt-radio, dt-radio-group, dt-combobox-multi-select, dt-rich-text-editor, dt-input-group)
|
|
634
635
|
@change → @update:model-value (dt-toggle, dt-select-menu)
|
|
635
636
|
show → open (dt-modal, dt-toast, dt-tooltip)
|
|
636
637
|
@update:show → @update:open (dt-modal, dt-toast, dt-tooltip)
|
|
@@ -33,15 +33,15 @@ export default {
|
|
|
33
33
|
// Generic short slot names (#left, #right, #bottom) are scoped to known
|
|
34
34
|
// Dialtone components to avoid renaming slots on non-Dialtone components.
|
|
35
35
|
// Uses multiline matching to find the slot within a dt-* or dt-recipe-* tag.
|
|
36
|
-
// Components: dt-item-layout, dt-recipe-callbox, dt-recipe-contact-centers-row,
|
|
36
|
+
// Components: dt-item-layout, dt-list-item, dt-recipe-callbox, dt-recipe-contact-centers-row,
|
|
37
37
|
// dt-recipe-general-row, dt-recipe-top-banner-info
|
|
38
38
|
|
|
39
|
-
// #left → #start (only on dt-item-layout, dt-recipe-general-row, dt-recipe-top-banner-info)
|
|
40
|
-
{ from: /(<dt-(?:item-layout|recipe-general-row|recipe-top-banner-info)[\s\S]*?)#left(?=[\s"'>])/gm, to: '$1#start' },
|
|
41
|
-
// #right → #end (only on dt-item-layout, dt-recipe-callbox, dt-recipe-contact-centers-row, dt-recipe-top-banner-info)
|
|
42
|
-
{ from: /(<dt-(?:item-layout|recipe-callbox|recipe-contact-centers-row|recipe-top-banner-info)[\s\S]*?)#right(?=[\s"'>])/gm, to: '$1#end' },
|
|
43
|
-
// #bottom → #blockEnd (only on dt-item-layout, dt-recipe-callbox)
|
|
44
|
-
{ from: /(<dt-(?:item-layout|recipe-callbox)[\s\S]*?)#bottom(?=[\s"'>])/gm, to: '$1#blockEnd' },
|
|
39
|
+
// #left → #start (only on dt-item-layout, dt-list-item, dt-recipe-general-row, dt-recipe-top-banner-info)
|
|
40
|
+
{ from: /(<(?:dt-(?:item-layout|list-item|recipe-general-row|recipe-top-banner-info)|Dt(?:ItemLayout|ListItem|RecipeGeneralRow|RecipeTopBannerInfo))[\s\S]*?)#left(?=[\s"'>])/gm, to: '$1#start' },
|
|
41
|
+
// #right → #end (only on dt-item-layout, dt-list-item, dt-recipe-callbox, dt-recipe-contact-centers-row, dt-recipe-top-banner-info)
|
|
42
|
+
{ from: /(<(?:dt-(?:item-layout|list-item|recipe-callbox|recipe-contact-centers-row|recipe-top-banner-info)|Dt(?:ItemLayout|ListItem|RecipeCallbox|RecipeContactCentersRow|RecipeTopBannerInfo))[\s\S]*?)#right(?=[\s"'>])/gm, to: '$1#end' },
|
|
43
|
+
// #bottom → #blockEnd (only on dt-item-layout, dt-list-item, dt-recipe-callbox)
|
|
44
|
+
{ from: /(<(?:dt-(?:item-layout|list-item|recipe-callbox)|Dt(?:ItemLayout|ListItem|RecipeCallbox))[\s\S]*?)#bottom(?=[\s"'>])/gm, to: '$1#blockEnd' },
|
|
45
45
|
|
|
46
46
|
// ── Prop renames ──────────────────────────────────────────────────────
|
|
47
47
|
// Longer patterns first within each prefix group.
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
// Migration: /vue3 import paths → /vue
|
|
2
|
+
// After Vue 2 removal, the /vue3 subpath exports were renamed to /vue.
|
|
3
|
+
// The /vue3 paths may still work for backwards compatibility in some packages,
|
|
4
|
+
// but @dialpad/dialtone-icons only exports /vue, making this a breaking change.
|
|
5
|
+
|
|
6
|
+
export default {
|
|
7
|
+
description:
|
|
8
|
+
'Renames /vue3 import subpaths to /vue for @dialpad/dialtone-icons and\n' +
|
|
9
|
+
'@dialpad/dialtone-vue. After Vue 2 removal, /vue is the canonical path.',
|
|
10
|
+
patterns: ['**/*.{vue,js,ts,jsx,tsx,mjs,mts}'],
|
|
11
|
+
expressions: [
|
|
12
|
+
// @dialpad/dialtone-icons/vue3 → @dialpad/dialtone-icons/vue
|
|
13
|
+
{ from: /@dialpad\/dialtone-icons\/vue3/g, to: '@dialpad/dialtone-icons/vue' },
|
|
14
|
+
// @dialpad/dialtone-vue/vue3 → @dialpad/dialtone-vue (or /vue if used)
|
|
15
|
+
{ from: /@dialpad\/dialtone-vue\/vue3/g, to: '@dialpad/dialtone-vue' },
|
|
16
|
+
],
|
|
17
|
+
};
|
|
@@ -111,13 +111,13 @@
|
|
|
111
111
|
// ============================================================================
|
|
112
112
|
// $ VALUE LISTS
|
|
113
113
|
// ----------------------------------------------------------------------------
|
|
114
|
-
@box-surface-values:
|
|
114
|
+
@box-surface-values: primary, secondary, moderate, bold, strong, contrast, backdrop, brand, info, warning, critical, positive, success, brand-subtle, brand-strong, info-subtle, info-strong, warning-subtle, warning-strong, critical-subtle, critical-strong, positive-subtle, positive-strong, success-subtle, success-strong, primary-opaque, secondary-opaque, moderate-opaque, bold-opaque, strong-opaque, contrast-opaque, brand-opaque, brand-subtle-opaque, info-opaque, info-subtle-opaque, warning-opaque, warning-subtle-opaque, critical-opaque, critical-subtle-opaque, positive-opaque, positive-subtle-opaque, success-opaque, success-subtle-opaque;
|
|
115
115
|
|
|
116
116
|
@box-border-color-values: subtle, default, moderate, bold, accent, focus, brand, warning, critical, info, positive, success, brand-subtle, brand-strong, warning-subtle, warning-strong, critical-subtle, critical-strong, info-subtle, info-strong, positive-subtle, positive-strong, success-subtle, success-strong;
|
|
117
117
|
|
|
118
118
|
@box-border-width-values: 0, 50, 100, 150, 200, 300, 400;
|
|
119
119
|
@box-layout-percent-values: 10, 20, 25, 30, 33, 40, 50, 60, 66, 70, 75, 80, 90, 95, 100;
|
|
120
|
-
@box-shadow-values:
|
|
120
|
+
@box-shadow-values: small, medium, large, extra-large, card;
|
|
121
121
|
@box-overflow-values: hidden, scroll, auto, clip, visible;
|
|
122
122
|
|
|
123
123
|
@layer dialtone.components {
|
|
@@ -100,7 +100,7 @@
|
|
|
100
100
|
--modal-dialog-color-border: var(--dt-color-border-subtle);
|
|
101
101
|
--modal-dialog-color-text: var(--dt-color-foreground-primary);
|
|
102
102
|
--modal-header-color-text: var(--dt-color-foreground-primary);
|
|
103
|
-
--modal-dialog-shadow: var(--dt-shadow-
|
|
103
|
+
--modal-dialog-shadow: var(--dt-shadow-large);
|
|
104
104
|
|
|
105
105
|
// If we don't set this the native app header region will override all click events on the modal overlay
|
|
106
106
|
-webkit-app-region: no-drag;
|
|
@@ -29,7 +29,7 @@
|
|
|
29
29
|
--popover-border-width: var(--dt-size-border-100);
|
|
30
30
|
--popover-border-radius: var(--dt-size-radius-400);
|
|
31
31
|
--popover-color-border: var(--dt-color-border-subtle);
|
|
32
|
-
--popover-shadow: var(--dt-shadow-
|
|
32
|
+
--popover-shadow: var(--dt-shadow-card);
|
|
33
33
|
|
|
34
34
|
// If we don't set this the native app header region will override all click events within the popover
|
|
35
35
|
-webkit-app-region: no-drag;
|
|
@@ -28,7 +28,7 @@
|
|
|
28
28
|
// Component CSS Vars
|
|
29
29
|
// ------------------------------------------------------------------------
|
|
30
30
|
--toast-color-shadow: var(--dt-color-border-subtle);
|
|
31
|
-
--toast-box-shadow: 0 0 0 var(--dt-size-border-100) var(--toast-color-shadow) inset, var(--dt-shadow-
|
|
31
|
+
--toast-box-shadow: 0 0 0 var(--dt-size-border-100) var(--toast-color-shadow) inset, var(--dt-shadow-medium);
|
|
32
32
|
|
|
33
33
|
z-index: var(--zi-notification);
|
|
34
34
|
display: block;
|
|
@@ -125,7 +125,7 @@
|
|
|
125
125
|
// Component CSS Vars
|
|
126
126
|
// ------------------------------------------------------------------------
|
|
127
127
|
--toast-alternate-color-shadow: oklch(from var(--dt-color-black-900) l c h / 0.15);
|
|
128
|
-
--toast-alternate-box-shadow: 0 0 0 var(--dt-spacing-0) var(--toast-alternate-color-shadow) inset, var(--dt-shadow-
|
|
128
|
+
--toast-alternate-box-shadow: 0 0 0 var(--dt-spacing-0) var(--toast-alternate-color-shadow) inset, var(--dt-shadow-medium);
|
|
129
129
|
--toast-alternate-color-background: var(--dt-color-surface-primary);
|
|
130
130
|
--toast-alternate-color-text: var(--dt-color-foreground-primary);
|
|
131
131
|
--toast-alternate-color-icon: var(--dt-color-foreground-muted);
|
|
@@ -142,17 +142,11 @@
|
|
|
142
142
|
// ============================================================================
|
|
143
143
|
// $ BOX SHADOW
|
|
144
144
|
// ----------------------------------------------------------------------------
|
|
145
|
-
.d-bs-
|
|
146
|
-
.d-bs-
|
|
147
|
-
.d-bs-
|
|
148
|
-
|
|
149
|
-
.d-bs-
|
|
150
|
-
.d-bs-md,
|
|
151
|
-
.d-bs-lg { box-shadow: var(--dt-shadow-overlay) !important; }
|
|
152
|
-
|
|
153
|
-
.d-bs-modal,
|
|
154
|
-
.d-bs-xl { box-shadow: var(--dt-shadow-modal) !important; }
|
|
155
|
-
|
|
145
|
+
.d-bs-sm { box-shadow: var(--dt-shadow-small) !important; }
|
|
146
|
+
.d-bs-md { box-shadow: var(--dt-shadow-medium) !important; }
|
|
147
|
+
.d-bs-lg { box-shadow: var(--dt-shadow-large) !important; }
|
|
148
|
+
.d-bs-xl { box-shadow: var(--dt-shadow-extra-large) !important; }
|
|
149
|
+
.d-bs-card { box-shadow: var(--dt-shadow-card) !important; }
|
|
156
150
|
.d-bs-none { box-shadow: none !important; }
|
|
157
151
|
.d-bs-unset { box-shadow: unset !important; }
|
|
158
152
|
|
|
@@ -1234,9 +1234,6 @@
|
|
|
1234
1234
|
.d-box--pbe-800 {
|
|
1235
1235
|
--box-pbe: var(--dt-spacing-800);
|
|
1236
1236
|
}
|
|
1237
|
-
.d-box--surface-overlay {
|
|
1238
|
-
--box-surface: var(--dt-color-surface-overlay);
|
|
1239
|
-
}
|
|
1240
1237
|
.d-box--surface-primary {
|
|
1241
1238
|
--box-surface: var(--dt-color-surface-primary);
|
|
1242
1239
|
}
|
|
@@ -1624,14 +1621,20 @@
|
|
|
1624
1621
|
.d-box--br-circle {
|
|
1625
1622
|
--box-br: var(--dt-size-radius-circle);
|
|
1626
1623
|
}
|
|
1627
|
-
.d-box--shadow-
|
|
1628
|
-
--box-shadow: var(--dt-shadow-
|
|
1624
|
+
.d-box--shadow-small {
|
|
1625
|
+
--box-shadow: var(--dt-shadow-small);
|
|
1626
|
+
}
|
|
1627
|
+
.d-box--shadow-medium {
|
|
1628
|
+
--box-shadow: var(--dt-shadow-medium);
|
|
1629
1629
|
}
|
|
1630
|
-
.d-box--shadow-
|
|
1631
|
-
--box-shadow: var(--dt-shadow-
|
|
1630
|
+
.d-box--shadow-large {
|
|
1631
|
+
--box-shadow: var(--dt-shadow-large);
|
|
1632
1632
|
}
|
|
1633
|
-
.d-box--shadow-
|
|
1634
|
-
--box-shadow: var(--dt-shadow-
|
|
1633
|
+
.d-box--shadow-extra-large {
|
|
1634
|
+
--box-shadow: var(--dt-shadow-extra-large);
|
|
1635
|
+
}
|
|
1636
|
+
.d-box--shadow-card {
|
|
1637
|
+
--box-shadow: var(--dt-shadow-card);
|
|
1635
1638
|
}
|
|
1636
1639
|
.d-box--is-0 {
|
|
1637
1640
|
inline-size: 0;
|
|
@@ -6724,7 +6727,6 @@
|
|
|
6724
6727
|
max-block-size: 80%;
|
|
6725
6728
|
padding: var(--dt-spacing-0);
|
|
6726
6729
|
border-radius: var(--dt-size-radius-0);
|
|
6727
|
-
box-shadow: var(--dt-shadow-modal);
|
|
6728
6730
|
}
|
|
6729
6731
|
.d-image-viewer__full__image {
|
|
6730
6732
|
max-inline-size: 100%;
|
|
@@ -7090,7 +7092,7 @@
|
|
|
7090
7092
|
background: var(--dt-color-surface-primary);
|
|
7091
7093
|
border: var(--dt-size-border-100) solid var(--dt-color-border-subtle);
|
|
7092
7094
|
border-radius: var(--dt-size-radius-300);
|
|
7093
|
-
box-shadow: var(--dt-shadow-
|
|
7095
|
+
box-shadow: var(--dt-shadow-card);
|
|
7094
7096
|
}
|
|
7095
7097
|
.d-card__header {
|
|
7096
7098
|
display: flex;
|
|
@@ -7293,7 +7295,7 @@
|
|
|
7293
7295
|
--modal-dialog-color-border: var(--dt-color-border-subtle);
|
|
7294
7296
|
--modal-dialog-color-text: var(--dt-color-foreground-primary);
|
|
7295
7297
|
--modal-header-color-text: var(--dt-color-foreground-primary);
|
|
7296
|
-
--modal-dialog-shadow: var(--dt-shadow-
|
|
7298
|
+
--modal-dialog-shadow: var(--dt-shadow-large);
|
|
7297
7299
|
-webkit-app-region: no-drag;
|
|
7298
7300
|
position: fixed;
|
|
7299
7301
|
inset: 0;
|
|
@@ -7757,7 +7759,7 @@
|
|
|
7757
7759
|
}
|
|
7758
7760
|
.d-toast {
|
|
7759
7761
|
--toast-color-shadow: var(--dt-color-border-subtle);
|
|
7760
|
-
--toast-box-shadow: 0 0 0 var(--dt-size-border-100) var(--toast-color-shadow) inset, var(--dt-shadow-
|
|
7762
|
+
--toast-box-shadow: 0 0 0 var(--dt-size-border-100) var(--toast-color-shadow) inset, var(--dt-shadow-medium);
|
|
7761
7763
|
z-index: var(--zi-notification);
|
|
7762
7764
|
display: block;
|
|
7763
7765
|
max-inline-size: var(--dt-layout-700);
|
|
@@ -7810,7 +7812,7 @@
|
|
|
7810
7812
|
}
|
|
7811
7813
|
.d-toast-alternate {
|
|
7812
7814
|
--toast-alternate-color-shadow: oklch(from var(--dt-color-black-900) l c h / 0.15);
|
|
7813
|
-
--toast-alternate-box-shadow: 0 0 0 var(--dt-spacing-0) var(--toast-alternate-color-shadow) inset, var(--dt-shadow-
|
|
7815
|
+
--toast-alternate-box-shadow: 0 0 0 var(--dt-spacing-0) var(--toast-alternate-color-shadow) inset, var(--dt-shadow-medium);
|
|
7814
7816
|
--toast-alternate-color-background: var(--dt-color-surface-primary);
|
|
7815
7817
|
--toast-alternate-color-text: var(--dt-color-foreground-primary);
|
|
7816
7818
|
--toast-alternate-color-icon: var(--dt-color-foreground-muted);
|
|
@@ -7986,7 +7988,7 @@
|
|
|
7986
7988
|
--popover-border-width: var(--dt-size-border-100);
|
|
7987
7989
|
--popover-border-radius: var(--dt-size-radius-400);
|
|
7988
7990
|
--popover-color-border: var(--dt-color-border-subtle);
|
|
7989
|
-
--popover-shadow: var(--dt-shadow-
|
|
7991
|
+
--popover-shadow: var(--dt-shadow-card);
|
|
7990
7992
|
-webkit-app-region: no-drag;
|
|
7991
7993
|
display: grid;
|
|
7992
7994
|
grid-template-rows: -webkit-min-content 1fr -webkit-min-content;
|
|
@@ -10313,7 +10315,6 @@
|
|
|
10313
10315
|
display: flex;
|
|
10314
10316
|
align-items: center;
|
|
10315
10317
|
justify-content: flex-start;
|
|
10316
|
-
min-inline-size: var(--dt-layout-75);
|
|
10317
10318
|
block-size: var(--dt-layout-100-percent);
|
|
10318
10319
|
background-color: transparent;
|
|
10319
10320
|
background-image: none;
|
|
@@ -11414,7 +11415,7 @@
|
|
|
11414
11415
|
line-height: var(--dt-font-line-height-600);
|
|
11415
11416
|
border: none;
|
|
11416
11417
|
border-radius: var(--dt-size-radius-pill);
|
|
11417
|
-
box-shadow: var(--dt-shadow-
|
|
11418
|
+
box-shadow: var(--dt-shadow-medium);
|
|
11418
11419
|
cursor: pointer;
|
|
11419
11420
|
}
|
|
11420
11421
|
.d-recipe-leftbar-unread-pill-mentions {
|
|
@@ -12141,14 +12142,20 @@
|
|
|
12141
12142
|
opacity: 0;
|
|
12142
12143
|
}
|
|
12143
12144
|
}
|
|
12144
|
-
.d-bs-
|
|
12145
|
-
box-shadow: var(--dt-shadow-
|
|
12145
|
+
.d-bs-sm, .h\:d-bs-sm:hover, .f\:d-bs-sm:focus, .f\:d-bs-sm:focus-within, .fv\:d-bs-sm:focus-visible {
|
|
12146
|
+
box-shadow: var(--dt-shadow-small) !important;
|
|
12146
12147
|
}
|
|
12147
|
-
.d-bs-
|
|
12148
|
-
box-shadow: var(--dt-shadow-
|
|
12148
|
+
.d-bs-md, .h\:d-bs-md:hover, .f\:d-bs-md:focus, .f\:d-bs-md:focus-within, .fv\:d-bs-md:focus-visible {
|
|
12149
|
+
box-shadow: var(--dt-shadow-medium) !important;
|
|
12149
12150
|
}
|
|
12150
|
-
.d-bs-
|
|
12151
|
-
box-shadow: var(--dt-shadow-
|
|
12151
|
+
.d-bs-lg, .h\:d-bs-lg:hover, .f\:d-bs-lg:focus, .f\:d-bs-lg:focus-within, .fv\:d-bs-lg:focus-visible {
|
|
12152
|
+
box-shadow: var(--dt-shadow-large) !important;
|
|
12153
|
+
}
|
|
12154
|
+
.d-bs-xl, .h\:d-bs-xl:hover, .f\:d-bs-xl:focus, .f\:d-bs-xl:focus-within, .fv\:d-bs-xl:focus-visible {
|
|
12155
|
+
box-shadow: var(--dt-shadow-extra-large) !important;
|
|
12156
|
+
}
|
|
12157
|
+
.d-bs-card, .h\:d-bs-card:hover, .f\:d-bs-card:focus, .f\:d-bs-card:focus-within, .fv\:d-bs-card:focus-visible {
|
|
12158
|
+
box-shadow: var(--dt-shadow-card) !important;
|
|
12152
12159
|
}
|
|
12153
12160
|
.d-bs-none, .h\:d-bs-none:hover, .f\:d-bs-none:focus, .f\:d-bs-none:focus-within, .fv\:d-bs-none:focus-visible {
|
|
12154
12161
|
box-shadow: none !important;
|
|
@@ -15001,162 +15008,20 @@
|
|
|
15001
15008
|
--dt-shadow-focus-inset-type: dropShadow;
|
|
15002
15009
|
--dt-shadow-focus-2-type: dropShadow;
|
|
15003
15010
|
--dt-shadow-focus-1-type: dropShadow;
|
|
15004
|
-
--dt-shadow-extra-large-4-offset-y: 3.2rem;
|
|
15005
|
-
--dt-shadow-extra-large-4-offset-x: 0rem;
|
|
15006
|
-
--dt-shadow-extra-large-4-type: dropShadow;
|
|
15007
|
-
--dt-shadow-extra-large-4-color: oklch(0 0 0 / 0.16);
|
|
15008
|
-
--dt-shadow-extra-large-4-spread: 0rem;
|
|
15009
|
-
--dt-shadow-extra-large-4-blur: 3.2rem;
|
|
15010
|
-
--dt-shadow-extra-large-3-offset-y: 1.2rem;
|
|
15011
|
-
--dt-shadow-extra-large-3-offset-x: 0rem;
|
|
15012
|
-
--dt-shadow-extra-large-3-type: dropShadow;
|
|
15013
|
-
--dt-shadow-extra-large-3-color: oklch(0 0 0 / 0.08);
|
|
15014
|
-
--dt-shadow-extra-large-3-spread: 0rem;
|
|
15015
|
-
--dt-shadow-extra-large-3-blur: 1.6rem;
|
|
15016
|
-
--dt-shadow-extra-large-2-offset-y: 0.4rem;
|
|
15017
|
-
--dt-shadow-extra-large-2-offset-x: 0rem;
|
|
15018
|
-
--dt-shadow-extra-large-2-type: dropShadow;
|
|
15019
|
-
--dt-shadow-extra-large-2-color: oklch(0 0 0 / 0.06);
|
|
15020
|
-
--dt-shadow-extra-large-2-spread: 0rem;
|
|
15021
|
-
--dt-shadow-extra-large-2-blur: 0.6rem;
|
|
15022
|
-
--dt-shadow-extra-large-1-offset-y: 0.2rem;
|
|
15023
|
-
--dt-shadow-extra-large-1-offset-x: 0rem;
|
|
15024
|
-
--dt-shadow-extra-large-1-type: dropShadow;
|
|
15025
|
-
--dt-shadow-extra-large-1-color: oklch(0 0 0 / 0.02);
|
|
15026
|
-
--dt-shadow-extra-large-1-spread: 0rem;
|
|
15027
|
-
--dt-shadow-extra-large-1-blur: 0.2rem;
|
|
15028
|
-
--dt-shadow-large-3-offset-y: 0.8rem;
|
|
15029
|
-
--dt-shadow-large-3-offset-x: 0rem;
|
|
15030
|
-
--dt-shadow-large-3-type: dropShadow;
|
|
15031
|
-
--dt-shadow-large-3-color: oklch(0 0 0 / 0.08);
|
|
15032
|
-
--dt-shadow-large-3-spread: 0rem;
|
|
15033
|
-
--dt-shadow-large-3-blur: 1.2rem;
|
|
15034
|
-
--dt-shadow-large-2-offset-y: 0.2rem;
|
|
15035
|
-
--dt-shadow-large-2-offset-x: 0rem;
|
|
15036
|
-
--dt-shadow-large-2-type: dropShadow;
|
|
15037
|
-
--dt-shadow-large-2-color: oklch(0 0 0 / 0.06);
|
|
15038
|
-
--dt-shadow-large-2-spread: 0rem;
|
|
15039
|
-
--dt-shadow-large-2-blur: 0.8rem;
|
|
15040
|
-
--dt-shadow-large-1-offset-y: 0.1rem;
|
|
15041
|
-
--dt-shadow-large-1-offset-x: 0rem;
|
|
15042
|
-
--dt-shadow-large-1-type: dropShadow;
|
|
15043
|
-
--dt-shadow-large-1-color: oklch(0 0 0 / 0.04);
|
|
15044
|
-
--dt-shadow-large-1-spread: 0rem;
|
|
15045
|
-
--dt-shadow-large-1-blur: 0.2rem;
|
|
15046
|
-
--dt-shadow-medium-3-offset-y: 0.8rem;
|
|
15047
|
-
--dt-shadow-medium-3-offset-x: 0rem;
|
|
15048
|
-
--dt-shadow-medium-3-type: dropShadow;
|
|
15049
|
-
--dt-shadow-medium-3-color: oklch(0 0 0 / 0.08);
|
|
15050
|
-
--dt-shadow-medium-3-spread: 0rem;
|
|
15051
|
-
--dt-shadow-medium-3-blur: 1.2rem;
|
|
15052
|
-
--dt-shadow-medium-2-offset-y: 0.2rem;
|
|
15053
|
-
--dt-shadow-medium-2-offset-x: 0rem;
|
|
15054
|
-
--dt-shadow-medium-2-type: dropShadow;
|
|
15055
|
-
--dt-shadow-medium-2-color: oklch(0 0 0 / 0.06);
|
|
15056
|
-
--dt-shadow-medium-2-spread: 0rem;
|
|
15057
|
-
--dt-shadow-medium-2-blur: 0.8rem;
|
|
15058
|
-
--dt-shadow-medium-1-offset-y: 0.1rem;
|
|
15059
|
-
--dt-shadow-medium-1-offset-x: 0rem;
|
|
15060
|
-
--dt-shadow-medium-1-type: dropShadow;
|
|
15061
|
-
--dt-shadow-medium-1-color: oklch(0 0 0 / 0.04);
|
|
15062
|
-
--dt-shadow-medium-1-spread: 0rem;
|
|
15063
|
-
--dt-shadow-medium-1-blur: 0.2rem;
|
|
15064
|
-
--dt-shadow-small-3-offset-y: 0.2rem;
|
|
15065
|
-
--dt-shadow-small-3-offset-x: 0rem;
|
|
15066
|
-
--dt-shadow-small-3-type: dropShadow;
|
|
15067
|
-
--dt-shadow-small-3-color: oklch(0 0 0 / 0.12);
|
|
15068
|
-
--dt-shadow-small-3-spread: 0rem;
|
|
15069
|
-
--dt-shadow-small-3-blur: 0.4rem;
|
|
15070
|
-
--dt-shadow-small-2-offset-y: 0.1rem;
|
|
15071
|
-
--dt-shadow-small-2-offset-x: 0rem;
|
|
15072
|
-
--dt-shadow-small-2-type: dropShadow;
|
|
15073
|
-
--dt-shadow-small-2-color: oklch(0 0 0 / 0.06);
|
|
15074
|
-
--dt-shadow-small-2-spread: 0rem;
|
|
15075
|
-
--dt-shadow-small-2-blur: 0.2rem;
|
|
15076
|
-
--dt-shadow-small-1-offset-y: -0.1rem;
|
|
15077
|
-
--dt-shadow-small-1-offset-x: 0rem;
|
|
15078
|
-
--dt-shadow-small-1-type: dropShadow;
|
|
15079
|
-
--dt-shadow-small-1-color: oklch(0 0 0 / 0.04);
|
|
15080
|
-
--dt-shadow-small-1-spread: 0rem;
|
|
15081
|
-
--dt-shadow-small-1-blur: 0.1rem;
|
|
15082
|
-
--dt-shadow-card-3-offset-y: 0.2rem;
|
|
15083
|
-
--dt-shadow-card-3-offset-x: 0rem;
|
|
15084
15011
|
--dt-shadow-card-3-type: dropShadow;
|
|
15085
|
-
--dt-shadow-card-3-color: oklch(0 0 0 / 0.
|
|
15086
|
-
--dt-shadow-card-3-spread: 0rem;
|
|
15087
|
-
--dt-shadow-card-3-blur: 0.4rem;
|
|
15088
|
-
--dt-shadow-card-2-offset-y: 0.1rem;
|
|
15089
|
-
--dt-shadow-card-2-offset-x: 0rem;
|
|
15012
|
+
--dt-shadow-card-3-color: oklch(0 0 0 / 0.0784);
|
|
15090
15013
|
--dt-shadow-card-2-type: dropShadow;
|
|
15091
|
-
--dt-shadow-card-2-color: oklch(0 0 0 / 0.
|
|
15092
|
-
--dt-shadow-card-2-spread: 0rem;
|
|
15093
|
-
--dt-shadow-card-2-blur: 0.2rem;
|
|
15094
|
-
--dt-shadow-card-1-offset-y: -0.1rem;
|
|
15095
|
-
--dt-shadow-card-1-offset-x: 0rem;
|
|
15014
|
+
--dt-shadow-card-2-color: oklch(0 0 0 / 0.0392);
|
|
15096
15015
|
--dt-shadow-card-1-type: dropShadow;
|
|
15097
|
-
--dt-shadow-card-1-color: oklch(0 0 0 / 0.
|
|
15098
|
-
--dt-shadow-
|
|
15099
|
-
--dt-shadow-
|
|
15100
|
-
--dt-shadow-
|
|
15101
|
-
--dt-shadow-
|
|
15102
|
-
--dt-shadow-
|
|
15103
|
-
--dt-shadow-
|
|
15104
|
-
--dt-shadow-
|
|
15105
|
-
--dt-shadow-
|
|
15106
|
-
--dt-shadow-modal-3-offset-y: 1.2rem;
|
|
15107
|
-
--dt-shadow-modal-3-offset-x: 0rem;
|
|
15108
|
-
--dt-shadow-modal-3-type: dropShadow;
|
|
15109
|
-
--dt-shadow-modal-3-color: oklch(0 0 0 / 0.08);
|
|
15110
|
-
--dt-shadow-modal-3-spread: 0rem;
|
|
15111
|
-
--dt-shadow-modal-3-blur: 1.6rem;
|
|
15112
|
-
--dt-shadow-modal-2-offset-y: 0.4rem;
|
|
15113
|
-
--dt-shadow-modal-2-offset-x: 0rem;
|
|
15114
|
-
--dt-shadow-modal-2-type: dropShadow;
|
|
15115
|
-
--dt-shadow-modal-2-color: oklch(0 0 0 / 0.06);
|
|
15116
|
-
--dt-shadow-modal-2-spread: 0rem;
|
|
15117
|
-
--dt-shadow-modal-2-blur: 0.6rem;
|
|
15118
|
-
--dt-shadow-modal-1-offset-y: 0.2rem;
|
|
15119
|
-
--dt-shadow-modal-1-offset-x: 0rem;
|
|
15120
|
-
--dt-shadow-modal-1-type: dropShadow;
|
|
15121
|
-
--dt-shadow-modal-1-color: oklch(0 0 0 / 0.02);
|
|
15122
|
-
--dt-shadow-modal-1-spread: 0rem;
|
|
15123
|
-
--dt-shadow-modal-1-blur: 0.2rem;
|
|
15124
|
-
--dt-shadow-overlay-3-offset-y: 0.8rem;
|
|
15125
|
-
--dt-shadow-overlay-3-offset-x: 0rem;
|
|
15126
|
-
--dt-shadow-overlay-3-type: dropShadow;
|
|
15127
|
-
--dt-shadow-overlay-3-color: oklch(0 0 0 / 0.08);
|
|
15128
|
-
--dt-shadow-overlay-3-spread: 0rem;
|
|
15129
|
-
--dt-shadow-overlay-3-blur: 1.2rem;
|
|
15130
|
-
--dt-shadow-overlay-2-offset-y: 0.2rem;
|
|
15131
|
-
--dt-shadow-overlay-2-offset-x: 0rem;
|
|
15132
|
-
--dt-shadow-overlay-2-type: dropShadow;
|
|
15133
|
-
--dt-shadow-overlay-2-color: oklch(0 0 0 / 0.06);
|
|
15134
|
-
--dt-shadow-overlay-2-spread: 0rem;
|
|
15135
|
-
--dt-shadow-overlay-2-blur: 0.8rem;
|
|
15136
|
-
--dt-shadow-overlay-1-offset-y: 0.1rem;
|
|
15137
|
-
--dt-shadow-overlay-1-offset-x: 0rem;
|
|
15138
|
-
--dt-shadow-overlay-1-type: dropShadow;
|
|
15139
|
-
--dt-shadow-overlay-1-color: oklch(0 0 0 / 0.04);
|
|
15140
|
-
--dt-shadow-overlay-1-spread: 0rem;
|
|
15141
|
-
--dt-shadow-overlay-1-blur: 0.2rem;
|
|
15142
|
-
--dt-shadow-raised-3-offset-y: 0.2rem;
|
|
15143
|
-
--dt-shadow-raised-3-offset-x: 0rem;
|
|
15144
|
-
--dt-shadow-raised-3-type: dropShadow;
|
|
15145
|
-
--dt-shadow-raised-3-color: oklch(0 0 0 / 0.12);
|
|
15146
|
-
--dt-shadow-raised-3-spread: 0rem;
|
|
15147
|
-
--dt-shadow-raised-3-blur: 0.4rem;
|
|
15148
|
-
--dt-shadow-raised-2-offset-y: 0.1rem;
|
|
15149
|
-
--dt-shadow-raised-2-offset-x: 0rem;
|
|
15150
|
-
--dt-shadow-raised-2-type: dropShadow;
|
|
15151
|
-
--dt-shadow-raised-2-color: oklch(0 0 0 / 0.06);
|
|
15152
|
-
--dt-shadow-raised-2-spread: 0rem;
|
|
15153
|
-
--dt-shadow-raised-2-blur: 0.2rem;
|
|
15154
|
-
--dt-shadow-raised-1-offset-y: -0.1rem;
|
|
15155
|
-
--dt-shadow-raised-1-offset-x: 0rem;
|
|
15156
|
-
--dt-shadow-raised-1-type: dropShadow;
|
|
15157
|
-
--dt-shadow-raised-1-color: oklch(0 0 0 / 0.04);
|
|
15158
|
-
--dt-shadow-raised-1-spread: 0rem;
|
|
15159
|
-
--dt-shadow-raised-1-blur: 0.1rem;
|
|
15016
|
+
--dt-shadow-card-1-color: oklch(0 0 0 / 0.0314);
|
|
15017
|
+
--dt-shadow-extra-large-type: dropShadow;
|
|
15018
|
+
--dt-shadow-extra-large-color: oklch(0 0 0 / 0.302);
|
|
15019
|
+
--dt-shadow-large-type: dropShadow;
|
|
15020
|
+
--dt-shadow-large-color: oklch(0 0 0 / 0.302);
|
|
15021
|
+
--dt-shadow-medium-type: dropShadow;
|
|
15022
|
+
--dt-shadow-medium-color: oklch(0 0 0 / 0.251);
|
|
15023
|
+
--dt-shadow-small-type: dropShadow;
|
|
15024
|
+
--dt-shadow-small-color: oklch(0 0 0 / 0.149);
|
|
15160
15025
|
--dt-opacity-1300: 1;
|
|
15161
15026
|
--dt-opacity-1200: 0.9;
|
|
15162
15027
|
--dt-opacity-1100: 0.8;
|
|
@@ -15482,6 +15347,34 @@
|
|
|
15482
15347
|
--dt-shadow-focus-1-offset-x: var(--dt-size-0);
|
|
15483
15348
|
--dt-shadow-focus-1-spread: var(--dt-size-100);
|
|
15484
15349
|
--dt-shadow-focus-1-blur: var(--dt-size-0);
|
|
15350
|
+
--dt-shadow-card-3-offset-y: var(--dt-size-200);
|
|
15351
|
+
--dt-shadow-card-3-offset-x: var(--dt-size-0);
|
|
15352
|
+
--dt-shadow-card-3-spread: var(--dt-size-0);
|
|
15353
|
+
--dt-shadow-card-3-blur: var(--dt-size-500);
|
|
15354
|
+
--dt-shadow-card-2-offset-y: var(--dt-size-200);
|
|
15355
|
+
--dt-shadow-card-2-offset-x: var(--dt-size-0);
|
|
15356
|
+
--dt-shadow-card-2-spread: var(--dt-size-0);
|
|
15357
|
+
--dt-shadow-card-2-blur: var(--dt-size-300);
|
|
15358
|
+
--dt-shadow-card-1-offset-y: var(--dt-size-100);
|
|
15359
|
+
--dt-shadow-card-1-offset-x: var(--dt-size-0);
|
|
15360
|
+
--dt-shadow-card-1-spread: var(--dt-size-0);
|
|
15361
|
+
--dt-shadow-card-1-blur: var(--dt-size-200);
|
|
15362
|
+
--dt-shadow-extra-large-offset-y: var(--dt-size-200);
|
|
15363
|
+
--dt-shadow-extra-large-offset-x: var(--dt-size-0);
|
|
15364
|
+
--dt-shadow-extra-large-spread: var(--dt-size-0);
|
|
15365
|
+
--dt-shadow-extra-large-blur: var(--dt-size-600);
|
|
15366
|
+
--dt-shadow-large-offset-y: var(--dt-size-200);
|
|
15367
|
+
--dt-shadow-large-offset-x: var(--dt-size-0);
|
|
15368
|
+
--dt-shadow-large-spread: var(--dt-size-0);
|
|
15369
|
+
--dt-shadow-large-blur: var(--dt-size-500);
|
|
15370
|
+
--dt-shadow-medium-offset-y: var(--dt-size-200);
|
|
15371
|
+
--dt-shadow-medium-offset-x: var(--dt-size-0);
|
|
15372
|
+
--dt-shadow-medium-spread: var(--dt-size-0);
|
|
15373
|
+
--dt-shadow-medium-blur: var(--dt-size-400);
|
|
15374
|
+
--dt-shadow-small-offset-y: var(--dt-size-200);
|
|
15375
|
+
--dt-shadow-small-offset-x: var(--dt-size-0);
|
|
15376
|
+
--dt-shadow-small-spread: var(--dt-size-0);
|
|
15377
|
+
--dt-shadow-small-blur: var(--dt-size-300);
|
|
15485
15378
|
--dt-color-gradient-magenta-purple: linear-gradient(135deg, var(--dt-color-brand-magenta) 10%, var(--dt-color-brand-purple) 90%); /* Gradient for Ai-oriented treatments. */
|
|
15486
15379
|
--dt-color-black-1000: oklch(0.1595 0.0045 84.59);
|
|
15487
15380
|
--dt-color-black-950: oklch(0.2083 0.006 91.63);
|
|
@@ -15637,15 +15530,12 @@
|
|
|
15637
15530
|
--dt-font-size-75: calc(var(--dt-font-size-root) * 1.1); /* xs / extra small */
|
|
15638
15531
|
--dt-font-size-50: var(--dt-font-size-root); /* xxs / extra extra small */
|
|
15639
15532
|
--dt-shadow-focus-1-color: oklch(0.9748 0.0025 48.72);
|
|
15640
|
-
--dt-shadow-extra-large: var(--dt-shadow-extra-large-1-offset-x) var(--dt-shadow-extra-large-1-offset-y) var(--dt-shadow-extra-large-1-blur) var(--dt-shadow-extra-large-1-spread) var(--dt-shadow-extra-large-1-color), var(--dt-shadow-extra-large-2-offset-x) var(--dt-shadow-extra-large-2-offset-y) var(--dt-shadow-extra-large-2-blur) var(--dt-shadow-extra-large-2-spread) var(--dt-shadow-extra-large-2-color), var(--dt-shadow-extra-large-3-offset-x) var(--dt-shadow-extra-large-3-offset-y) var(--dt-shadow-extra-large-3-blur) var(--dt-shadow-extra-large-3-spread) var(--dt-shadow-extra-large-3-color), var(--dt-shadow-extra-large-4-offset-x) var(--dt-shadow-extra-large-4-offset-y) var(--dt-shadow-extra-large-4-blur) var(--dt-shadow-extra-large-4-spread) var(--dt-shadow-extra-large-4-color);
|
|
15641
|
-
--dt-shadow-large: var(--dt-shadow-large-1-offset-x) var(--dt-shadow-large-1-offset-y) var(--dt-shadow-large-1-blur) var(--dt-shadow-large-1-spread) var(--dt-shadow-large-1-color), var(--dt-shadow-large-2-offset-x) var(--dt-shadow-large-2-offset-y) var(--dt-shadow-large-2-blur) var(--dt-shadow-large-2-spread) var(--dt-shadow-large-2-color), var(--dt-shadow-large-3-offset-x) var(--dt-shadow-large-3-offset-y) var(--dt-shadow-large-3-blur) var(--dt-shadow-large-3-spread) var(--dt-shadow-large-3-color);
|
|
15642
|
-
--dt-shadow-medium: var(--dt-shadow-medium-1-offset-x) var(--dt-shadow-medium-1-offset-y) var(--dt-shadow-medium-1-blur) var(--dt-shadow-medium-1-spread) var(--dt-shadow-medium-1-color), var(--dt-shadow-medium-2-offset-x) var(--dt-shadow-medium-2-offset-y) var(--dt-shadow-medium-2-blur) var(--dt-shadow-medium-2-spread) var(--dt-shadow-medium-2-color), var(--dt-shadow-medium-3-offset-x) var(--dt-shadow-medium-3-offset-y) var(--dt-shadow-medium-3-blur) var(--dt-shadow-medium-3-spread) var(--dt-shadow-medium-3-color);
|
|
15643
|
-
--dt-shadow-small: var(--dt-shadow-small-1-offset-x) var(--dt-shadow-small-1-offset-y) var(--dt-shadow-small-1-blur) var(--dt-shadow-small-1-spread) var(--dt-shadow-small-1-color), var(--dt-shadow-small-2-offset-x) var(--dt-shadow-small-2-offset-y) var(--dt-shadow-small-2-blur) var(--dt-shadow-small-2-spread) var(--dt-shadow-small-2-color), var(--dt-shadow-small-3-offset-x) var(--dt-shadow-small-3-offset-y) var(--dt-shadow-small-3-blur) var(--dt-shadow-small-3-spread) var(--dt-shadow-small-3-color);
|
|
15644
|
-
--dt-shadow-card: var(--dt-shadow-card-1-offset-x) var(--dt-shadow-card-1-offset-y) var(--dt-shadow-card-1-blur) var(--dt-shadow-card-1-spread) var(--dt-shadow-card-1-color), var(--dt-shadow-card-2-offset-x) var(--dt-shadow-card-2-offset-y) var(--dt-shadow-card-2-blur) var(--dt-shadow-card-2-spread) var(--dt-shadow-card-2-color), var(--dt-shadow-card-3-offset-x) var(--dt-shadow-card-3-offset-y) var(--dt-shadow-card-3-blur) var(--dt-shadow-card-3-spread) var(--dt-shadow-card-3-color);
|
|
15645
|
-
--dt-shadow-modal: var(--dt-shadow-modal-1-offset-x) var(--dt-shadow-modal-1-offset-y) var(--dt-shadow-modal-1-blur) var(--dt-shadow-modal-1-spread) var(--dt-shadow-modal-1-color), var(--dt-shadow-modal-2-offset-x) var(--dt-shadow-modal-2-offset-y) var(--dt-shadow-modal-2-blur) var(--dt-shadow-modal-2-spread) var(--dt-shadow-modal-2-color), var(--dt-shadow-modal-3-offset-x) var(--dt-shadow-modal-3-offset-y) var(--dt-shadow-modal-3-blur) var(--dt-shadow-modal-3-spread) var(--dt-shadow-modal-3-color), var(--dt-shadow-modal-4-offset-x) var(--dt-shadow-modal-4-offset-y) var(--dt-shadow-modal-4-blur) var(--dt-shadow-modal-4-spread) var(--dt-shadow-modal-4-color);
|
|
15646
|
-
--dt-shadow-overlay: var(--dt-shadow-overlay-1-offset-x) var(--dt-shadow-overlay-1-offset-y) var(--dt-shadow-overlay-1-blur) var(--dt-shadow-overlay-1-spread) var(--dt-shadow-overlay-1-color), var(--dt-shadow-overlay-2-offset-x) var(--dt-shadow-overlay-2-offset-y) var(--dt-shadow-overlay-2-blur) var(--dt-shadow-overlay-2-spread) var(--dt-shadow-overlay-2-color), var(--dt-shadow-overlay-3-offset-x) var(--dt-shadow-overlay-3-offset-y) var(--dt-shadow-overlay-3-blur) var(--dt-shadow-overlay-3-spread) var(--dt-shadow-overlay-3-color);
|
|
15647
|
-
--dt-shadow-raised: var(--dt-shadow-raised-1-offset-x) var(--dt-shadow-raised-1-offset-y) var(--dt-shadow-raised-1-blur) var(--dt-shadow-raised-1-spread) var(--dt-shadow-raised-1-color), var(--dt-shadow-raised-2-offset-x) var(--dt-shadow-raised-2-offset-y) var(--dt-shadow-raised-2-blur) var(--dt-shadow-raised-2-spread) var(--dt-shadow-raised-2-color), var(--dt-shadow-raised-3-offset-x) var(--dt-shadow-raised-3-offset-y) var(--dt-shadow-raised-3-blur) var(--dt-shadow-raised-3-spread) var(--dt-shadow-raised-3-color);
|
|
15648
15533
|
--dt-shadow-focus-inset: var(--dt-shadow-focus-inset-offset-x) var(--dt-shadow-focus-inset-offset-y) var(--dt-shadow-focus-inset-blur) var(--dt-shadow-focus-inset-spread) var(--dt-shadow-focus-inset-color) inset;
|
|
15534
|
+
--dt-shadow-card: var(--dt-shadow-card-1-offset-x) var(--dt-shadow-card-1-offset-y) var(--dt-shadow-card-1-blur) var(--dt-shadow-card-1-spread) var(--dt-shadow-card-1-color), var(--dt-shadow-card-2-offset-x) var(--dt-shadow-card-2-offset-y) var(--dt-shadow-card-2-blur) var(--dt-shadow-card-2-spread) var(--dt-shadow-card-2-color), var(--dt-shadow-card-3-offset-x) var(--dt-shadow-card-3-offset-y) var(--dt-shadow-card-3-blur) var(--dt-shadow-card-3-spread) var(--dt-shadow-card-3-color);
|
|
15535
|
+
--dt-shadow-extra-large: var(--dt-shadow-extra-large-offset-x) var(--dt-shadow-extra-large-offset-y) var(--dt-shadow-extra-large-blur) var(--dt-shadow-extra-large-spread) var(--dt-shadow-extra-large-color);
|
|
15536
|
+
--dt-shadow-large: var(--dt-shadow-large-offset-x) var(--dt-shadow-large-offset-y) var(--dt-shadow-large-blur) var(--dt-shadow-large-spread) var(--dt-shadow-large-color);
|
|
15537
|
+
--dt-shadow-medium: var(--dt-shadow-medium-offset-x) var(--dt-shadow-medium-offset-y) var(--dt-shadow-medium-blur) var(--dt-shadow-medium-spread) var(--dt-shadow-medium-color);
|
|
15538
|
+
--dt-shadow-small: var(--dt-shadow-small-offset-x) var(--dt-shadow-small-offset-y) var(--dt-shadow-small-blur) var(--dt-shadow-small-spread) var(--dt-shadow-small-color);
|
|
15649
15539
|
--dt-shadow-focus: var(--dt-shadow-focus-1-offset-x) var(--dt-shadow-focus-1-offset-y) var(--dt-shadow-focus-1-blur) var(--dt-shadow-focus-1-spread) var(--dt-shadow-focus-1-color), var(--dt-shadow-focus-2-offset-x) var(--dt-shadow-focus-2-offset-y) var(--dt-shadow-focus-2-blur) var(--dt-shadow-focus-2-spread) var(--dt-shadow-focus-2-color);
|
|
15650
15540
|
--dt-layout-1600: calc(var(--dt-layout-base) * 16); /* 1024px */
|
|
15651
15541
|
--dt-layout-1550: calc(var(--dt-layout-base) * 15.5); /* 992px */
|