@planningcenter/tapestry 2.8.0-rc.15 → 2.8.0-rc.17

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.
Files changed (33) hide show
  1. package/dist/components/page-header/index.js +1 -1
  2. package/dist/components/sidenav/index.js +1 -1
  3. package/dist/index.css +26 -10
  4. package/dist/index.css.map +1 -1
  5. package/dist/reactRender.css +26 -10
  6. package/dist/reactRender.css.map +1 -1
  7. package/dist/reactRenderLegacy.css +26 -10
  8. package/dist/reactRenderLegacy.css.map +1 -1
  9. package/dist/tapestry-wc/dist/components/{p-i6MOxNBO.js → p-B3jHYBD3.js} +3 -3
  10. package/dist/tapestry-wc/dist/components/{p-i6MOxNBO.js.map → p-B3jHYBD3.js.map} +1 -1
  11. package/dist/tapestry-wc/dist/components/{p-Bcr6lH9K.js → p-Bz_BJ8Aq.js} +2 -2
  12. package/dist/tapestry-wc/dist/components/{p-Bcr6lH9K.js.map → p-Bz_BJ8Aq.js.map} +1 -1
  13. package/dist/tapestry-wc/dist/components/{p-DfQpCk5x.js → p-CnV-xq_i.js} +3 -3
  14. package/dist/tapestry-wc/dist/components/{p-DfQpCk5x.js.map → p-CnV-xq_i.js.map} +1 -1
  15. package/dist/tapestry-wc/dist/components/{p-o1tW1kNf.js → p-N0hLNMYF.js} +3 -3
  16. package/dist/tapestry-wc/dist/components/{p-o1tW1kNf.js.map → p-N0hLNMYF.js.map} +1 -1
  17. package/dist/tapestry-wc/dist/components/{p-C_7pBu3k.js → p-tbjUSljS.js} +2 -2
  18. package/dist/tapestry-wc/dist/components/{p-C_7pBu3k.js.map → p-tbjUSljS.js.map} +1 -1
  19. package/dist/tapestry-wc/dist/components/tds-page-header-nav.js +2 -2
  20. package/dist/tapestry-wc/dist/components/tds-page-header-nav.js.map +1 -1
  21. package/dist/tapestry-wc/dist/components/tds-page-header.js +3 -3
  22. package/dist/tapestry-wc/dist/components/tds-page-header.js.map +1 -1
  23. package/dist/tapestry-wc/dist/components/tds-sidenav-item.js +3 -3
  24. package/dist/tapestry-wc/dist/components/tds-sidenav-item.js.map +1 -1
  25. package/dist/tapestry-wc/dist/components/tds-sidenav-responsive-header.js +2 -2
  26. package/dist/tapestry-wc/dist/components/tds-sidenav-responsive-header.js.map +1 -1
  27. package/dist/tapestry-wc/dist/components/tds-sidenav-section.js +3 -3
  28. package/dist/tapestry-wc/dist/components/tds-sidenav-section.js.map +1 -1
  29. package/dist/tapestry-wc/dist/components/tds-sidenav.js +5 -5
  30. package/dist/tapestry-wc/dist/components/tds-sidenav.js.map +1 -1
  31. package/dist/unstable.css +26 -10
  32. package/dist/unstable.css.map +1 -1
  33. package/package.json +4 -4
package/dist/unstable.css CHANGED
@@ -1170,31 +1170,32 @@
1170
1170
  --tds-page-header-background-color:var(--t-fill-color-product-current-gradient-tint, var(--t-surface-color-canvas));
1171
1171
  --tds-page-header-background-color-inactive:var(--t-fill-color-neutral-090);
1172
1172
  --tds-page-header-color:var(--t-text-color);
1173
+ --tds-page-header-bottom-border-color:var(--t-surface-color-canvas);
1173
1174
  --tds-page-header-headline-color:var(--t-text-color-headline);
1174
1175
  --tds-page-header-headline-font-size:var(--t-font-size-2xl);
1175
1176
  --tds-page-header-padding-x:var(--t-spacing-2);
1176
1177
  --tds-page-header-padding-y:var(--t-spacing-2);
1177
1178
  --tds-page-header-nav-padding-x:var(--tds-page-header-padding-x, var(--t-spacing-3));
1178
1179
  --tds-page-header-nav-gap:var(--t-spacing-1);
1179
- --tds-page-header-nav-background:linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, .1) 100%);
1180
+ --tds-page-header-nav-background:linear-gradient(180deg, var(--tds-page-header-nav-background-start, rgba(0, 0, 0, 0)) 0%, var(--tds-page-header-nav-background-end, rgba(0, 0, 0, .1)) 100%);
1180
1181
  --tds-page-header-nav-item-padding-x:var(--t-spacing-1);
1181
1182
  --tds-page-header-nav-item-padding-y:var(--t-spacing-1);
1182
1183
  --tds-page-header-nav-item-color:var(--t-text-color-secondary);
1183
- --tds-page-header-nav-item-background-color:var(--t-fill-color-transparency-light-060);
1184
+ --tds-page-header-nav-item-background-color:color-mix(in srgb, var(--t-surface-color-canvas) 100%, transparent 35%);
1184
1185
  --tds-page-header-nav-item-border-width:1px;
1185
1186
 
1186
1187
  --tds-page-header-nav-item-border-color:var(--tds-page-header-nav-item-background-color);
1187
- --tds-page-header-nav-item-border-bottom-color:var(--t-border-color);
1188
+ --tds-page-header-nav-item-border-bottom-color:var(--tds-page-header-bottom-border-color);
1188
1189
 
1189
1190
  --tds-page-header-nav-item-color-hover:var(--t-text-color);
1190
- --tds-page-header-nav-item-background-color-hover:var(--t-fill-color-neutral-080);
1191
+ --tds-page-header-nav-item-background-color-hover:color-mix(in srgb, var(--t-surface-color-canvas) 100%, transparent 20%);
1191
1192
  --tds-page-header-nav-item-border-color-hover:var(--tds-page-header-nav-item-background-color-hover);
1192
1193
 
1193
- --tds-page-header-nav-item-background-color-active:var(--t-fill-color-neutral-060);
1194
- --tds-page-header-nav-item-border-color-active:var(--tds-page-header-nav-item-background-color-hover);
1194
+ --tds-page-header-nav-item-background-color-active:color-mix(in srgb, var(--t-surface-color-canvas) 100%, transparent 10%);
1195
+ --tds-page-header-nav-item-border-color-active:var(--tds-page-header-nav-item-background-color-active);
1195
1196
 
1196
1197
  --tds-page-header-nav-item-color-disabled:var(--t-text-color-disabled);
1197
- --tds-page-header-nav-item-background-color-disabled:var(--t-fill-color-neutral-080);
1198
+ --tds-page-header-nav-item-background-color-disabled:color-mix(in srgb, var(--t-surface-color-canvas) 100%, transparent 50%);
1198
1199
  --tds-page-header-nav-item-border-color-disabled:var(--tds-page-header-nav-item-background-color-disabled);
1199
1200
 
1200
1201
  --tds-page-header-nav-item-color-selected:var(--t-text-color);
@@ -1207,10 +1208,19 @@
1207
1208
  .tds-page-header--profile{
1208
1209
  --tds-page-header-padding-y:20px;
1209
1210
  }
1211
+
1212
+ @supports (color: light-dark(#fff, #000)){
1213
+ .tds-page-header{
1214
+ --tds-page-header-nav-background-start:light-dark(rgba(0, 0, 0, 0), rgba(255, 255, 255, 0));
1215
+ --tds-page-header-nav-background-end:light-dark(rgba(0, 0, 0, .05), rgba(255, 255, 255, .1));
1216
+ }
1217
+ }
1218
+
1210
1219
  @media (min-width: 600px){
1211
1220
  .tds-page-header{
1212
1221
  --tds-page-header-background-color:var(--t-surface-color-canvas);
1213
1222
  --tds-page-header-color:var(--t-text-color-secondary);
1223
+ --tds-page-header-bottom-border-color:var(--t-border-color);
1214
1224
  --tds-page-header-padding-x:var(--t-spacing-3);
1215
1225
  --tds-page-header-headline-font-size:var(--t-font-size-3xl);
1216
1226
  --tds-page-header-nav-gap:var(--t-spacing-half);
@@ -1219,6 +1229,9 @@
1219
1229
  --tds-page-header-nav-item-border-width:1px;
1220
1230
  --tds-page-header-nav-item-color:var(--t-text-color);
1221
1231
  --tds-page-header-nav-item-background-color:var(--t-fill-color-neutral-070);
1232
+ --tds-page-header-nav-item-background-color-hover:var(--t-fill-color-neutral-060);
1233
+ --tds-page-header-nav-item-background-color-active:var(--t-fill-color-neutral-050);
1234
+ --tds-page-header-nav-item-background-color-disabled:var(--t-fill-color-neutral-080);
1222
1235
  --tds-page-header-nav-item-border-color-selected:var(--t-border-color);
1223
1236
  }
1224
1237
  }
@@ -1230,7 +1243,7 @@
1230
1243
  padding-top:var(--tds-page-header-padding-y);
1231
1244
  color:var(--tds-page-header-color);
1232
1245
  background:var(--tds-page-header-background-color);
1233
- border-bottom:1px solid var(--t-border-color);
1246
+ border-bottom:1px solid var(--tds-page-header-bottom-border-color);
1234
1247
  }
1235
1248
 
1236
1249
  .tds-page-header:not(.has-nav){
@@ -1267,7 +1280,8 @@
1267
1280
  overflow-wrap:break-word;
1268
1281
  }
1269
1282
 
1270
- .tds-page-header [slot="actions"], .tds-page-header .tds-page-header__actions{
1283
+ .tds-page-header [slot="actions"],
1284
+ .tds-page-header .tds-page-header__actions{
1271
1285
  width:100%;
1272
1286
  }
1273
1287
 
@@ -1368,6 +1382,7 @@
1368
1382
  .tds-page-header nav[slot="navigation"] button:not(.selected):active,
1369
1383
  .tds-page-header nav.tds-page-header__nav a:not(.selected):active,
1370
1384
  .tds-page-header nav.tds-page-header__nav button:not(.selected):active{
1385
+ border-color:var(--tds-page-header-nav-item-border-color-active);
1371
1386
  background-color:var(--tds-page-header-nav-item-background-color-active);
1372
1387
  }
1373
1388
 
@@ -1396,7 +1411,8 @@
1396
1411
  align-items:flex-start;
1397
1412
  }
1398
1413
 
1399
- .tds-page-header [slot="actions"], .tds-page-header .tds-page-header__actions{
1414
+ .tds-page-header [slot="actions"],
1415
+ .tds-page-header .tds-page-header__actions{
1400
1416
  width:auto;
1401
1417
  }
1402
1418