@skyux/theme 13.0.0-alpha.0 → 13.0.0-alpha.1

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 (6) hide show
  1. package/css/sky.css +100 -100
  2. package/css/themes/modern/styles.css +628 -563
  3. package/fesm2022/skyux-theme.mjs +59 -20
  4. package/fesm2022/skyux-theme.mjs.map +1 -1
  5. package/index.d.ts +14 -3
  6. package/package.json +3 -3
package/css/sky.css CHANGED
@@ -1,5 +1,5 @@
1
1
  @import url("https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css");
2
- @import url("https://sky.blackbaudcdn.net/static/skyux-icons/8.2.0/assets/css/skyux-icons.min.css");
2
+ @import url("https://sky.blackbaudcdn.net/static/skyux-icons/9.0.0/assets/css/skyux-icons.min.css");
3
3
  /*! normalize-scss | MIT/GPLv2 License | bit.ly/normalize-scss */
4
4
  /* Document
5
5
  ========================================================================== */
@@ -1120,84 +1120,84 @@ body:not(.sky-theme-modern) {
1120
1120
  .sky-layout-host-blocks {
1121
1121
  --sky-layout-host-content-spacing: var(
1122
1122
  --sky-override-page-content-blocks-spacing-xs,
1123
- var(--sky-comp-page-content-blocks-space-inset-top)
1124
- var(--sky-comp-page-content-blocks-space-inset-right)
1125
- var(--sky-comp-page-content-blocks-space-inset-bottom)
1126
- var(--sky-comp-page-content-blocks-space-inset-left)
1123
+ var(--sky-comp-page-content-blocks-space-inset-xs-top)
1124
+ var(--sky-comp-page-content-blocks-space-inset-xs-right)
1125
+ var(--sky-comp-page-content-blocks-space-inset-xs-bottom)
1126
+ var(--sky-comp-page-content-blocks-space-inset-xs-left)
1127
1127
  );
1128
1128
  --sky-layout-host-header-spacing: var(
1129
1129
  --sky-override-page-header-spacing-xs,
1130
- var(--sky-comp-page-header-blocks-space-inset-top)
1131
- var(--sky-comp-page-header-blocks-space-inset-right)
1132
- var(--sky-comp-page-header-blocks-space-inset-bottom)
1133
- var(--sky-comp-page-header-blocks-space-inset-left)
1130
+ var(--sky-comp-page-header-blocks-space-inset-xs-top)
1131
+ var(--sky-comp-page-header-blocks-space-inset-xs-right)
1132
+ var(--sky-comp-page-header-blocks-space-inset-xs-bottom)
1133
+ var(--sky-comp-page-header-blocks-space-inset-xs-left)
1134
1134
  );
1135
1135
  --sky-layout-host-links-spacing: var(
1136
1136
  --sky-override-page-content-with-links-spacing-xs,
1137
- var(--sky-comp-page-links-blocks-space-inset-top)
1138
- var(--sky-comp-page-links-blocks-space-inset-right)
1139
- var(--sky-comp-page-links-blocks-space-inset-bottom)
1140
- var(--sky-comp-page-links-blocks-space-inset-left)
1137
+ var(--sky-comp-page-links-blocks-space-inset-xs-top)
1138
+ var(--sky-comp-page-links-blocks-space-inset-xs-right)
1139
+ var(--sky-comp-page-links-blocks-space-inset-xs-bottom)
1140
+ var(--sky-comp-page-links-blocks-space-inset-xs-left)
1141
1141
  );
1142
1142
  }
1143
1143
  .sky-layout-host-fit {
1144
1144
  --sky-layout-host-content-spacing: var(
1145
1145
  --sky-override-page-content-fit-list-spacing-xs,
1146
- var(--sky-comp-page-content-fit-space-inset-top)
1147
- var(--sky-comp-page-content-fit-space-inset-right)
1148
- var(--sky-comp-page-content-fit-space-inset-bottom)
1149
- var(--sky-comp-page-content-fit-space-inset-left)
1146
+ var(--sky-comp-page-content-fit-space-inset-xs-top)
1147
+ var(--sky-comp-page-content-fit-space-inset-xs-right)
1148
+ var(--sky-comp-page-content-fit-space-inset-xs-bottom)
1149
+ var(--sky-comp-page-content-fit-space-inset-xs-left)
1150
1150
  );
1151
1151
  --sky-layout-host-header-spacing: var(
1152
1152
  --sky-override-page-header-spacing-xs,
1153
- var(--sky-comp-page-header-fit-space-inset-top)
1154
- var(--sky-comp-page-header-fit-space-inset-right)
1155
- var(--sky-comp-page-header-fit-space-inset-bottom)
1156
- var(--sky-comp-page-header-fit-space-inset-left)
1153
+ var(--sky-comp-page-header-fit-space-inset-xs-top)
1154
+ var(--sky-comp-page-header-fit-space-inset-xs-right)
1155
+ var(--sky-comp-page-header-fit-space-inset-xs-bottom)
1156
+ var(--sky-comp-page-header-fit-space-inset-xs-left)
1157
1157
  );
1158
1158
  }
1159
1159
  .sky-layout-host-list {
1160
1160
  --sky-layout-host-content-spacing: var(
1161
1161
  --sky-override-page-content-fit-list-spacing-xs,
1162
- var(--sky-comp-page-content-list-space-inset-top)
1163
- var(--sky-comp-page-content-list-space-inset-right)
1164
- var(--sky-comp-page-content-list-space-inset-bottom)
1165
- var(--sky-comp-page-content-list-space-inset-left)
1162
+ var(--sky-comp-page-content-list-space-inset-xs-top)
1163
+ var(--sky-comp-page-content-list-space-inset-xs-right)
1164
+ var(--sky-comp-page-content-list-space-inset-xs-bottom)
1165
+ var(--sky-comp-page-content-list-space-inset-xs-left)
1166
1166
  );
1167
1167
  --sky-layout-host-links-spacing: var(
1168
1168
  --sky-override-page-content-with-links-spacing-xs,
1169
- var(--sky-comp-page-links-list-space-inset-top)
1170
- var(--sky-comp-page-links-list-space-inset-right)
1171
- var(--sky-comp-page-links-list-space-inset-bottom)
1172
- var(--sky-comp-page-links-list-space-inset-left)
1169
+ var(--sky-comp-page-links-list-space-inset-xs-top)
1170
+ var(--sky-comp-page-links-list-space-inset-xs-right)
1171
+ var(--sky-comp-page-links-list-space-inset-xs-bottom)
1172
+ var(--sky-comp-page-links-list-space-inset-xs-left)
1173
1173
  );
1174
1174
  --sky-layout-host-header-spacing: var(
1175
1175
  --sky-override-page-header-spacing-xs,
1176
- var(--sky-comp-page-header-list-space-inset-top)
1177
- var(--sky-comp-page-header-list-space-inset-right)
1178
- var(--sky-comp-page-header-list-space-inset-bottom)
1179
- var(--sky-comp-page-header-list-space-inset-left)
1176
+ var(--sky-comp-page-header-list-space-inset-xs-top)
1177
+ var(--sky-comp-page-header-list-space-inset-xs-right)
1178
+ var(--sky-comp-page-header-list-space-inset-xs-bottom)
1179
+ var(--sky-comp-page-header-list-space-inset-xs-left)
1180
1180
  );
1181
1181
  }
1182
1182
  .sky-layout-host-tabs {
1183
1183
  --sky-layout-host-content-spacing: 0;
1184
1184
  --sky-layout-host-tab-content-spacing: var(
1185
1185
  --sky-override-tabset-padding-xs-breakpoint,
1186
- var(--sky-comp-page-tabset-tabs-space-inset-left)
1186
+ var(--sky-comp-page-tabset-tabs-space-inset-xs-left)
1187
1187
  );
1188
1188
  --sky-layout-host-links-spacing: var(
1189
1189
  --sky-override-page-content-with-links-spacing-xs,
1190
- var(--sky-comp-page-links-tabs-space-inset-top)
1191
- var(--sky-comp-page-links-tabs-space-inset-right)
1192
- var(--sky-comp-page-links-tabs-space-inset-bottom)
1193
- var(--sky-comp-page-links-tabs-space-inset-left)
1190
+ var(--sky-comp-page-links-tabs-space-inset-xs-top)
1191
+ var(--sky-comp-page-links-tabs-space-inset-xs-right)
1192
+ var(--sky-comp-page-links-tabs-space-inset-xs-bottom)
1193
+ var(--sky-comp-page-links-tabs-space-inset-xs-left)
1194
1194
  );
1195
1195
  --sky-layout-host-header-spacing: var(
1196
1196
  --sky-override-page-header-spacing-xs,
1197
- var(--sky-comp-page-header-tabs-space-inset-top)
1198
- var(--sky-comp-page-header-tabs-space-inset-right)
1199
- var(--sky-comp-page-header-tabs-space-inset-bottom)
1200
- var(--sky-comp-page-header-tabs-space-inset-left)
1197
+ var(--sky-comp-page-header-tabs-space-inset-xs-top)
1198
+ var(--sky-comp-page-header-tabs-space-inset-xs-right)
1199
+ var(--sky-comp-page-header-tabs-space-inset-xs-bottom)
1200
+ var(--sky-comp-page-header-tabs-space-inset-xs-left)
1201
1201
  );
1202
1202
  }
1203
1203
  .sky-layout-host-none {
@@ -1267,62 +1267,62 @@ body:not(.sky-theme-modern) {
1267
1267
  .sky-layout-host-blocks {
1268
1268
  --sky-layout-host-header-spacing: var(
1269
1269
  --sky-override-page-header-blocks-spacing-sm,
1270
- var(--sky-comp-page-header-blocks-space-inset-top)
1271
- var(--sky-comp-page-header-blocks-space-inset-right)
1272
- var(--sky-comp-page-header-blocks-space-inset-bottom)
1273
- var(--sky-comp-page-header-blocks-space-inset-left)
1270
+ var(--sky-comp-page-header-blocks-space-inset-sm-top)
1271
+ var(--sky-comp-page-header-blocks-space-inset-sm-right)
1272
+ var(--sky-comp-page-header-blocks-space-inset-sm-bottom)
1273
+ var(--sky-comp-page-header-blocks-space-inset-sm-left)
1274
1274
  );
1275
1275
  --sky-layout-host-content-spacing: var(
1276
1276
  --sky-override-page-content-blocks-spacing-sm,
1277
- var(--sky-comp-page-content-blocks-space-inset-top)
1278
- var(--sky-comp-page-content-blocks-space-inset-right)
1279
- var(--sky-comp-page-content-blocks-space-inset-bottom)
1280
- var(--sky-comp-page-content-blocks-space-inset-left)
1277
+ var(--sky-comp-page-content-blocks-space-inset-sm-top)
1278
+ var(--sky-comp-page-content-blocks-space-inset-sm-right)
1279
+ var(--sky-comp-page-content-blocks-space-inset-sm-bottom)
1280
+ var(--sky-comp-page-content-blocks-space-inset-sm-left)
1281
1281
  );
1282
1282
  }
1283
1283
  .sky-layout-host-fit {
1284
1284
  --sky-layout-host-header-spacing: var(
1285
1285
  --sky-override-page-header-fit-list-spacing-sm,
1286
- var(--sky-comp-page-header-fit-space-inset-top)
1287
- var(--sky-comp-page-header-fit-space-inset-right)
1288
- var(--sky-comp-page-header-fit-space-inset-bottom)
1289
- var(--sky-comp-page-header-fit-space-inset-left)
1286
+ var(--sky-comp-page-header-fit-space-inset-sm-top)
1287
+ var(--sky-comp-page-header-fit-space-inset-sm-right)
1288
+ var(--sky-comp-page-header-fit-space-inset-sm-bottom)
1289
+ var(--sky-comp-page-header-fit-space-inset-sm-left)
1290
1290
  );
1291
1291
  --sky-layout-host-content-spacing: var(
1292
1292
  --sky-override-page-content-fit-list-spacing-sm,
1293
- var(--sky-comp-page-content-fit-space-inset-top)
1294
- var(--sky-comp-page-content-fit-space-inset-right)
1295
- var(--sky-comp-page-content-fit-space-inset-bottom)
1296
- var(--sky-comp-page-content-fit-space-inset-left)
1293
+ var(--sky-comp-page-content-fit-space-inset-sm-top)
1294
+ var(--sky-comp-page-content-fit-space-inset-sm-right)
1295
+ var(--sky-comp-page-content-fit-space-inset-sm-bottom)
1296
+ var(--sky-comp-page-content-fit-space-inset-sm-left)
1297
1297
  );
1298
1298
  }
1299
1299
  .sky-layout-host-list {
1300
1300
  --sky-layout-host-header-spacing: var(
1301
1301
  --sky-override-page-header-fit-list-spacing-sm,
1302
- var(--sky-comp-page-header-list-space-inset-top)
1303
- var(--sky-comp-page-header-list-space-inset-right)
1304
- var(--sky-comp-page-header-list-space-inset-bottom)
1305
- var(--sky-comp-page-header-list-space-inset-left)
1302
+ var(--sky-comp-page-header-list-space-inset-sm-top)
1303
+ var(--sky-comp-page-header-list-space-inset-sm-right)
1304
+ var(--sky-comp-page-header-list-space-inset-sm-bottom)
1305
+ var(--sky-comp-page-header-list-space-inset-sm-left)
1306
1306
  );
1307
1307
  --sky-layout-host-content-spacing: var(
1308
1308
  --sky-override-page-content-fit-list-spacing-sm,
1309
- var(--sky-comp-page-content-list-space-inset-top)
1310
- var(--sky-comp-page-content-list-space-inset-right)
1311
- var(--sky-comp-page-content-list-space-inset-bottom)
1312
- var(--sky-comp-page-content-list-space-inset-left)
1309
+ var(--sky-comp-page-content-list-space-inset-sm-top)
1310
+ var(--sky-comp-page-content-list-space-inset-sm-right)
1311
+ var(--sky-comp-page-content-list-space-inset-sm-bottom)
1312
+ var(--sky-comp-page-content-list-space-inset-sm-left)
1313
1313
  );
1314
1314
  }
1315
1315
  .sky-layout-host-tabs {
1316
1316
  --sky-layout-host-header-spacing: var(
1317
1317
  --sky-override-page-header-tabs-spacing-sm,
1318
- var(--sky-comp-page-header-tabs-space-inset-top)
1319
- var(--sky-comp-page-header-tabs-space-inset-right)
1320
- var(--sky-comp-page-header-tabs-space-inset-bottom)
1321
- var(--sky-comp-page-header-tabs-space-inset-left)
1318
+ var(--sky-comp-page-header-tabs-space-inset-sm-top)
1319
+ var(--sky-comp-page-header-tabs-space-inset-sm-right)
1320
+ var(--sky-comp-page-header-tabs-space-inset-sm-bottom)
1321
+ var(--sky-comp-page-header-tabs-space-inset-sm-left)
1322
1322
  );
1323
1323
  --sky-layout-host-tab-content-spacing: var(
1324
1324
  --sky-override-page-content-tabs-spacing-sm,
1325
- var(--sky-comp-page-tabset-tabs-space-inset-left)
1325
+ var(--sky-comp-page-tabset-tabs-space-inset-sm-left)
1326
1326
  );
1327
1327
  }
1328
1328
  }
@@ -1462,17 +1462,17 @@ body:not(.sky-theme-modern) {
1462
1462
  .sky-responsive-container-lg .sky-layout-host-blocks {
1463
1463
  --sky-layout-host-header-spacing: var(
1464
1464
  --sky-override-page-header-blocks-spacing-sm,
1465
- var(--sky-comp-page-header-blocks-space-inset-top)
1466
- var(--sky-comp-page-header-blocks-space-inset-right)
1467
- var(--sky-comp-page-header-blocks-space-inset-bottom)
1468
- var(--sky-comp-page-header-blocks-space-inset-left)
1465
+ var(--sky-comp-page-header-blocks-space-inset-sm-top)
1466
+ var(--sky-comp-page-header-blocks-space-inset-sm-right)
1467
+ var(--sky-comp-page-header-blocks-space-inset-sm-bottom)
1468
+ var(--sky-comp-page-header-blocks-space-inset-sm-left)
1469
1469
  );
1470
1470
  --sky-layout-host-content-spacing: var(
1471
1471
  --sky-override-page-content-blocks-spacing-sm,
1472
- var(--sky-comp-page-content-blocks-space-inset-top)
1473
- var(--sky-comp-page-content-blocks-space-inset-right)
1474
- var(--sky-comp-page-content-blocks-space-inset-bottom)
1475
- var(--sky-comp-page-content-blocks-space-inset-left)
1472
+ var(--sky-comp-page-content-blocks-space-inset-sm-top)
1473
+ var(--sky-comp-page-content-blocks-space-inset-sm-right)
1474
+ var(--sky-comp-page-content-blocks-space-inset-sm-bottom)
1475
+ var(--sky-comp-page-content-blocks-space-inset-sm-left)
1476
1476
  );
1477
1477
  }
1478
1478
  .sky-responsive-container-sm .sky-layout-host-fit,
@@ -1480,17 +1480,17 @@ body:not(.sky-theme-modern) {
1480
1480
  .sky-responsive-container-lg .sky-layout-host-fit {
1481
1481
  --sky-layout-host-header-spacing: var(
1482
1482
  --sky-override-page-header-fit-list-spacing-sm,
1483
- var(--sky-comp-page-header-fit-space-inset-top)
1484
- var(--sky-comp-page-header-fit-space-inset-right)
1485
- var(--sky-comp-page-header-fit-space-inset-bottom)
1486
- var(--sky-comp-page-header-fit-space-inset-left)
1483
+ var(--sky-comp-page-header-fit-space-inset-sm-top)
1484
+ var(--sky-comp-page-header-fit-space-inset-sm-right)
1485
+ var(--sky-comp-page-header-fit-space-inset-sm-bottom)
1486
+ var(--sky-comp-page-header-fit-space-inset-sm-left)
1487
1487
  );
1488
1488
  --sky-layout-host-content-spacing: var(
1489
1489
  --sky-override-page-content-fit-list-spacing-sm,
1490
- var(--sky-comp-page-content-fit-space-inset-top)
1491
- var(--sky-comp-page-content-fit-space-inset-right)
1492
- var(--sky-comp-page-content-fit-space-inset-bottom)
1493
- var(--sky-comp-page-content-fit-space-inset-left)
1490
+ var(--sky-comp-page-content-fit-space-inset-sm-top)
1491
+ var(--sky-comp-page-content-fit-space-inset-sm-right)
1492
+ var(--sky-comp-page-content-fit-space-inset-sm-bottom)
1493
+ var(--sky-comp-page-content-fit-space-inset-sm-left)
1494
1494
  );
1495
1495
  }
1496
1496
  .sky-responsive-container-sm .sky-layout-host-list,
@@ -1498,17 +1498,17 @@ body:not(.sky-theme-modern) {
1498
1498
  .sky-responsive-container-lg .sky-layout-host-list {
1499
1499
  --sky-layout-host-header-spacing: var(
1500
1500
  --sky-override-page-header-fit-list-spacing-sm,
1501
- var(--sky-comp-page-header-list-space-inset-top)
1502
- var(--sky-comp-page-header-list-space-inset-right)
1503
- var(--sky-comp-page-header-list-space-inset-bottom)
1504
- var(--sky-comp-page-header-list-space-inset-left)
1501
+ var(--sky-comp-page-header-list-space-inset-sm-top)
1502
+ var(--sky-comp-page-header-list-space-inset-sm-right)
1503
+ var(--sky-comp-page-header-list-space-inset-sm-bottom)
1504
+ var(--sky-comp-page-header-list-space-inset-sm-left)
1505
1505
  );
1506
1506
  --sky-layout-host-content-spacing: var(
1507
1507
  --sky-override-page-content-fit-list-spacing-sm,
1508
- var(--sky-comp-page-content-list-space-inset-top)
1509
- var(--sky-comp-page-content-list-space-inset-right)
1510
- var(--sky-comp-page-content-list-space-inset-bottom)
1511
- var(--sky-comp-page-content-list-space-inset-left)
1508
+ var(--sky-comp-page-content-list-space-inset-sm-top)
1509
+ var(--sky-comp-page-content-list-space-inset-sm-right)
1510
+ var(--sky-comp-page-content-list-space-inset-sm-bottom)
1511
+ var(--sky-comp-page-content-list-space-inset-sm-left)
1512
1512
  );
1513
1513
  }
1514
1514
  .sky-responsive-container-sm .sky-layout-host-tabs,
@@ -1516,14 +1516,14 @@ body:not(.sky-theme-modern) {
1516
1516
  .sky-responsive-container-lg .sky-layout-host-tabs {
1517
1517
  --sky-layout-host-header-spacing: var(
1518
1518
  --sky-override-page-header-tabs-spacing-sm,
1519
- var(--sky-comp-page-header-tabs-space-inset-top)
1520
- var(--sky-comp-page-header-tabs-space-inset-right)
1521
- var(--sky-comp-page-header-tabs-space-inset-bottom)
1522
- var(--sky-comp-page-header-tabs-space-inset-left)
1519
+ var(--sky-comp-page-header-tabs-space-inset-sm-top)
1520
+ var(--sky-comp-page-header-tabs-space-inset-sm-right)
1521
+ var(--sky-comp-page-header-tabs-space-inset-sm-bottom)
1522
+ var(--sky-comp-page-header-tabs-space-inset-sm-left)
1523
1523
  );
1524
1524
  --sky-layout-host-tab-content-spacing: var(
1525
1525
  --sky-override-page-content-tabs-spacing-sm,
1526
- var(--sky-comp-page-tabset-tabs-space-inset-left)
1526
+ var(--sky-comp-page-tabset-tabs-space-inset-sm-left)
1527
1527
  );
1528
1528
  }
1529
1529