@skyux/theme 11.30.1 → 12.0.0-alpha.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/css/sky.css +29 -29
- package/css/themes/modern/styles.css +5 -5
- package/documentation.json +142 -142
- package/fesm2022/skyux-theme.mjs +37 -36
- package/fesm2022/skyux-theme.mjs.map +1 -1
- package/package.json +4 -6
- package/esm2022/index.mjs +0 -17
- package/esm2022/lib/icons/icon-manifest-glyph.mjs +0 -2
- package/esm2022/lib/icons/icon-manifest.mjs +0 -2
- package/esm2022/lib/icons/icon-manifest.service.mjs +0 -24
- package/esm2022/lib/providers/provide-initial-theme.mjs +0 -23
- package/esm2022/lib/style-loader.mjs +0 -58
- package/esm2022/lib/theme.module.mjs +0 -24
- package/esm2022/lib/theming/theme-class.directive.mjs +0 -119
- package/esm2022/lib/theming/theme-component-class.directive.mjs +0 -32
- package/esm2022/lib/theming/theme-if.directive.mjs +0 -73
- package/esm2022/lib/theming/theme-mode.mjs +0 -23
- package/esm2022/lib/theming/theme-settings-change.mjs +0 -2
- package/esm2022/lib/theming/theme-settings.mjs +0 -17
- package/esm2022/lib/theming/theme-spacing.mjs +0 -23
- package/esm2022/lib/theming/theme.directive.mjs +0 -50
- package/esm2022/lib/theming/theme.mjs +0 -29
- package/esm2022/lib/theming/theme.service.mjs +0 -85
- package/esm2022/lib/viewport/viewport-reserve-args.mjs +0 -2
- package/esm2022/lib/viewport/viewport-reserve-position-type.mjs +0 -2
- package/esm2022/lib/viewport/viewport.service.mjs +0 -65
- package/esm2022/skyux-theme.mjs +0 -5
package/css/sky.css
CHANGED
|
@@ -368,7 +368,7 @@ textarea {
|
|
|
368
368
|
--sky-text-color-deemphasized: #686c73;
|
|
369
369
|
--sky-text-color-on-dark: #ffffff;
|
|
370
370
|
--sky-text-color-action-primary: #0974a1;
|
|
371
|
-
--sky-text-color-action-primary-hover:
|
|
371
|
+
--sky-text-color-action-primary-hover: rgb(6.3, 81.2, 112.7);
|
|
372
372
|
/* margin */
|
|
373
373
|
--sky-margin-inline-xs: 5px;
|
|
374
374
|
--sky-margin-inline-sm: 10px;
|
|
@@ -480,7 +480,7 @@ a.sky-btn:hover {
|
|
|
480
480
|
.sky-btn-default:hover, .sky-btn-default:active, .sky-btn-default.sky-btn-active {
|
|
481
481
|
color: #212327;
|
|
482
482
|
background-color: #eeeeef;
|
|
483
|
-
border-color:
|
|
483
|
+
border-color: rgb(178.1578947368, 181.2315789474, 185.8421052632);
|
|
484
484
|
}
|
|
485
485
|
.sky-btn-default:active, .sky-btn-default.sky-btn-active {
|
|
486
486
|
background-image: none;
|
|
@@ -497,8 +497,8 @@ a.sky-btn:hover {
|
|
|
497
497
|
}
|
|
498
498
|
.sky-btn-primary:hover, .sky-btn-primary:active, .sky-btn-primary.sky-btn-active {
|
|
499
499
|
color: #ffffff;
|
|
500
|
-
background-color:
|
|
501
|
-
border-color:
|
|
500
|
+
background-color: rgb(6.3, 81.2, 112.7);
|
|
501
|
+
border-color: rgb(6.3, 81.2, 112.7);
|
|
502
502
|
}
|
|
503
503
|
.sky-btn-primary:active, .sky-btn-primary.sky-btn-active {
|
|
504
504
|
background-image: none;
|
|
@@ -515,8 +515,8 @@ a.sky-btn:hover {
|
|
|
515
515
|
}
|
|
516
516
|
.sky-btn-danger:hover, .sky-btn-danger:active, .sky-btn-danger.sky-btn-active {
|
|
517
517
|
color: #ffffff;
|
|
518
|
-
background-color:
|
|
519
|
-
border-color:
|
|
518
|
+
background-color: rgb(187.7787234043, 36.2212765957, 39.0808510638);
|
|
519
|
+
border-color: rgb(187.7787234043, 36.2212765957, 39.0808510638);
|
|
520
520
|
}
|
|
521
521
|
.sky-btn-danger:active, .sky-btn-danger.sky-btn-active {
|
|
522
522
|
background-image: none;
|
|
@@ -669,7 +669,7 @@ a.sky-btn:hover {
|
|
|
669
669
|
border: none;
|
|
670
670
|
}
|
|
671
671
|
.sky-btn-borderless:hover, .sky-btn-borderless-inline:hover {
|
|
672
|
-
color:
|
|
672
|
+
color: rgb(151.3157894737, 155.4631578947, 161.6842105263);
|
|
673
673
|
transition: color 150ms;
|
|
674
674
|
}
|
|
675
675
|
|
|
@@ -698,7 +698,7 @@ a.sky-btn:hover {
|
|
|
698
698
|
padding: 0;
|
|
699
699
|
}
|
|
700
700
|
.sky-btn-icon-borderless:hover {
|
|
701
|
-
color:
|
|
701
|
+
color: rgb(151.3157894737, 155.4631578947, 161.6842105263);
|
|
702
702
|
transition: color 150ms;
|
|
703
703
|
}
|
|
704
704
|
|
|
@@ -1361,63 +1361,63 @@ body:not(.sky-theme-modern) {
|
|
|
1361
1361
|
}
|
|
1362
1362
|
|
|
1363
1363
|
.sky-palette-multi-1 {
|
|
1364
|
-
background-color:
|
|
1364
|
+
background-color: rgb(7.52, 192.3598340249, 255);
|
|
1365
1365
|
}
|
|
1366
1366
|
|
|
1367
1367
|
.sky-palette-multi-2 {
|
|
1368
|
-
background-color:
|
|
1368
|
+
background-color: rgb(251.48, 185.48, 76.36);
|
|
1369
1369
|
}
|
|
1370
1370
|
|
|
1371
1371
|
.sky-palette-multi-3 {
|
|
1372
|
-
background-color:
|
|
1372
|
+
background-color: rgb(125.28, 196.12, 82.96);
|
|
1373
1373
|
}
|
|
1374
1374
|
|
|
1375
1375
|
.sky-palette-multi-4 {
|
|
1376
|
-
background-color:
|
|
1376
|
+
background-color: rgb(173.97, 154.286, 188.474);
|
|
1377
1377
|
}
|
|
1378
1378
|
|
|
1379
1379
|
.sky-palette-multi-5 {
|
|
1380
|
-
background-color:
|
|
1380
|
+
background-color: rgb(0, 209.16, 170.2996721311);
|
|
1381
1381
|
}
|
|
1382
1382
|
|
|
1383
1383
|
.sky-palette-multi-6 {
|
|
1384
|
-
background-color:
|
|
1384
|
+
background-color: rgb(240.92, 86.92, 90.44);
|
|
1385
1385
|
}
|
|
1386
1386
|
|
|
1387
1387
|
.sky-palette-multi-7 {
|
|
1388
|
-
background-color:
|
|
1388
|
+
background-color: rgb(144.9780821918, 148.8049315068, 155.5019178082);
|
|
1389
1389
|
}
|
|
1390
1390
|
|
|
1391
1391
|
.sky-palette-multi-8 {
|
|
1392
|
-
background-color:
|
|
1392
|
+
background-color: rgb(115.12, 219.5946887967, 255);
|
|
1393
1393
|
}
|
|
1394
1394
|
|
|
1395
1395
|
.sky-palette-multi-9 {
|
|
1396
|
-
background-color:
|
|
1396
|
+
background-color: rgb(252.68, 209.18, 137.26);
|
|
1397
1397
|
}
|
|
1398
1398
|
|
|
1399
1399
|
.sky-palette-multi-10 {
|
|
1400
|
-
background-color:
|
|
1400
|
+
background-color: rgb(181.68, 221.72, 157.76);
|
|
1401
1401
|
}
|
|
1402
1402
|
|
|
1403
1403
|
.sky-palette-multi-11 {
|
|
1404
|
-
background-color:
|
|
1404
|
+
background-color: rgb(206.82, 195.116, 215.444);
|
|
1405
1405
|
}
|
|
1406
1406
|
|
|
1407
1407
|
.sky-palette-multi-12 {
|
|
1408
|
-
background-color:
|
|
1408
|
+
background-color: rgb(84.96, 255, 223.4078688525);
|
|
1409
1409
|
}
|
|
1410
1410
|
|
|
1411
1411
|
.sky-palette-multi-13 {
|
|
1412
|
-
background-color:
|
|
1412
|
+
background-color: rgb(245.72, 144.22, 146.54);
|
|
1413
1413
|
}
|
|
1414
1414
|
|
|
1415
1415
|
.sky-palette-multi-14 {
|
|
1416
|
-
background-color:
|
|
1416
|
+
background-color: rgb(175.5397260274, 178.3035616438, 183.1402739726);
|
|
1417
1417
|
}
|
|
1418
1418
|
|
|
1419
1419
|
.sky-palette-mono-1 {
|
|
1420
|
-
background-color:
|
|
1420
|
+
background-color: rgb(0, 135, 180.75);
|
|
1421
1421
|
}
|
|
1422
1422
|
|
|
1423
1423
|
.sky-palette-mono-2 {
|
|
@@ -1425,15 +1425,15 @@ body:not(.sky-theme-modern) {
|
|
|
1425
1425
|
}
|
|
1426
1426
|
|
|
1427
1427
|
.sky-palette-mono-3 {
|
|
1428
|
-
background-color:
|
|
1428
|
+
background-color: rgb(53.25, 203.9346473029, 255);
|
|
1429
1429
|
}
|
|
1430
1430
|
|
|
1431
1431
|
.sky-palette-mono-4 {
|
|
1432
|
-
background-color:
|
|
1432
|
+
background-color: rgb(120.5, 220.9564315353, 255);
|
|
1433
1433
|
}
|
|
1434
1434
|
|
|
1435
1435
|
.sky-palette-mono-5 {
|
|
1436
|
-
background-color:
|
|
1436
|
+
background-color: rgb(187.75, 237.9782157676, 255);
|
|
1437
1437
|
}
|
|
1438
1438
|
|
|
1439
1439
|
.sky-padding-even-default {
|
|
@@ -1616,15 +1616,15 @@ body:not(.sky-theme-modern) {
|
|
|
1616
1616
|
border-width: 2px;
|
|
1617
1617
|
}
|
|
1618
1618
|
.sky-switch:not(.sky-theme-modern *) .sky-switch-input:checked:not(:disabled) + .sky-switch-control.sky-switch-control-success, .sky-switch:not(.sky-theme-modern *) .sky-switch-input[type=checkbox]:indeterminate:not(:disabled) + .sky-switch-control.sky-switch-control-success {
|
|
1619
|
-
background-color:
|
|
1619
|
+
background-color: rgb(209.802919708, 231.7737226277, 192.2262773723);
|
|
1620
1620
|
border-color: var(--sky-highlight-color-success);
|
|
1621
1621
|
}
|
|
1622
1622
|
.sky-switch:not(.sky-theme-modern *) .sky-switch-input:checked:not(:disabled) + .sky-switch-control.sky-switch-control-warning, .sky-switch:not(.sky-theme-modern *) .sky-switch-input[type=checkbox]:indeterminate:not(:disabled) + .sky-switch-control.sky-switch-control-warning {
|
|
1623
|
-
background-color:
|
|
1623
|
+
background-color: rgb(255, 233.5961538462, 202);
|
|
1624
1624
|
border-color: var(--sky-highlight-color-warning);
|
|
1625
1625
|
}
|
|
1626
1626
|
.sky-switch:not(.sky-theme-modern *) .sky-switch-input:checked:not(:disabled) + .sky-switch-control.sky-switch-control-danger, .sky-switch:not(.sky-theme-modern *) .sky-switch-input[type=checkbox]:indeterminate:not(:disabled) + .sky-switch-control.sky-switch-control-danger {
|
|
1627
|
-
background-color:
|
|
1627
|
+
background-color: rgb(250.4, 200.375, 190.6);
|
|
1628
1628
|
border-color: var(--sky-highlight-color-danger);
|
|
1629
1629
|
}
|
|
1630
1630
|
.sky-switch:not(.sky-theme-modern *) .sky-switch-input:disabled + .sky-switch-control {
|
|
@@ -556,7 +556,7 @@
|
|
|
556
556
|
--sky-highlight-color-danger: #ef4044;
|
|
557
557
|
--sky-text-color-deemphasized: #686c73;
|
|
558
558
|
--sky-text-color-action-primary: #1870B8;
|
|
559
|
-
--sky-text-color-action-primary-hover:
|
|
559
|
+
--sky-text-color-action-primary-hover: rgb(18.1153846154, 84.5384615385, 138.8846153846);
|
|
560
560
|
/* margin */
|
|
561
561
|
--sky-margin-inline-xs: 5px;
|
|
562
562
|
--sky-margin-inline-sm: 10px;
|
|
@@ -588,7 +588,7 @@
|
|
|
588
588
|
--sky-text-color-default: #fbfcfe;
|
|
589
589
|
--sky-text-color-deemphasized: #c0c2c5;
|
|
590
590
|
--sky-text-color-action-primary: #009cd1;
|
|
591
|
-
--sky-text-color-action-primary-hover:
|
|
591
|
+
--sky-text-color-action-primary-hover: rgb(0, 117.9330143541, 158);
|
|
592
592
|
}
|
|
593
593
|
|
|
594
594
|
.sky-theme-modern .sky-box {
|
|
@@ -1302,9 +1302,9 @@
|
|
|
1302
1302
|
--sky-override-icon-switch-size: 35px;
|
|
1303
1303
|
--sky-override-icon-switch-size-group: 40px;
|
|
1304
1304
|
--sky-override-switch-background-color: var(--modern-color-white);
|
|
1305
|
-
--sky-override-switch-background-color-danger:
|
|
1306
|
-
--sky-override-switch-background-color-success:
|
|
1307
|
-
--sky-override-switch-background-color-warning:
|
|
1305
|
+
--sky-override-switch-background-color-danger: rgb(250.4, 200.375, 190.6);
|
|
1306
|
+
--sky-override-switch-background-color-success: rgb(209.802919708, 231.7737226277, 192.2262773723);
|
|
1307
|
+
--sky-override-switch-background-color-warning: rgb(255, 233.5961538462, 202);
|
|
1308
1308
|
--sky-override-switch-border-color: var(--modern-color-blue-74);
|
|
1309
1309
|
--sky-override-switch-checked-color: var(--sky-color-icon-action);
|
|
1310
1310
|
--sky-override-switch-icon-checked-color-no-group: var(
|