@planningcenter/tapestry 3.0.0-rc.20 → 3.0.0-rc.21
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/dist/components/page-header/index.js +1 -1
- package/dist/components/sidenav/index.js +1 -1
- package/dist/index.css +88 -88
- package/dist/index.css.map +1 -1
- package/dist/print-no-media-queries.css +2 -0
- package/dist/print.css +2 -0
- package/dist/reactRender.css +520 -520
- package/dist/reactRender.css.map +1 -1
- package/dist/reactRenderLegacy.css +520 -520
- package/dist/reactRenderLegacy.css.map +1 -1
- package/dist/tapestry-wc/dist/components/{p-9PkglV2P.js → p-C5iSF06Y.js} +3 -3
- package/dist/tapestry-wc/dist/components/{p-9PkglV2P.js.map → p-C5iSF06Y.js.map} +1 -1
- package/dist/tapestry-wc/dist/components/{p-DxkrfsDr.js → p-COVN81zG.js} +3 -3
- package/dist/tapestry-wc/dist/components/{p-DxkrfsDr.js.map → p-COVN81zG.js.map} +1 -1
- package/dist/tapestry-wc/dist/components/{p-DntE3Ce_.js → p-CT_FL8wQ.js} +3 -3
- package/dist/tapestry-wc/dist/components/{p-DntE3Ce_.js.map → p-CT_FL8wQ.js.map} +1 -1
- package/dist/tapestry-wc/dist/components/{p-Cfwcrohl.js → p-CsShT-kz.js} +2 -2
- package/dist/tapestry-wc/dist/components/{p-Cfwcrohl.js.map → p-CsShT-kz.js.map} +1 -1
- package/dist/tapestry-wc/dist/components/{p-C4dGV2h9.js → p-f6le2JgV.js} +2 -2
- package/dist/tapestry-wc/dist/components/{p-C4dGV2h9.js.map → p-f6le2JgV.js.map} +1 -1
- package/dist/tapestry-wc/dist/components/tds-page-header-nav.js +2 -2
- package/dist/tapestry-wc/dist/components/tds-page-header-nav.js.map +1 -1
- package/dist/tapestry-wc/dist/components/tds-page-header.js +3 -3
- package/dist/tapestry-wc/dist/components/tds-page-header.js.map +1 -1
- package/dist/tapestry-wc/dist/components/tds-sidenav-item.js +3 -3
- package/dist/tapestry-wc/dist/components/tds-sidenav-item.js.map +1 -1
- package/dist/tapestry-wc/dist/components/tds-sidenav-responsive-header.js +2 -2
- package/dist/tapestry-wc/dist/components/tds-sidenav-responsive-header.js.map +1 -1
- package/dist/tapestry-wc/dist/components/tds-sidenav-section.js +3 -3
- package/dist/tapestry-wc/dist/components/tds-sidenav-section.js.map +1 -1
- package/dist/tapestry-wc/dist/components/tds-sidenav.js +5 -5
- package/dist/tapestry-wc/dist/components/tds-sidenav.js.map +1 -1
- package/dist/unstable.css +100 -100
- package/dist/unstable.css.map +1 -1
- package/package.json +3 -3
package/dist/unstable.css
CHANGED
|
@@ -9,25 +9,25 @@
|
|
|
9
9
|
--tds-checkbox-input-border-color:var(--t-border-color-control-neutral);
|
|
10
10
|
--tds-checkbox-input-background-color:transparent;
|
|
11
11
|
--tds-checkbox-input-border-color-hover:var(--t-border-color-button-info);
|
|
12
|
-
--tds-checkbox-input-background-color-hover:var(--t-fill-color-button-interaction-outline-
|
|
12
|
+
--tds-checkbox-input-background-color-hover:var(--t-fill-color-button-interaction-outline-hover);
|
|
13
13
|
--tds-checkbox-input-border-color-checked:var(--t-border-color-control-info);
|
|
14
|
-
--tds-checkbox-input-background-color-checked:var(--t-fill-color-control
|
|
14
|
+
--tds-checkbox-input-background-color-checked:var(--t-fill-color-control);
|
|
15
15
|
--tds-checkbox-input-border-color-disabled:var(--t-border-color-control-disabled);
|
|
16
16
|
--tds-checkbox-input-background-color-disabled:var(--t-fill-color-neutral-070);
|
|
17
17
|
|
|
18
18
|
--tds-checkbox-input-icon:none;
|
|
19
19
|
--tds-checkbox-input-icon-visibility:hidden;
|
|
20
20
|
--tds-checkbox-input-icon-opacity:0;
|
|
21
|
-
--tds-checkbox-input-icon-fill:var(--t-icon-color-
|
|
21
|
+
--tds-checkbox-input-icon-fill:var(--t-icon-color-inverted);
|
|
22
22
|
--tds-checkbox-input-icon-checked:url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik02LjUwMjAxIDExLjQyOTNMMy42NzM3NCA4LjM5MkMzLjUxNjE2IDguMjI0ODkgMy41MTYxNiA3Ljk1Mjg5IDMuNjczNzQgNy43ODRMNC4yNDUwNSA3LjE3Njg5QzQuNDAyNjIgNy4wMDk3OCA0LjY1ODc4IDcuMDA5NzggNC44MTYzNiA3LjE3Njg5TDYuNzg4MDcgOS4zMDMxMUwxMS4xODMyIDQuNTY5NzhDMTEuMzQwOCA0LjQwMjY2IDExLjU5NjkgNC40MDI2NiAxMS43NTQ1IDQuNTY5NzhMMTIuMzI1OCA1LjE3Nzc4QzEyLjQ4MzQgNS4zNDQ4OSAxMi40ODM0IDUuNjE3NzggMTIuMzI1OCA1Ljc4NEw3LjA3MzMyIDExLjQyOTNDNi45MTU3NCAxMS41OTY0IDYuNjU5NTggMTEuNTk2NCA2LjUwMjAxIDExLjQyOTNaIiBmaWxsPSJ3aGl0ZSIvPgo8L3N2Zz4K");
|
|
23
23
|
--tds-checkbox-input-icon-indeterminate:url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHJlY3QgeD0iMy41NTU1NiIgeT0iNy4xMTExMSIgd2lkdGg9IjguODg4ODkiIGhlaWdodD0iMS43Nzc3OCIgcng9IjAuODg4ODg5IiBmaWxsPSJ3aGl0ZSIvPgo8L3N2Zz4K");
|
|
24
24
|
|
|
25
25
|
--tds-checkbox-font-size:var(--t-font-size-md);
|
|
26
|
-
--tds-checkbox-label-color:var(--t-text-color
|
|
26
|
+
--tds-checkbox-label-color:var(--t-text-color);
|
|
27
27
|
|
|
28
28
|
--tds-checkbox-description-font-size:var(--t-font-size-sm);
|
|
29
29
|
--tds-checkbox-description-line-height:1.35;
|
|
30
|
-
--tds-checkbox-description-color:var(--t-text-color-
|
|
30
|
+
--tds-checkbox-description-color:var(--t-text-color-secondary);
|
|
31
31
|
|
|
32
32
|
position:relative;
|
|
33
33
|
display:inline-grid;
|
|
@@ -61,7 +61,7 @@
|
|
|
61
61
|
appearance:none;
|
|
62
62
|
cursor:var(--tds-checkbox-cursor);
|
|
63
63
|
background-color:var(--tds-checkbox-input-background-color);
|
|
64
|
-
border:var(--t-border-width
|
|
64
|
+
border:var(--t-border-width) solid var(--tds-checkbox-input-border-color);
|
|
65
65
|
border-radius:var(--tds-checkbox-input-border-radius);
|
|
66
66
|
transition-timing-function:ease-in-out;
|
|
67
67
|
transition-duration:180ms;
|
|
@@ -108,13 +108,13 @@
|
|
|
108
108
|
:is(.tds-checkbox input[type="checkbox"]):disabled{
|
|
109
109
|
--tds-checkbox-input-background-color:var(--tds-checkbox-input-background-color-disabled);
|
|
110
110
|
--tds-checkbox-input-border-color:var(--tds-checkbox-input-border-color-disabled);
|
|
111
|
-
--tds-checkbox-input-icon-fill:var(--t-icon-color-
|
|
111
|
+
--tds-checkbox-input-icon-fill:var(--t-icon-color-disabled);
|
|
112
112
|
pointer-events:none;
|
|
113
113
|
}
|
|
114
114
|
|
|
115
115
|
.tds-checkbox:has(input:disabled){
|
|
116
|
-
--tds-checkbox-label-color:var(--t-text-color-
|
|
117
|
-
--tds-checkbox-description-color:var(--t-text-color-
|
|
116
|
+
--tds-checkbox-label-color:var(--t-text-color-disabled);
|
|
117
|
+
--tds-checkbox-description-color:var(--t-text-color-disabled);
|
|
118
118
|
--tds-checkbox-cursor:not-allowed;
|
|
119
119
|
--tds-checkbox-input-background-color-checked:var(--t-fill-color-control-disabled);
|
|
120
120
|
--tds-checkbox-input-border-color-checked:var(--tds-checkbox-input-border-color-disabled);
|
|
@@ -149,9 +149,9 @@
|
|
|
149
149
|
.tds-checkbox:has(input:invalid){
|
|
150
150
|
--tds-checkbox-input-border-color:var(--t-border-color-button-delete);
|
|
151
151
|
--tds-checkbox-input-border-color-hover:var(--t-border-color-button-delete);
|
|
152
|
-
--tds-checkbox-input-background-color-hover:var(--t-fill-color-button-delete-outline-
|
|
153
|
-
--tds-checkbox-input-border-color-checked:var(--t-fill-color-button-delete-solid
|
|
154
|
-
--tds-checkbox-input-background-color-checked:var(--t-fill-color-button-delete-solid
|
|
152
|
+
--tds-checkbox-input-background-color-hover:var(--t-fill-color-button-delete-outline-hover);
|
|
153
|
+
--tds-checkbox-input-border-color-checked:var(--t-fill-color-button-delete-solid);
|
|
154
|
+
--tds-checkbox-input-background-color-checked:var(--t-fill-color-button-delete-solid);
|
|
155
155
|
--tds-checkbox-description-color:var(--t-text-color-status-error);
|
|
156
156
|
}
|
|
157
157
|
|
|
@@ -1155,8 +1155,8 @@
|
|
|
1155
1155
|
.tds-page-header{
|
|
1156
1156
|
--tds-page-header-background-color:var(--t-fill-color-product-current-gradient-tint, var(--t-surface-color-canvas));
|
|
1157
1157
|
--tds-page-header-background-color-inactive:var(--t-fill-color-neutral-090);
|
|
1158
|
-
--tds-page-header-color:var(--t-text-color
|
|
1159
|
-
--tds-page-header-headline-color:var(--t-text-color-
|
|
1158
|
+
--tds-page-header-color:var(--t-text-color);
|
|
1159
|
+
--tds-page-header-headline-color:var(--t-text-color-headline);
|
|
1160
1160
|
--tds-page-header-headline-font-size:var(--t-font-size-2xl);
|
|
1161
1161
|
--tds-page-header-padding-x:var(--t-spacing-2);
|
|
1162
1162
|
--tds-page-header-padding-y:var(--t-spacing-2);
|
|
@@ -1165,29 +1165,29 @@
|
|
|
1165
1165
|
--tds-page-header-nav-background:linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, .1) 100%);
|
|
1166
1166
|
--tds-page-header-nav-item-padding-x:var(--t-spacing-1);
|
|
1167
1167
|
--tds-page-header-nav-item-padding-y:var(--t-spacing-1);
|
|
1168
|
-
--tds-page-header-nav-item-color:var(--t-text-color-
|
|
1168
|
+
--tds-page-header-nav-item-color:var(--t-text-color-secondary);
|
|
1169
1169
|
--tds-page-header-nav-item-background-color:var(--t-fill-color-transparency-light-060);
|
|
1170
1170
|
--tds-page-header-nav-item-border-width:1px;
|
|
1171
1171
|
|
|
1172
1172
|
--tds-page-header-nav-item-border-color:var(--tds-page-header-nav-item-background-color);
|
|
1173
|
-
--tds-page-header-nav-item-border-bottom-color:var(--t-border-color
|
|
1173
|
+
--tds-page-header-nav-item-border-bottom-color:var(--t-border-color);
|
|
1174
1174
|
|
|
1175
|
-
--tds-page-header-nav-item-color-hover:var(--t-text-color
|
|
1175
|
+
--tds-page-header-nav-item-color-hover:var(--t-text-color);
|
|
1176
1176
|
--tds-page-header-nav-item-background-color-hover:var(--t-fill-color-neutral-080);
|
|
1177
1177
|
--tds-page-header-nav-item-border-color-hover:var(--tds-page-header-nav-item-background-color-hover);
|
|
1178
1178
|
|
|
1179
1179
|
--tds-page-header-nav-item-background-color-active:var(--t-fill-color-neutral-060);
|
|
1180
1180
|
--tds-page-header-nav-item-border-color-active:var(--tds-page-header-nav-item-background-color-hover);
|
|
1181
1181
|
|
|
1182
|
-
--tds-page-header-nav-item-color-disabled:var(--t-text-color-
|
|
1182
|
+
--tds-page-header-nav-item-color-disabled:var(--t-text-color-disabled);
|
|
1183
1183
|
--tds-page-header-nav-item-background-color-disabled:var(--t-fill-color-neutral-080);
|
|
1184
1184
|
--tds-page-header-nav-item-border-color-disabled:var(--tds-page-header-nav-item-background-color-disabled);
|
|
1185
1185
|
|
|
1186
|
-
--tds-page-header-nav-item-color-selected:var(--t-text-color
|
|
1186
|
+
--tds-page-header-nav-item-color-selected:var(--t-text-color);
|
|
1187
1187
|
--tds-page-header-nav-item-background-color-selected:var(--t-surface-color-canvas);
|
|
1188
1188
|
--tds-page-header-nav-item-border-color-selected:var(--tds-page-header-nav-item-background-color-selected);
|
|
1189
1189
|
--tds-page-header-nav-item-border-bottom-color-selected:var(--tds-page-header-nav-item-background-color-selected);
|
|
1190
|
-
--tds-page-header-nav-item-indicator-color:var(--t-icon-color-status-warning
|
|
1190
|
+
--tds-page-header-nav-item-indicator-color:var(--t-icon-color-status-warning);
|
|
1191
1191
|
}
|
|
1192
1192
|
|
|
1193
1193
|
.tds-page-header--profile{
|
|
@@ -1196,16 +1196,16 @@
|
|
|
1196
1196
|
@media (min-width: 600px){
|
|
1197
1197
|
.tds-page-header{
|
|
1198
1198
|
--tds-page-header-background-color:var(--t-surface-color-canvas);
|
|
1199
|
-
--tds-page-header-color:var(--t-text-color-
|
|
1199
|
+
--tds-page-header-color:var(--t-text-color-secondary);
|
|
1200
1200
|
--tds-page-header-padding-x:var(--t-spacing-3);
|
|
1201
1201
|
--tds-page-header-headline-font-size:var(--t-font-size-3xl);
|
|
1202
1202
|
--tds-page-header-nav-gap:var(--t-spacing-half);
|
|
1203
1203
|
--tds-page-header-nav-background:transparent;
|
|
1204
1204
|
--tds-page-header-nav-item-padding-x:var(--t-spacing-2);
|
|
1205
1205
|
--tds-page-header-nav-item-border-width:1px;
|
|
1206
|
-
--tds-page-header-nav-item-color:var(--t-text-color
|
|
1206
|
+
--tds-page-header-nav-item-color:var(--t-text-color);
|
|
1207
1207
|
--tds-page-header-nav-item-background-color:var(--t-fill-color-neutral-070);
|
|
1208
|
-
--tds-page-header-nav-item-border-color-selected:var(--t-border-color
|
|
1208
|
+
--tds-page-header-nav-item-border-color-selected:var(--t-border-color);
|
|
1209
1209
|
}
|
|
1210
1210
|
}
|
|
1211
1211
|
}
|
|
@@ -1216,7 +1216,7 @@
|
|
|
1216
1216
|
padding-top:var(--tds-page-header-padding-y);
|
|
1217
1217
|
color:var(--tds-page-header-color);
|
|
1218
1218
|
background:var(--tds-page-header-background-color);
|
|
1219
|
-
border-bottom:1px solid var(--t-border-color
|
|
1219
|
+
border-bottom:1px solid var(--t-border-color);
|
|
1220
1220
|
}
|
|
1221
1221
|
|
|
1222
1222
|
.tds-page-header:not(.has-nav){
|
|
@@ -1444,8 +1444,8 @@
|
|
|
1444
1444
|
--tds-sidenav-item-nested-border-color-hover:var(--t-fill-color-neutral-050);
|
|
1445
1445
|
--tds-sidenav-item-nested-border-color-selected:var(--t-border-color-status-info);
|
|
1446
1446
|
|
|
1447
|
-
--tds-sidenav-item-icon-color:var(--t-icon-color-
|
|
1448
|
-
--tds-sidenav-item-icon-color-selected:var(--t-icon-color
|
|
1447
|
+
--tds-sidenav-item-icon-color:var(--t-icon-color-secondary);
|
|
1448
|
+
--tds-sidenav-item-icon-color-selected:var(--t-icon-color);
|
|
1449
1449
|
}
|
|
1450
1450
|
|
|
1451
1451
|
.tds-sidenav--theme-gray{
|
|
@@ -1486,7 +1486,7 @@
|
|
|
1486
1486
|
font-size:var(--t-font-size-sm);
|
|
1487
1487
|
font-weight:var(--t-font-weight-semibold);
|
|
1488
1488
|
line-height:1.35;
|
|
1489
|
-
color:var(--t-text-color-
|
|
1489
|
+
color:var(--t-text-color-secondary);
|
|
1490
1490
|
text-transform:uppercase;
|
|
1491
1491
|
}
|
|
1492
1492
|
|
|
@@ -1525,7 +1525,7 @@
|
|
|
1525
1525
|
overflow:hidden;
|
|
1526
1526
|
font-size:var(--t-font-size-sm);
|
|
1527
1527
|
line-height:18px;
|
|
1528
|
-
color:var(--t-text-color-
|
|
1528
|
+
color:var(--t-text-color-headline);
|
|
1529
1529
|
white-space:nowrap;
|
|
1530
1530
|
text-decoration:none;
|
|
1531
1531
|
-webkit-appearance:none;
|
|
@@ -1534,7 +1534,7 @@
|
|
|
1534
1534
|
cursor:pointer;
|
|
1535
1535
|
background-color:var(--tds-sidenav-item-background, transparent);
|
|
1536
1536
|
border:0;
|
|
1537
|
-
border-radius:var(--t-border-radius
|
|
1537
|
+
border-radius:var(--t-border-radius);
|
|
1538
1538
|
transition:var(--tds-sidenav-item-transition);
|
|
1539
1539
|
}
|
|
1540
1540
|
|
|
@@ -1549,7 +1549,7 @@
|
|
|
1549
1549
|
|
|
1550
1550
|
:is(.tds-sidenav-item :is(a,button)):hover,:is(.tds-sidenav-item :is(a,button)):focus-visible{
|
|
1551
1551
|
--tds-sidenav-item-background:var(--tds-sidenav-item-background-hover);
|
|
1552
|
-
color:var(--t-text-color-
|
|
1552
|
+
color:var(--t-text-color-headline);
|
|
1553
1553
|
text-decoration:none;
|
|
1554
1554
|
}
|
|
1555
1555
|
|
|
@@ -1635,7 +1635,7 @@
|
|
|
1635
1635
|
height:100%;
|
|
1636
1636
|
content:"";
|
|
1637
1637
|
background-color:var(--tds-sidenav-item-nested-background);
|
|
1638
|
-
border-radius:0 var(--t-border-radius
|
|
1638
|
+
border-radius:0 var(--t-border-radius) var(--t-border-radius) 0;
|
|
1639
1639
|
transition:var(--tds-sidenav-item-transition);
|
|
1640
1640
|
}
|
|
1641
1641
|
|
|
@@ -1676,7 +1676,7 @@
|
|
|
1676
1676
|
margin:0;
|
|
1677
1677
|
font-size:var(--t-font-size-lg);
|
|
1678
1678
|
font-weight:var(--t-font-weight-medium);
|
|
1679
|
-
color:var(--t-text-color-
|
|
1679
|
+
color:var(--t-text-color-headline);
|
|
1680
1680
|
}
|
|
1681
1681
|
|
|
1682
1682
|
@media (max-width: 719px){
|
|
@@ -1755,9 +1755,9 @@ tds-sidenav-section:not(.hydrated) > [slot="ssr"]{
|
|
|
1755
1755
|
--tds-btn-font-size:16px;
|
|
1756
1756
|
--tds-btn-font-weight:400;
|
|
1757
1757
|
--tds-btn-line-height:1.5;
|
|
1758
|
-
--tds-btn-color:var(--t-text-color-
|
|
1758
|
+
--tds-btn-color:var(--t-text-color-headline);
|
|
1759
1759
|
--tds-btn-bg:transparent;
|
|
1760
|
-
--tds-btn-border-width:var(--t-border-width
|
|
1760
|
+
--tds-btn-border-width:var(--t-border-width);
|
|
1761
1761
|
--tds-btn-border-color:transparent;
|
|
1762
1762
|
--tds-btn-border-radius:var(--t-border-radius-md);
|
|
1763
1763
|
--tds-btn-border-color-hover:transparent;
|
|
@@ -1885,15 +1885,15 @@ tds-sidenav-section:not(.hydrated) > [slot="ssr"]{
|
|
|
1885
1885
|
|
|
1886
1886
|
.tds-btn--neutral{
|
|
1887
1887
|
--tds-btn-color:var(--t-text-color-status-neutral);
|
|
1888
|
-
--tds-btn-bg:var(--t-fill-color-button-neutral-solid
|
|
1889
|
-
--tds-btn-border-color:var(--t-fill-color-button-neutral-solid
|
|
1888
|
+
--tds-btn-bg:var(--t-fill-color-button-neutral-solid);
|
|
1889
|
+
--tds-btn-border-color:var(--t-fill-color-button-neutral-solid);
|
|
1890
1890
|
--tds-btn-color-hover:var(--t-text-color-status-neutral);
|
|
1891
1891
|
--tds-btn-bg-hover:var(--t-fill-color-button-neutral-solid-hover);
|
|
1892
1892
|
--tds-btn-border-color-hover:var(--t-fill-color-button-neutral-solid-hover);
|
|
1893
1893
|
--tds-btn-color-active:var(--t-text-color-status-neutral);
|
|
1894
1894
|
--tds-btn-bg-active:var(--t-fill-color-button-neutral-solid-active);
|
|
1895
1895
|
--tds-btn-border-color-active:var(--t-fill-color-button-neutral-solid-active);
|
|
1896
|
-
--tds-btn-color-disabled:var(--t-text-color-
|
|
1896
|
+
--tds-btn-color-disabled:var(--t-text-color-disabled);
|
|
1897
1897
|
--tds-btn-bg-disabled:var(--t-fill-color-button-neutral-solid-disabled);
|
|
1898
1898
|
--tds-btn-border-color-disabled:var(--t-fill-color-button-neutral-solid-disabled);
|
|
1899
1899
|
}
|
|
@@ -1923,32 +1923,32 @@ tds-sidenav-section:not(.hydrated) > [slot="ssr"]{
|
|
|
1923
1923
|
}
|
|
1924
1924
|
|
|
1925
1925
|
.tds-btn--interaction{
|
|
1926
|
-
--tds-btn-color:var(--t-text-color-
|
|
1927
|
-
--tds-btn-bg:var(--t-fill-color-button-interaction-solid
|
|
1928
|
-
--tds-btn-border-color:var(--t-fill-color-button-interaction-solid
|
|
1929
|
-
--tds-btn-color-hover:var(--t-text-color-
|
|
1926
|
+
--tds-btn-color:var(--t-text-color-inverted);
|
|
1927
|
+
--tds-btn-bg:var(--t-fill-color-button-interaction-solid);
|
|
1928
|
+
--tds-btn-border-color:var(--t-fill-color-button-interaction-solid);
|
|
1929
|
+
--tds-btn-color-hover:var(--t-text-color-inverted);
|
|
1930
1930
|
--tds-btn-bg-hover:var(--t-fill-color-button-interaction-solid-hover);
|
|
1931
1931
|
--tds-btn-border-color-hover:var(--t-fill-color-button-interaction-solid-hover);
|
|
1932
|
-
--tds-btn-color-active:var(--t-text-color-
|
|
1932
|
+
--tds-btn-color-active:var(--t-text-color-inverted);
|
|
1933
1933
|
--tds-btn-bg-active:var(--t-fill-color-button-interaction-solid-active);
|
|
1934
1934
|
--tds-btn-border-color-active:var(--t-fill-color-button-interaction-solid-active);
|
|
1935
|
-
--tds-btn-color-disabled:var(--t-text-color-
|
|
1935
|
+
--tds-btn-color-disabled:var(--t-text-color-disabled);
|
|
1936
1936
|
--tds-btn-bg-disabled:var(--t-fill-color-button-interaction-solid-disabled);
|
|
1937
1937
|
--tds-btn-border-color-disabled:var(--tds-btn-bg-disabled);
|
|
1938
1938
|
--tds-btn-loading-spinner-track-color:var(--t-fill-color-transparency-light-020);
|
|
1939
1939
|
}
|
|
1940
1940
|
|
|
1941
1941
|
.tds-btn--delete{
|
|
1942
|
-
--tds-btn-color:var(--t-text-color-
|
|
1943
|
-
--tds-btn-bg:var(--t-fill-color-button-delete-solid
|
|
1944
|
-
--tds-btn-border-color:var(--t-fill-color-button-delete-solid
|
|
1945
|
-
--tds-btn-color-hover:var(--t-text-color-
|
|
1942
|
+
--tds-btn-color:var(--t-text-color-inverted);
|
|
1943
|
+
--tds-btn-bg:var(--t-fill-color-button-delete-solid);
|
|
1944
|
+
--tds-btn-border-color:var(--t-fill-color-button-delete-solid);
|
|
1945
|
+
--tds-btn-color-hover:var(--t-text-color-inverted);
|
|
1946
1946
|
--tds-btn-bg-hover:var(--t-fill-color-button-delete-solid-hover);
|
|
1947
1947
|
--tds-btn-border-color-hover:var(--t-fill-color-button-delete-solid-hover);
|
|
1948
|
-
--tds-btn-color-active:var(--t-text-color-
|
|
1948
|
+
--tds-btn-color-active:var(--t-text-color-inverted);
|
|
1949
1949
|
--tds-btn-bg-active:var(--t-fill-color-button-delete-solid-active);
|
|
1950
1950
|
--tds-btn-border-color-active:var(--t-fill-color-button-delete-solid-active);
|
|
1951
|
-
--tds-btn-color-disabled:var(--t-text-color-
|
|
1951
|
+
--tds-btn-color-disabled:var(--t-text-color-disabled);
|
|
1952
1952
|
--tds-btn-bg-disabled:var(--t-fill-color-button-delete-solid-disabled);
|
|
1953
1953
|
--tds-btn-border-color-disabled:var(--tds-btn-bg-disabled);
|
|
1954
1954
|
--tds-btn-loading-spinner-track-color:var(--t-fill-color-transparency-light-020);
|
|
@@ -1958,27 +1958,27 @@ tds-sidenav-section:not(.hydrated) > [slot="ssr"]{
|
|
|
1958
1958
|
--tds-btn-color:var(--t-text-color-status-neutral);
|
|
1959
1959
|
--tds-btn-border-color:var(--t-border-color-button-neutral);
|
|
1960
1960
|
--tds-btn-color-hover:var(--tds-btn-color);
|
|
1961
|
-
--tds-btn-bg-hover:var(--t-fill-color-button-neutral-outline-
|
|
1961
|
+
--tds-btn-bg-hover:var(--t-fill-color-button-neutral-outline-hover);
|
|
1962
1962
|
--tds-btn-border-color-hover:var(--t-border-color-button-neutral);
|
|
1963
1963
|
--tds-btn-color-active:var(--tds-btn-color);
|
|
1964
|
-
--tds-btn-bg-active:var(--t-fill-color-button-neutral-outline-
|
|
1964
|
+
--tds-btn-bg-active:var(--t-fill-color-button-neutral-outline-active);
|
|
1965
1965
|
--tds-btn-border-color-active:var(--t-border-color-button-neutral);
|
|
1966
|
-
--tds-btn-color-disabled:var(--t-text-color-
|
|
1967
|
-
--tds-btn-bg-disabled:var(--t-fill-color-button-neutral-outline-
|
|
1966
|
+
--tds-btn-color-disabled:var(--t-text-color-disabled);
|
|
1967
|
+
--tds-btn-bg-disabled:var(--t-fill-color-button-neutral-outline-disabled);
|
|
1968
1968
|
--tds-btn-border-color-disabled:var(--t-border-color-button-neutral);
|
|
1969
1969
|
}
|
|
1970
1970
|
|
|
1971
1971
|
.tds-btn--outline-interaction{
|
|
1972
|
-
--tds-btn-color:var(--t-text-color-interaction
|
|
1972
|
+
--tds-btn-color:var(--t-text-color-interaction);
|
|
1973
1973
|
--tds-btn-border-color:var(--t-border-color-button-info);
|
|
1974
1974
|
--tds-btn-color-hover:var(--tds-btn-color);
|
|
1975
|
-
--tds-btn-bg-hover:var(--t-fill-color-button-interaction-outline-
|
|
1975
|
+
--tds-btn-bg-hover:var(--t-fill-color-button-interaction-outline-hover);
|
|
1976
1976
|
--tds-btn-border-color-hover:var(--tds-btn-border-color);
|
|
1977
1977
|
--tds-btn-color-active:var(--tds-btn-color);
|
|
1978
|
-
--tds-btn-bg-active:var(--t-fill-color-button-interaction-outline-
|
|
1978
|
+
--tds-btn-bg-active:var(--t-fill-color-button-interaction-outline-active);
|
|
1979
1979
|
--tds-btn-border-color-active:var(--tds-btn-border-color);
|
|
1980
|
-
--tds-btn-color-disabled:var(--t-text-color-
|
|
1981
|
-
--tds-btn-bg-disabled:var(--t-fill-color-button-interaction-outline-
|
|
1980
|
+
--tds-btn-color-disabled:var(--t-text-color-disabled);
|
|
1981
|
+
--tds-btn-bg-disabled:var(--t-fill-color-button-interaction-outline-disabled);
|
|
1982
1982
|
--tds-btn-border-color-disabled:var(--t-border-color-button-neutral);
|
|
1983
1983
|
--tds-btn-loading-spinner-track-color:var(--t-fill-color-status-info-ghost);
|
|
1984
1984
|
}
|
|
@@ -1987,13 +1987,13 @@ tds-sidenav-section:not(.hydrated) > [slot="ssr"]{
|
|
|
1987
1987
|
--tds-btn-color:var(--t-text-color-status-error);
|
|
1988
1988
|
--tds-btn-border-color:var(--t-border-color-button-delete);
|
|
1989
1989
|
--tds-btn-color-hover:var(--tds-btn-color);
|
|
1990
|
-
--tds-btn-bg-hover:var(--t-fill-color-button-delete-outline-
|
|
1990
|
+
--tds-btn-bg-hover:var(--t-fill-color-button-delete-outline-hover);
|
|
1991
1991
|
--tds-btn-border-color-hover:var(--tds-btn-border-color);
|
|
1992
1992
|
--tds-btn-color-active:var(--tds-btn-color);
|
|
1993
|
-
--tds-btn-bg-active:var(--t-fill-color-button-delete-outline-
|
|
1993
|
+
--tds-btn-bg-active:var(--t-fill-color-button-delete-outline-active);
|
|
1994
1994
|
--tds-btn-border-color-active:var(--tds-btn-border-color);
|
|
1995
|
-
--tds-btn-color-disabled:var(--t-text-color-
|
|
1996
|
-
--tds-btn-bg-disabled:var(--t-fill-color-button-delete-outline-
|
|
1995
|
+
--tds-btn-color-disabled:var(--t-text-color-disabled);
|
|
1996
|
+
--tds-btn-bg-disabled:var(--t-fill-color-button-delete-outline-disabled);
|
|
1997
1997
|
--tds-btn-border-color-disabled:var(--t-border-color-button-neutral);
|
|
1998
1998
|
--tds-btn-loading-spinner-track-color:var(--t-fill-color-status-error-ghost);
|
|
1999
1999
|
}
|
|
@@ -2002,26 +2002,26 @@ tds-sidenav-section:not(.hydrated) > [slot="ssr"]{
|
|
|
2002
2002
|
--tds-btn-color:var(--t-text-color-status-neutral);
|
|
2003
2003
|
--tds-btn-border-color:transparent;
|
|
2004
2004
|
--tds-btn-color-hover:var(--tds-btn-color);
|
|
2005
|
-
--tds-btn-bg-hover:var(--t-fill-color-button-neutral-outline-
|
|
2005
|
+
--tds-btn-bg-hover:var(--t-fill-color-button-neutral-outline-hover);
|
|
2006
2006
|
--tds-btn-border-color-hover:var(--tds-btn-bg-hover);
|
|
2007
2007
|
--tds-btn-color-active:var(--tds-btn-color);
|
|
2008
|
-
--tds-btn-bg-active:var(--t-fill-color-button-neutral-outline-
|
|
2008
|
+
--tds-btn-bg-active:var(--t-fill-color-button-neutral-outline-active);
|
|
2009
2009
|
--tds-btn-border-color-active:var(--tds-btn-bg-active);
|
|
2010
|
-
--tds-btn-color-disabled:var(--t-text-color-
|
|
2010
|
+
--tds-btn-color-disabled:var(--t-text-color-disabled);
|
|
2011
2011
|
--tds-btn-bg-disabled:transparent;
|
|
2012
2012
|
--tds-btn-border-color-disabled:transparent;
|
|
2013
2013
|
}
|
|
2014
2014
|
|
|
2015
2015
|
.tds-btn--ghost-interaction{
|
|
2016
|
-
--tds-btn-color:var(--t-text-color-interaction
|
|
2016
|
+
--tds-btn-color:var(--t-text-color-interaction);
|
|
2017
2017
|
--tds-btn-border-color:transparent;
|
|
2018
2018
|
--tds-btn-color-hover:var(--tds-btn-color);
|
|
2019
|
-
--tds-btn-bg-hover:var(--t-fill-color-button-interaction-outline-
|
|
2019
|
+
--tds-btn-bg-hover:var(--t-fill-color-button-interaction-outline-hover);
|
|
2020
2020
|
--tds-btn-border-color-hover:var(--tds-btn-bg-hover);
|
|
2021
2021
|
--tds-btn-color-active:var(--tds-btn-color);
|
|
2022
|
-
--tds-btn-bg-active:var(--t-fill-color-button-interaction-outline-
|
|
2022
|
+
--tds-btn-bg-active:var(--t-fill-color-button-interaction-outline-active);
|
|
2023
2023
|
--tds-btn-border-color-active:var(--tds-btn-bg-active);
|
|
2024
|
-
--tds-btn-color-disabled:var(--t-text-color-
|
|
2024
|
+
--tds-btn-color-disabled:var(--t-text-color-disabled);
|
|
2025
2025
|
--tds-btn-bg-disabled:transparent;
|
|
2026
2026
|
--tds-btn-border-color-disabled:transparent;
|
|
2027
2027
|
--tds-btn-loading-spinner-track-color:var(--t-fill-color-status-info-ghost);
|
|
@@ -2031,12 +2031,12 @@ tds-sidenav-section:not(.hydrated) > [slot="ssr"]{
|
|
|
2031
2031
|
--tds-btn-color:var(--t-text-color-status-error);
|
|
2032
2032
|
--tds-btn-border-color:transparent;
|
|
2033
2033
|
--tds-btn-color-hover:var(--tds-btn-color);
|
|
2034
|
-
--tds-btn-bg-hover:var(--t-fill-color-button-delete-outline-
|
|
2034
|
+
--tds-btn-bg-hover:var(--t-fill-color-button-delete-outline-hover);
|
|
2035
2035
|
--tds-btn-border-color-hover:var(--tds-btn-bg-hover);
|
|
2036
2036
|
--tds-btn-color-active:var(--tds-btn-color);
|
|
2037
|
-
--tds-btn-bg-active:var(--t-fill-color-button-delete-outline-
|
|
2037
|
+
--tds-btn-bg-active:var(--t-fill-color-button-delete-outline-active);
|
|
2038
2038
|
--tds-btn-border-color-active:var(--tds-btn-bg-active);
|
|
2039
|
-
--tds-btn-color-disabled:var(--t-text-color-
|
|
2039
|
+
--tds-btn-color-disabled:var(--t-text-color-disabled);
|
|
2040
2040
|
--tds-btn-bg-disabled:transparent;
|
|
2041
2041
|
--tds-btn-border-color-disabled:transparent;
|
|
2042
2042
|
--tds-btn-loading-spinner-track-color:var(--t-fill-color-status-error-ghost);
|
|
@@ -2044,7 +2044,7 @@ tds-sidenav-section:not(.hydrated) > [slot="ssr"]{
|
|
|
2044
2044
|
|
|
2045
2045
|
.tds-btn--inline-text,
|
|
2046
2046
|
a[class="tds-btn"]{
|
|
2047
|
-
--tds-btn-color:var(--t-text-color-interaction
|
|
2047
|
+
--tds-btn-color:var(--t-text-color-interaction);
|
|
2048
2048
|
--tds-btn-color-hover:var(--t-text-color-interaction-hover);
|
|
2049
2049
|
--tds-btn-color-active:var(--t-text-color-interaction-active);
|
|
2050
2050
|
--tds-btn-bg:transparent;
|
|
@@ -2069,16 +2069,16 @@ a[class="tds-btn"]{
|
|
|
2069
2069
|
}
|
|
2070
2070
|
|
|
2071
2071
|
.tds-btn--primary-page-header{
|
|
2072
|
-
--tds-btn-color:var(--t-text-color-
|
|
2073
|
-
--tds-btn-bg:var(--t-fill-color-button-interaction-solid
|
|
2074
|
-
--tds-btn-border-color:var(--t-fill-color-button-interaction-solid
|
|
2075
|
-
--tds-btn-color-hover:var(--t-text-color-
|
|
2072
|
+
--tds-btn-color:var(--t-text-color-inverted);
|
|
2073
|
+
--tds-btn-bg:var(--t-fill-color-button-interaction-solid);
|
|
2074
|
+
--tds-btn-border-color:var(--t-fill-color-button-interaction-solid);
|
|
2075
|
+
--tds-btn-color-hover:var(--t-text-color-inverted);
|
|
2076
2076
|
--tds-btn-bg-hover:var(--t-fill-color-button-interaction-solid-hover);
|
|
2077
2077
|
--tds-btn-border-color-hover:var(--t-fill-color-button-interaction-solid-hover);
|
|
2078
|
-
--tds-btn-color-active:var(--t-text-color-
|
|
2078
|
+
--tds-btn-color-active:var(--t-text-color-inverted);
|
|
2079
2079
|
--tds-btn-bg-active:var(--t-fill-color-button-interaction-solid-active);
|
|
2080
2080
|
--tds-btn-border-color-active:var(--t-fill-color-button-interaction-solid-active);
|
|
2081
|
-
--tds-btn-color-disabled:var(--t-text-color-
|
|
2081
|
+
--tds-btn-color-disabled:var(--t-text-color-disabled);
|
|
2082
2082
|
--tds-btn-bg-disabled:var(--t-fill-color-button-interaction-solid-disabled);
|
|
2083
2083
|
--tds-btn-border-color-disabled:var(--tds-btn-bg-disabled);
|
|
2084
2084
|
--tds-btn-loading-spinner-track-color:var(--t-fill-color-transparency-light-020);
|
|
@@ -2086,15 +2086,15 @@ a[class="tds-btn"]{
|
|
|
2086
2086
|
|
|
2087
2087
|
.tds-btn--secondary-page-header{
|
|
2088
2088
|
--tds-btn-color:var(--t-text-color-status-neutral);
|
|
2089
|
-
--tds-btn-bg:var(--t-fill-color-button-neutral-responsive-header
|
|
2090
|
-
--tds-btn-border-color:var(--t-fill-color-button-neutral-responsive-header
|
|
2089
|
+
--tds-btn-bg:var(--t-fill-color-button-neutral-responsive-header);
|
|
2090
|
+
--tds-btn-border-color:var(--t-fill-color-button-neutral-responsive-header);
|
|
2091
2091
|
--tds-btn-color-hover:var(--t-text-color-status-neutral);
|
|
2092
2092
|
--tds-btn-bg-hover:var(--t-fill-color-button-neutral-responsive-header-hover);
|
|
2093
2093
|
--tds-btn-border-color-hover:var(--t-fill-color-button-neutral-responsive-header-hover);
|
|
2094
2094
|
--tds-btn-color-active:var(--t-text-color-status-neutral);
|
|
2095
2095
|
--tds-btn-bg-active:var(--t-fill-color-button-neutral-responsive-header-active);
|
|
2096
2096
|
--tds-btn-border-color-active:var(--t-fill-color-button-neutral-responsive-header-active);
|
|
2097
|
-
--tds-btn-color-disabled:var(--t-text-color-
|
|
2097
|
+
--tds-btn-color-disabled:var(--t-text-color-disabled);
|
|
2098
2098
|
--tds-btn-bg-disabled:var(--t-fill-color-button-neutral-responsive-header-disabled);
|
|
2099
2099
|
--tds-btn-border-color-disabled:var(--t-fill-color-button-neutral-responsive-header-disabled);
|
|
2100
2100
|
}
|
|
@@ -2106,28 +2106,28 @@ a[class="tds-btn"]{
|
|
|
2106
2106
|
--tds-btn-bg:transparent;
|
|
2107
2107
|
--tds-btn-border-color:var(--t-border-color-button-neutral);
|
|
2108
2108
|
--tds-btn-color-hover:var(--tds-btn-color);
|
|
2109
|
-
--tds-btn-bg-hover:var(--t-fill-color-button-neutral-outline-
|
|
2109
|
+
--tds-btn-bg-hover:var(--t-fill-color-button-neutral-outline-hover);
|
|
2110
2110
|
--tds-btn-border-color-hover:var(--t-border-color-button-neutral);
|
|
2111
2111
|
--tds-btn-color-active:var(--tds-btn-color);
|
|
2112
|
-
--tds-btn-bg-active:var(--t-fill-color-button-neutral-outline-
|
|
2112
|
+
--tds-btn-bg-active:var(--t-fill-color-button-neutral-outline-active);
|
|
2113
2113
|
--tds-btn-border-color-active:var(--t-border-color-button-neutral);
|
|
2114
|
-
--tds-btn-color-disabled:var(--t-text-color-
|
|
2115
|
-
--tds-btn-bg-disabled:var(--t-fill-color-button-neutral-outline-
|
|
2114
|
+
--tds-btn-color-disabled:var(--t-text-color-disabled);
|
|
2115
|
+
--tds-btn-bg-disabled:var(--t-fill-color-button-neutral-outline-disabled);
|
|
2116
2116
|
--tds-btn-border-color-disabled:var(--t-border-color-button-neutral);
|
|
2117
2117
|
}
|
|
2118
2118
|
}
|
|
2119
2119
|
|
|
2120
2120
|
.tds-btn--staff-only{
|
|
2121
|
-
--tds-btn-color:var(--t-text-color-
|
|
2122
|
-
--tds-btn-bg:var(--t-fill-color-product-staff
|
|
2123
|
-
--tds-btn-border-color:var(--t-border-color-
|
|
2124
|
-
--tds-btn-color-hover:var(--t-text-color-
|
|
2121
|
+
--tds-btn-color:var(--t-text-color-inverted);
|
|
2122
|
+
--tds-btn-bg:var(--t-fill-color-product-staff);
|
|
2123
|
+
--tds-btn-border-color:var(--t-border-color-white);
|
|
2124
|
+
--tds-btn-color-hover:var(--t-text-color-inverted);
|
|
2125
2125
|
--tds-btn-bg-hover:var(--t-fill-color-product-staff-dark);
|
|
2126
|
-
--tds-btn-border-color-hover:var(--t-border-color-
|
|
2127
|
-
--tds-btn-color-active:var(--t-text-color-
|
|
2126
|
+
--tds-btn-border-color-hover:var(--t-border-color-white);
|
|
2127
|
+
--tds-btn-color-active:var(--t-text-color-inverted);
|
|
2128
2128
|
--tds-btn-bg-active:var(--t-fill-color-product-staff-darker);
|
|
2129
|
-
--tds-btn-border-color-active:var(--t-border-color-
|
|
2130
|
-
--tds-btn-color-disabled:var(--t-text-color-
|
|
2129
|
+
--tds-btn-border-color-active:var(--t-border-color-white);
|
|
2130
|
+
--tds-btn-color-disabled:var(--t-text-color-disabled);
|
|
2131
2131
|
--tds-btn-bg-disabled:var(--t-fill-color-button-interaction-solid-disabled);
|
|
2132
2132
|
--tds-btn-border-color-disabled:var(--tds-btn-bg-disabled);
|
|
2133
2133
|
--tds-btn-loading-spinner-track-color:var(--t-fill-color-transparency-light-020);
|
|
@@ -2138,8 +2138,8 @@ a[class="tds-btn"]{
|
|
|
2138
2138
|
--tds-btn-padding-y:4px;
|
|
2139
2139
|
--tds-btn-padding-x:13px;
|
|
2140
2140
|
|
|
2141
|
-
--tds-btn-color:var(--t-text-color
|
|
2142
|
-
--tds-btn-bg:var(--t-fill-color-button-pill
|
|
2141
|
+
--tds-btn-color:var(--t-text-color);
|
|
2142
|
+
--tds-btn-bg:var(--t-fill-color-button-pill);
|
|
2143
2143
|
--tds-btn-border-color:var(--tds-btn-bg);
|
|
2144
2144
|
--tds-btn-color-hover:var(--tds-btn-color);
|
|
2145
2145
|
--tds-btn-bg-hover:var(--t-fill-color-button-pill-hover);
|
|
@@ -2148,10 +2148,10 @@ a[class="tds-btn"]{
|
|
|
2148
2148
|
--tds-btn-color-active:var(--tds-btn-color);
|
|
2149
2149
|
--tds-btn-bg-active:var(--t-fill-color-button-pill-active);
|
|
2150
2150
|
--tds-btn-border-color-active:var(--tds-btn-bg-active);
|
|
2151
|
-
--tds-btn-color-disabled:var(--t-text-color-
|
|
2151
|
+
--tds-btn-color-disabled:var(--t-text-color-disabled);
|
|
2152
2152
|
--tds-btn-bg-disabled:var(--t-fill-color-button-neutral-solid-disabled);
|
|
2153
2153
|
--tds-btn-border-color-disabled:var(--t-fill-color-button-neutral-solid-disabled);
|
|
2154
|
-
--tds-btn-icon-color:var(--t-icon-color-
|
|
2154
|
+
--tds-btn-icon-color:var(--t-icon-color-secondary);
|
|
2155
2155
|
--tds-btn-min-height:32px;
|
|
2156
2156
|
}
|
|
2157
2157
|
|
|
@@ -2198,8 +2198,8 @@ a[class="tds-btn"]{
|
|
|
2198
2198
|
display:inline-block;
|
|
2199
2199
|
width:var(--tds-btn-attention-icon-size);
|
|
2200
2200
|
height:var(--tds-btn-attention-icon-size);
|
|
2201
|
-
background-color:var(--t-icon-color-status-warning
|
|
2202
|
-
border:.125em solid var(--t-border-color-
|
|
2201
|
+
background-color:var(--t-icon-color-status-warning);
|
|
2202
|
+
border:.125em solid var(--t-border-color-white);
|
|
2203
2203
|
border-radius:var(--t-border-radius-round);
|
|
2204
2204
|
}
|
|
2205
2205
|
|