@skyux/theme 14.17.0 → 14.18.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.
Files changed (3) hide show
  1. package/css/sky.css +24 -4
  2. package/css/themes/modern/styles.css +169 -73
  3. package/package.json +2 -2
package/css/sky.css CHANGED
@@ -545,6 +545,7 @@ template {
545
545
  .sky-theme-modern.sky-theme-brand-base {
546
546
  --sky-theme-border-container-default: var(--sky-border-width-container-base) var(--sky-border-style-divider) var(--sky-color-border-container-base);
547
547
  --sky-theme-border-container-header-prominent: var(--sky-border-width-emphasized) var(--sky-border-style-divider) var(--sky-color-border-container-header-prominent);
548
+ --sky-theme-border-container-overlay: var(--sky-border-width-container-base) var(--sky-border-style-container-overlay) var(--sky-color-border-container-base);
548
549
  --sky-theme-border-danger: var(--sky-border-width-container-base) var(--sky-border-style-divider) var(--sky-color-border-danger);
549
550
  --sky-theme-border-divider-default: var(--sky-border-width-divider) var(--sky-border-style-divider) var(--sky-color-border-divider);
550
551
  --sky-theme-border-divider-soft: var(--sky-border-width-separator-row) var(--sky-border-style-separator-row) var(--sky-color-border-separator-row);
@@ -557,6 +558,7 @@ template {
557
558
  --sky-theme-border-radius-s: var(--sky-border-radius-s);
558
559
  --sky-theme-border-radius-xs: var(--sky-border-radius-xs);
559
560
  --sky-theme-border-style-accent: var(--sky-border-style-accent);
561
+ --sky-theme-border-style-container-overlay: var(--sky-border-style-container-overlay);
560
562
  --sky-theme-border-style-divider-default: var(--sky-border-style-divider);
561
563
  --sky-theme-border-style-divider-soft: var(--sky-border-style-separator-row);
562
564
  --sky-theme-border-width-accent: var(--sky-border-width-accent);
@@ -782,6 +784,7 @@ template {
782
784
  :root {
783
785
  --sky-theme-border-container-default: 1px solid #cdcfd2;
784
786
  --sky-theme-border-container-header-prominent: 1px solid #7289AF;
787
+ --sky-theme-border-container-overlay: 1px none #cdcfd2;
785
788
  --sky-theme-border-danger: 1px solid #ef4044;
786
789
  --sky-theme-border-divider-default: 1px solid #cdcfd2;
787
790
  --sky-theme-border-divider-soft: 1px solid #cdcfd2;
@@ -792,6 +795,7 @@ template {
792
795
  --sky-theme-border-radius-s: 4px;
793
796
  --sky-theme-border-radius-xs: 4px;
794
797
  --sky-theme-border-style-accent: solid;
798
+ --sky-theme-border-style-container-overlay: none;
795
799
  --sky-theme-border-style-divider-default: solid;
796
800
  --sky-theme-border-style-divider-soft: solid;
797
801
  --sky-theme-border-success: 1px solid #72bf44;
@@ -1425,6 +1429,22 @@ em {
1425
1429
  border-bottom: var(--sky-theme-border-container-header-prominent);
1426
1430
  }
1427
1431
 
1432
+ .sky-theme-border-container-overlay-top {
1433
+ border-top: var(--sky-theme-border-container-overlay);
1434
+ }
1435
+
1436
+ .sky-theme-border-container-overlay-right {
1437
+ border-right: var(--sky-theme-border-container-overlay);
1438
+ }
1439
+
1440
+ .sky-theme-border-container-overlay-bottom {
1441
+ border-bottom: var(--sky-theme-border-container-overlay);
1442
+ }
1443
+
1444
+ .sky-theme-border-container-overlay-left {
1445
+ border-left: var(--sky-theme-border-container-overlay);
1446
+ }
1447
+
1428
1448
  .sky-theme-border-divider-default-top {
1429
1449
  border-top: var(--sky-theme-border-divider-default);
1430
1450
  }
@@ -1783,7 +1803,7 @@ button:active {
1783
1803
  }
1784
1804
 
1785
1805
  a.sky-btn:hover {
1786
- text-decoration: none;
1806
+ text-decoration-line: none;
1787
1807
  }
1788
1808
 
1789
1809
  .sky-btn-default {
@@ -3269,15 +3289,15 @@ h6 {
3269
3289
 
3270
3290
  a {
3271
3291
  color: var(--sky-text-color-action-primary);
3272
- text-decoration: none;
3292
+ text-decoration-line: none;
3273
3293
  }
3274
3294
  a:hover, a:active {
3275
3295
  color: var(--sky-text-color-action-primary-hover);
3276
- text-decoration: underline;
3296
+ text-decoration-line: underline;
3277
3297
  }
3278
3298
  a.sky-href[href=""], a.sky-href[href=""]:hover, a.sky-href[href=""]:active, a.sky-href:not([href]), a.sky-href:not([href]):hover, a.sky-href:not([href]):active {
3279
3299
  color: inherit !important;
3280
- text-decoration: none !important;
3300
+ text-decoration-line: none !important;
3281
3301
  }
3282
3302
 
3283
3303
  .sky-pull-right {
package/css/themes/modern/styles.css CHANGED
@@ -3,6 +3,11 @@
3
3
  inherits: true;
4
4
  initial-value: url("data:,");
5
5
  }
6
+ @property --bb-image-logo-primary-white-src {
7
+ syntax: "<url>";
8
+ inherits: true;
9
+ initial-value: url("data:,");
10
+ }
6
11
  @property --bb-image-select_icon-base-dark-src {
7
12
  syntax: "<url>";
8
13
  inherits: true;
@@ -225,6 +230,7 @@
225
230
  --bb-color-rgba-blue-600-25: rgba(43, 107, 213, 0.25);
226
231
  --bb-color-rgba-blue-600-35: rgba(43, 107, 213, 0.35);
227
232
  --bb-color-rgba-blue-600-50: rgba(43, 107, 213, 0.5);
233
+ --bb-color-rgba-blue-dark-600-20: rgba(0, 102, 205, 0.2);
228
234
  --bb-color-rgba-green-600-35: rgba(9, 156, 83, 0.35);
229
235
  --bb-color-rgba-green-600-50: rgba(9, 156, 83, 0.5);
230
236
  --bb-color-rgba-purple-600-40: rgba(176, 97, 242, 0.4);
@@ -236,6 +242,7 @@
236
242
  --bb-color-rgba-steel-gray-100-10: rgba(245, 246, 247, 0.1);
237
243
  --bb-color-rgba-steel-gray-100-15: rgba(245, 246, 247, 0.15);
238
244
  --bb-color-rgba-steel-gray-100-25: rgba(245, 246, 247, 0.25);
245
+ --bb-color-rgba-steel-gray-100-7: rgba(245, 246, 247, 0.07);
239
246
  --bb-color-rgba-white-18: rgba(255, 255, 255, 0.18);
240
247
  --bb-color-rgba-white-5: rgba(255, 255, 255, 0.05);
241
248
  --bb-color-rgba-white-70: rgba(255, 255, 255, 0.7);
@@ -283,6 +290,16 @@
283
290
  --bb-color-slate-800: #32435e;
284
291
  --bb-color-slate-850: #2a384f;
285
292
  --bb-color-slate-900: #212c3f;
293
+ --bb-color-steel-blue-dark-100: #617695;
294
+ --bb-color-steel-blue-dark-1000: #06152e;
295
+ --bb-color-steel-blue-dark-200: #566a88;
296
+ --bb-color-steel-blue-dark-300: #4b5f7c;
297
+ --bb-color-steel-blue-dark-400: #405371;
298
+ --bb-color-steel-blue-dark-500: #354865;
299
+ --bb-color-steel-blue-dark-600: #2b3e5a;
300
+ --bb-color-steel-blue-dark-700: #21334e;
301
+ --bb-color-steel-blue-dark-800: #172943;
302
+ --bb-color-steel-blue-dark-900: #0e1f39;
286
303
  --bb-color-steel-fusion-100: #f3f6f9;
287
304
  --bb-color-steel-fusion-1000: #2a313c;
288
305
  --bb-color-steel-fusion-1050: #21282f;
@@ -393,15 +410,16 @@
393
410
  --bb-font-weight-light: 300;
394
411
  --bb-font-weight-regular: 400;
395
412
  --bb-font-weight-semibold: 600;
396
- --bb-image-logo-primary-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.8.0/assets/images/bb-logo.png');
397
- --bb-image-select_icon-base-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.8.0/assets/images/chevron_up_down_20_fill-base-dark.svg');
398
- --bb-image-select_icon-base-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.8.0/assets/images/chevron_up_down_20_fill-base-light.svg');
399
- --bb-image-select_icon-bb-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.8.0/assets/images/chevron_up_down_20_fill-bb-dark.svg');
400
- --bb-image-select_icon-bb-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.8.0/assets/images/chevron_up_down_20_fill-bb-light.svg');
401
- --bb-image-select_icon-disabled-base-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.8.0/assets/images/chevron_up_down_20_fill-disabled-base-dark.svg');
402
- --bb-image-select_icon-disabled-base-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.8.0/assets/images/chevron_up_down_20_fill-disabled-base-light.svg');
403
- --bb-image-select_icon-disabled-bb-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.8.0/assets/images/chevron_up_down_20_fill-disabled-bb-dark.svg');
404
- --bb-image-select_icon-disabled-bb-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.8.0/assets/images/chevron_up_down_20_fill-disabled-bb-light.svg');
413
+ --bb-image-logo-primary-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.9.0/assets/images/bb-logo.png');
414
+ --bb-image-logo-primary-white-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.9.0/assets/images/bb-logo-white.png');
415
+ --bb-image-select_icon-base-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.9.0/assets/images/chevron_up_down_20_fill-base-dark.svg');
416
+ --bb-image-select_icon-base-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.9.0/assets/images/chevron_up_down_20_fill-base-light.svg');
417
+ --bb-image-select_icon-bb-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.9.0/assets/images/chevron_up_down_20_fill-bb-dark.svg');
418
+ --bb-image-select_icon-bb-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.9.0/assets/images/chevron_up_down_20_fill-bb-light.svg');
419
+ --bb-image-select_icon-disabled-base-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.9.0/assets/images/chevron_up_down_20_fill-disabled-base-dark.svg');
420
+ --bb-image-select_icon-disabled-base-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.9.0/assets/images/chevron_up_down_20_fill-disabled-base-light.svg');
421
+ --bb-image-select_icon-disabled-bb-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.9.0/assets/images/chevron_up_down_20_fill-disabled-bb-dark.svg');
422
+ --bb-image-select_icon-disabled-bb-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.9.0/assets/images/chevron_up_down_20_fill-disabled-bb-light.svg');
405
423
  --bb-letter_spacing-normal: normal;
406
424
  --bb-letter_spacing-wider: 0.01rem;
407
425
  --bb-letter_spacing-widest: 0.046875rem;
@@ -708,6 +726,7 @@
708
726
  --sky-color-icon-on_prominent-base: var(--bb-color-white);
709
727
  --sky-color-icon-on_prominent-disabled: var(--bb-color-gray-600);
710
728
  --sky-color-icon-on_status: var(--bb-color-white);
729
+ --sky-color-icon-on_status_bg: var(--bb-color-gray-1000);
711
730
  --sky-color-icon-selected: var(--bb-color-blue-600);
712
731
  --sky-color-icon-success: var(--bb-color-green-600);
713
732
  --sky-color-icon-warning: var(--bb-color-yellow-400);
@@ -902,10 +921,10 @@
902
921
  --sky-color-background-row-hover: var(--bb-color-transparent);
903
922
  --sky-color-background-scrim: var(--bb-color-scrim-heavy);
904
923
  --sky-color-background-selected-danger: var(--bb-color-red-900);
905
- --sky-color-background-selected-heavy: var(--bb-color-blue-600);
906
- --sky-color-background-selected-soft: var(--bb-color-blue-900);
924
+ --sky-color-background-selected-heavy: var(--bb-color-blue-dark-375);
925
+ --sky-color-background-selected-soft: var(--bb-color-rgba-blue-dark-600-20);
907
926
  --sky-color-background-selected-success: var(--bb-color-green-900);
908
- --sky-color-background-selected-switch-base: var(--bb-color-blue-600);
927
+ --sky-color-background-selected-switch-base: var(--bb-color-blue-dark-375);
909
928
  --sky-color-background-selected-warning: var(--bb-color-yellow-900);
910
929
  --sky-color-background-tab-active: var(--bb-color-transparent);
911
930
  --sky-color-background-tab-base: var(--bb-color-transparent);
@@ -913,10 +932,10 @@
913
932
  --sky-color-background-tab-hover: var(--bb-color-transparent);
914
933
  --sky-color-background-tab-selected: var(--bb-color-transparent);
915
934
  --sky-color-background-tab-wizard-disabled: var(--bb-color-transparent);
916
- --sky-color-background-text_highlight: var(--bb-color-yellow-800);
935
+ --sky-color-background-text_highlight: var(--bb-color-yellow-dark-700);
917
936
  --sky-color-background-thumb-base: var(--bb-color-white);
918
937
  --sky-color-background-thumb-disabled: var(--bb-color-gray-600);
919
- --sky-color-background-thumbnail_matte: var(--bb-color-white);
938
+ --sky-color-background-thumbnail_matte: var(--bb-color-rgba-steel-gray-100-7);
920
939
  --sky-color-border-action-accent-active: var(--bb-color-sky-500);
921
940
  --sky-color-border-action-accent-base: var(--bb-color-gray-700);
922
941
  --sky-color-border-action-accent-focus: var(--bb-color-sky-600);
@@ -929,23 +948,23 @@
929
948
  --sky-color-border-action-input-base: var(--bb-color-blue-400);
930
949
  --sky-color-border-action-input-focus: var(--bb-color-blue-600);
931
950
  --sky-color-border-action-input-hover: var(--bb-color-blue-600);
932
- --sky-color-border-action-primary-active: var(--bb-color-sky-500);
933
- --sky-color-border-action-primary-base: var(--bb-color-sky-600);
934
- --sky-color-border-action-primary-focus: var(--bb-color-sky-600);
935
- --sky-color-border-action-primary-hover: var(--bb-color-sky-600);
951
+ --sky-color-border-action-primary-active: var(--bb-color-blue-dark-100);
952
+ --sky-color-border-action-primary-base: var(--bb-color-blue-dark-375);
953
+ --sky-color-border-action-primary-focus: var(--bb-color-blue-dark-100);
954
+ --sky-color-border-action-primary-hover: var(--bb-color-blue-dark-100);
936
955
  --sky-color-border-action-secondary-active: var(--bb-color-sky-500);
937
956
  --sky-color-border-action-secondary-base: var(--bb-color-gray-700);
938
957
  --sky-color-border-action-secondary-focus: var(--bb-color-sky-600);
939
958
  --sky-color-border-action-secondary-hover: var(--bb-color-sky-600);
940
- --sky-color-border-action-tertiary-active: var(--bb-color-sky-500);
959
+ --sky-color-border-action-tertiary-active: var(--bb-color-blue-dark-375);
941
960
  --sky-color-border-action-tertiary-base: var(--bb-color-transparent);
942
- --sky-color-border-action-tertiary-focus: var(--bb-color-sky-600);
943
- --sky-color-border-action-tertiary-hover: var(--bb-color-sky-600);
961
+ --sky-color-border-action-tertiary-focus: var(--bb-color-blue-dark-375);
962
+ --sky-color-border-action-tertiary-hover: var(--bb-color-blue-dark-375);
944
963
  --sky-color-border-action-tertiary-on_prominent-active: var(--bb-color-blue-300);
945
964
  --sky-color-border-action-tertiary-on_prominent-base: var(--bb-color-transparent);
946
965
  --sky-color-border-action-tertiary-on_prominent-focus: var(--bb-color-blue-300);
947
966
  --sky-color-border-action-tertiary-on_prominent-hover: var(--bb-color-blue-300);
948
- --sky-color-border-column_divider: var(--bb-color-blue-400);
967
+ --sky-color-border-column_divider: var(--bb-color-blue-dark-400);
949
968
  --sky-color-border-container-base: var(--bb-color-blue-900);
950
969
  --sky-color-border-container-header-prominent: var(--bb-color-slate-500);
951
970
  --sky-color-border-danger: var(--bb-color-red-400);
@@ -955,7 +974,7 @@
955
974
  --sky-color-border-info: var(--bb-color-blue-400);
956
975
  --sky-color-border-input-active: var(--bb-color-blue-600);
957
976
  --sky-color-border-input-base: var(--bb-color-blue-200);
958
- --sky-color-border-input-error: var(--bb-color-red-600);
977
+ --sky-color-border-input-error: var(--bb-color-red-dark-600);
959
978
  --sky-color-border-input-focus: var(--bb-color-blue-600);
960
979
  --sky-color-border-input-hover: var(--bb-color-blue-600);
961
980
  --sky-color-border-nav-active: var(--bb-color-sky-500);
@@ -963,26 +982,26 @@
963
982
  --sky-color-border-nav-focus: var(--bb-color-sky-600);
964
983
  --sky-color-border-nav-hover: var(--bb-color-sky-600);
965
984
  --sky-color-border-progress_step: var(--bb-color-gray-600);
966
- --sky-color-border-selected: var(--bb-color-blue-400);
967
- --sky-color-border-selected_soft: var(--bb-color-blue-500);
985
+ --sky-color-border-selected: var(--bb-color-blue-dark-375);
986
+ --sky-color-border-selected_soft: var(--bb-color-blue-dark-600);
968
987
  --sky-color-border-separator-light: var(--bb-color-gray-700);
969
988
  --sky-color-border-separator-row: var(--bb-color-gray-800);
970
989
  --sky-color-border-success: var(--bb-color-green-400);
971
990
  --sky-color-border-switch-active: var(--bb-color-blue-600);
972
991
  --sky-color-border-switch-base: var(--bb-color-blue-500);
973
- --sky-color-border-switch-error: var(--bb-color-red-600);
992
+ --sky-color-border-switch-error: var(--bb-color-red-dark-600);
974
993
  --sky-color-border-switch-focus: var(--bb-color-blue-600);
975
994
  --sky-color-border-switch-hover: var(--bb-color-blue-600);
976
- --sky-color-border-switch-selected-active: var(--bb-color-blue-900);
995
+ --sky-color-border-switch-selected-active: var(--bb-color-blue-dark-100);
977
996
  --sky-color-border-switch-selected-base: var(--bb-color-transparent);
978
- --sky-color-border-switch-selected-focus: var(--bb-color-blue-900);
979
- --sky-color-border-switch-selected-hover: var(--bb-color-blue-900);
997
+ --sky-color-border-switch-selected-focus: var(--bb-color-blue-dark-100);
998
+ --sky-color-border-switch-selected-hover: var(--bb-color-blue-dark-100);
980
999
  --sky-color-border-tab-active: var(--bb-color-sky-500);
981
1000
  --sky-color-border-tab-base: var(--bb-color-transparent);
982
1001
  --sky-color-border-tab-focus: var(--bb-color-sky-600);
983
1002
  --sky-color-border-tab-hover: var(--bb-color-sky-600);
984
1003
  --sky-color-border-tab-wizard-disabled: var(--bb-color-transparent);
985
- --sky-color-border-text_highlight: var(--bb-color-yellow-600);
1004
+ --sky-color-border-text_highlight: var(--bb-color-yellow-dark-400);
986
1005
  --sky-color-border-warning: var(--bb-color-yellow-400);
987
1006
  --sky-color-category-blue: var(--bb-color-sky-900);
988
1007
  --sky-color-category-green: var(--bb-color-green-900);
@@ -1016,13 +1035,14 @@
1016
1035
  --sky-color-icon-on_prominent-base: var(--bb-color-white);
1017
1036
  --sky-color-icon-on_prominent-disabled: var(--bb-color-gray-600);
1018
1037
  --sky-color-icon-on_status: var(--bb-color-white);
1038
+ --sky-color-icon-on_status_bg: var(--bb-color-gray-1000);
1019
1039
  --sky-color-icon-selected: var(--bb-color-blue-600);
1020
1040
  --sky-color-icon-success: var(--bb-color-green-700);
1021
1041
  --sky-color-icon-warning: var(--bb-color-yellow-600);
1022
- --sky-color-illustration-fill-heavy: var(--bb-color-green-700);
1023
- --sky-color-illustration-fill-soft: var(--bb-color-green-900);
1024
- --sky-color-illustration-fill-softest: var(--bb-color-gray-900);
1025
- --sky-color-illustration-stroke: var(--bb-color-green-200);
1042
+ --sky-color-illustration-fill-heavy: var(--bb-color-teal-dark-600);
1043
+ --sky-color-illustration-fill-soft: var(--bb-color-teal-dark-800);
1044
+ --sky-color-illustration-fill-softest: var(--bb-color-steel-gray-1100);
1045
+ --sky-color-illustration-stroke: var(--bb-color-teal-dark-100);
1026
1046
  --sky-color-text-action: var(--bb-color-sky-600);
1027
1047
  --sky-color-text-action_contrast: var(--bb-color-blue-dark-200);
1028
1048
  --sky-color-text-danger: var(--bb-color-red-400);
@@ -1074,7 +1094,7 @@
1074
1094
  --sky-color-viz-sequence-7: var(--bb-color-teal-400);
1075
1095
  --sky-color-viz-sequence-8: var(--bb-color-teal-300);
1076
1096
  --sky-color-viz-sequence-9: var(--bb-color-teal-200);
1077
- --sky-image-logo-primary-src: var(--bb-image-logo-primary-src);
1097
+ --sky-image-logo-primary-src: var(--bb-image-logo-primary-white-src);
1078
1098
  --sky-image-select_icon-base: var(--bb-image-select_icon-base-dark-src);
1079
1099
  --sky-image-select_icon-disabled: var(--bb-image-select_icon-disabled-base-dark-src);
1080
1100
  --sky-opacity-wait: var(--bb-opacity-600);
@@ -1159,11 +1179,21 @@
1159
1179
  --sky-font-style-hint-m-weight: 400;
1160
1180
  --sky-font-style-hint-s-style: italic;
1161
1181
  --sky-font-style-hint-s-weight: 400;
1182
+ --sky-font-text_decoration-action-tertiary-active: none;
1183
+ --sky-font-text_decoration-action-tertiary-base: none;
1184
+ --sky-font-text_decoration-action-tertiary-disabled: none;
1185
+ --sky-font-text_decoration-action-tertiary-focus: none;
1186
+ --sky-font-text_decoration-action-tertiary-hover: none;
1162
1187
  --sky-font-text_decoration-inline_link-active: underline;
1163
1188
  --sky-font-text_decoration-inline_link-base: none;
1164
1189
  --sky-font-text_decoration-inline_link-disabled: none;
1165
1190
  --sky-font-text_decoration-inline_link-focus: none;
1166
1191
  --sky-font-text_decoration-inline_link-hover: underline;
1192
+ --sky-font-text_decoration-standalone_link-active: none;
1193
+ --sky-font-text_decoration-standalone_link-base: none;
1194
+ --sky-font-text_decoration-standalone_link-disabled: none;
1195
+ --sky-font-text_decoration-standalone_link-focus: none;
1196
+ --sky-font-text_decoration-standalone_link-hover: none;
1167
1197
  --sky-font-text_decoration-visible_link: underline;
1168
1198
  --sky-space-gap-action_group-0: 0rem;
1169
1199
  --sky-space-gap-form-0: 0rem;
@@ -1888,7 +1918,12 @@
1888
1918
  }
1889
1919
 
1890
1920
  .sky-theme-modern.sky-theme-brand-base.sky-theme-mode-dark {
1921
+ --sky-font-text_decoration-action-tertiary-active: underline;
1922
+ --sky-font-text_decoration-action-tertiary-base: underline;
1923
+ --sky-font-text_decoration-action-tertiary-focus: underline;
1924
+ --sky-font-text_decoration-action-tertiary-hover: underline;
1891
1925
  --sky-font-text_decoration-inline_link-base: underline;
1926
+ --sky-font-text_decoration-inline_link-focus: underline;
1892
1927
  --sky-border-style-container-overlay: var(--bb-border-style-solid);
1893
1928
  }
1894
1929
 
@@ -1897,6 +1932,11 @@
1897
1932
  inherits: true;
1898
1933
  initial-value: url("data:,");
1899
1934
  }
1935
+ @property --bb-image-logo-primary-white-src {
1936
+ syntax: "<url>";
1937
+ inherits: true;
1938
+ initial-value: url("data:,");
1939
+ }
1900
1940
  @property --bb-image-select_icon-base-dark-src {
1901
1941
  syntax: "<url>";
1902
1942
  inherits: true;
@@ -2119,6 +2159,7 @@
2119
2159
  --bb-color-rgba-blue-600-25: rgba(43, 107, 213, 0.25);
2120
2160
  --bb-color-rgba-blue-600-35: rgba(43, 107, 213, 0.35);
2121
2161
  --bb-color-rgba-blue-600-50: rgba(43, 107, 213, 0.5);
2162
+ --bb-color-rgba-blue-dark-600-20: rgba(0, 102, 205, 0.2);
2122
2163
  --bb-color-rgba-green-600-35: rgba(9, 156, 83, 0.35);
2123
2164
  --bb-color-rgba-green-600-50: rgba(9, 156, 83, 0.5);
2124
2165
  --bb-color-rgba-purple-600-40: rgba(176, 97, 242, 0.4);
@@ -2130,6 +2171,7 @@
2130
2171
  --bb-color-rgba-steel-gray-100-10: rgba(245, 246, 247, 0.1);
2131
2172
  --bb-color-rgba-steel-gray-100-15: rgba(245, 246, 247, 0.15);
2132
2173
  --bb-color-rgba-steel-gray-100-25: rgba(245, 246, 247, 0.25);
2174
+ --bb-color-rgba-steel-gray-100-7: rgba(245, 246, 247, 0.07);
2133
2175
  --bb-color-rgba-white-18: rgba(255, 255, 255, 0.18);
2134
2176
  --bb-color-rgba-white-5: rgba(255, 255, 255, 0.05);
2135
2177
  --bb-color-rgba-white-70: rgba(255, 255, 255, 0.7);
@@ -2177,6 +2219,16 @@
2177
2219
  --bb-color-slate-800: #32435e;
2178
2220
  --bb-color-slate-850: #2a384f;
2179
2221
  --bb-color-slate-900: #212c3f;
2222
+ --bb-color-steel-blue-dark-100: #617695;
2223
+ --bb-color-steel-blue-dark-1000: #06152e;
2224
+ --bb-color-steel-blue-dark-200: #566a88;
2225
+ --bb-color-steel-blue-dark-300: #4b5f7c;
2226
+ --bb-color-steel-blue-dark-400: #405371;
2227
+ --bb-color-steel-blue-dark-500: #354865;
2228
+ --bb-color-steel-blue-dark-600: #2b3e5a;
2229
+ --bb-color-steel-blue-dark-700: #21334e;
2230
+ --bb-color-steel-blue-dark-800: #172943;
2231
+ --bb-color-steel-blue-dark-900: #0e1f39;
2180
2232
  --bb-color-steel-fusion-100: #f3f6f9;
2181
2233
  --bb-color-steel-fusion-1000: #2a313c;
2182
2234
  --bb-color-steel-fusion-1050: #21282f;
@@ -2287,15 +2339,16 @@
2287
2339
  --bb-font-weight-light: 300;
2288
2340
  --bb-font-weight-regular: 400;
2289
2341
  --bb-font-weight-semibold: 600;
2290
- --bb-image-logo-primary-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.8.0/assets/images/bb-logo.png');
2291
- --bb-image-select_icon-base-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.8.0/assets/images/chevron_up_down_20_fill-base-dark.svg');
2292
- --bb-image-select_icon-base-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.8.0/assets/images/chevron_up_down_20_fill-base-light.svg');
2293
- --bb-image-select_icon-bb-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.8.0/assets/images/chevron_up_down_20_fill-bb-dark.svg');
2294
- --bb-image-select_icon-bb-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.8.0/assets/images/chevron_up_down_20_fill-bb-light.svg');
2295
- --bb-image-select_icon-disabled-base-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.8.0/assets/images/chevron_up_down_20_fill-disabled-base-dark.svg');
2296
- --bb-image-select_icon-disabled-base-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.8.0/assets/images/chevron_up_down_20_fill-disabled-base-light.svg');
2297
- --bb-image-select_icon-disabled-bb-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.8.0/assets/images/chevron_up_down_20_fill-disabled-bb-dark.svg');
2298
- --bb-image-select_icon-disabled-bb-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.8.0/assets/images/chevron_up_down_20_fill-disabled-bb-light.svg');
2342
+ --bb-image-logo-primary-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.9.0/assets/images/bb-logo.png');
2343
+ --bb-image-logo-primary-white-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.9.0/assets/images/bb-logo-white.png');
2344
+ --bb-image-select_icon-base-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.9.0/assets/images/chevron_up_down_20_fill-base-dark.svg');
2345
+ --bb-image-select_icon-base-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.9.0/assets/images/chevron_up_down_20_fill-base-light.svg');
2346
+ --bb-image-select_icon-bb-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.9.0/assets/images/chevron_up_down_20_fill-bb-dark.svg');
2347
+ --bb-image-select_icon-bb-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.9.0/assets/images/chevron_up_down_20_fill-bb-light.svg');
2348
+ --bb-image-select_icon-disabled-base-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.9.0/assets/images/chevron_up_down_20_fill-disabled-base-dark.svg');
2349
+ --bb-image-select_icon-disabled-base-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.9.0/assets/images/chevron_up_down_20_fill-disabled-base-light.svg');
2350
+ --bb-image-select_icon-disabled-bb-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.9.0/assets/images/chevron_up_down_20_fill-disabled-bb-dark.svg');
2351
+ --bb-image-select_icon-disabled-bb-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.9.0/assets/images/chevron_up_down_20_fill-disabled-bb-light.svg');
2299
2352
  --bb-letter_spacing-normal: normal;
2300
2353
  --bb-letter_spacing-wider: 0.01rem;
2301
2354
  --bb-letter_spacing-widest: 0.046875rem;
@@ -2518,10 +2571,10 @@
2518
2571
  --sky-color-background-action-primary-focus: var(--bb-color-blue-dark-400);
2519
2572
  --sky-color-background-action-primary-hover: var(--bb-color-blue-dark-300);
2520
2573
  --sky-color-background-action-secondary-active: var(--bb-color-transparent);
2521
- --sky-color-background-action-secondary-base: var(--bb-color-rgba-steel-gray-100-10);
2574
+ --sky-color-background-action-secondary-base: var(--bb-color-rgba-steel-gray-100-7);
2522
2575
  --sky-color-background-action-secondary-disabled: var(--bb-color-steel-gray-700);
2523
2576
  --sky-color-background-action-secondary-focus: var(--bb-color-transparent);
2524
- --sky-color-background-action-secondary-hover: var(--bb-color-rgba-steel-gray-100-15);
2577
+ --sky-color-background-action-secondary-hover: var(--bb-color-rgba-steel-gray-100-10);
2525
2578
  --sky-color-background-action-tertiary-active: var(--bb-color-transparent);
2526
2579
  --sky-color-background-action-tertiary-base: var(--bb-color-transparent);
2527
2580
  --sky-color-background-action-tertiary-disabled: var(--bb-color-gray-700);
@@ -2565,10 +2618,10 @@
2565
2618
  --sky-color-background-row-hover: var(--bb-color-transparent);
2566
2619
  --sky-color-background-scrim: var(--bb-color-scrim-heavy);
2567
2620
  --sky-color-background-selected-danger: var(--bb-color-red-dark-900);
2568
- --sky-color-background-selected-heavy: var(--bb-color-blue-dark-800);
2569
- --sky-color-background-selected-soft: var(--bb-color-blue-dark-900);
2621
+ --sky-color-background-selected-heavy: var(--bb-color-blue-dark-375);
2622
+ --sky-color-background-selected-soft: var(--bb-color-steel-blue-dark-700);
2570
2623
  --sky-color-background-selected-success: var(--bb-color-green-dark-900);
2571
- --sky-color-background-selected-switch-base: var(--bb-color-blue-400);
2624
+ --sky-color-background-selected-switch-base: var(--bb-color-blue-dark-375);
2572
2625
  --sky-color-background-selected-switch-disabled: var(--bb-color-steel-gray-700);
2573
2626
  --sky-color-background-selected-warning: var(--bb-color-yellow-dark-900);
2574
2627
  --sky-color-background-tab-active: var(--bb-color-transparent);
@@ -2578,10 +2631,10 @@
2578
2631
  --sky-color-background-tab-hover: var(--bb-color-transparent);
2579
2632
  --sky-color-background-tab-selected: var(--bb-color-transparent);
2580
2633
  --sky-color-background-tab-wizard-disabled: var(--bb-color-transparent);
2581
- --sky-color-background-text_highlight: var(--bb-color-yellow-800);
2634
+ --sky-color-background-text_highlight: var(--bb-color-yellow-dark-700);
2582
2635
  --sky-color-background-thumb-base: var(--bb-color-white);
2583
2636
  --sky-color-background-thumb-disabled: var(--bb-color-gray-600);
2584
- --sky-color-background-thumbnail_matte: var(--bb-color-rgba-steel-gray-100-25);
2637
+ --sky-color-background-thumbnail_matte: var(--bb-color-rgba-steel-gray-100-7);
2585
2638
  --sky-color-border-action-accent-hover: var(--bb-color-blue-dark-400);
2586
2639
  --sky-color-border-action-danger-active: var(--bb-color-red-dark-300);
2587
2640
  --sky-color-border-action-danger-base: var(--bb-color-red-dark-400);
@@ -2593,26 +2646,26 @@
2593
2646
  --sky-color-border-action-input-disabled: var(--bb-color-gray-800);
2594
2647
  --sky-color-border-action-input-focus: var(--bb-color-blue-dark-400);
2595
2648
  --sky-color-border-action-input-hover: var(--bb-color-blue-dark-400);
2596
- --sky-color-border-action-primary-active: var(--bb-color-blue-dark-400);
2649
+ --sky-color-border-action-primary-active: var(--bb-color-blue-dark-100);
2597
2650
  --sky-color-border-action-primary-base: var(--bb-color-blue-dark-375);
2598
2651
  --sky-color-border-action-primary-disabled: var(--bb-color-gray-800);
2599
- --sky-color-border-action-primary-focus: var(--bb-color-blue-dark-400);
2600
- --sky-color-border-action-primary-hover: var(--bb-color-steel-gray-100);
2652
+ --sky-color-border-action-primary-focus: var(--bb-color-blue-dark-100);
2653
+ --sky-color-border-action-primary-hover: var(--bb-color-blue-dark-100);
2601
2654
  --sky-color-border-action-secondary-active: var(--bb-color-blue-dark-375);
2602
2655
  --sky-color-border-action-secondary-base: var(--bb-color-steel-gray-700);
2603
2656
  --sky-color-border-action-secondary-disabled: var(--bb-color-steel-gray-800);
2604
2657
  --sky-color-border-action-secondary-focus: var(--bb-color-blue-dark-375);
2605
2658
  --sky-color-border-action-secondary-hover: var(--bb-color-blue-dark-375);
2606
- --sky-color-border-action-tertiary-active: var(--bb-color-blue-dark-400);
2659
+ --sky-color-border-action-tertiary-active: var(--bb-color-blue-dark-375);
2607
2660
  --sky-color-border-action-tertiary-base: var(--bb-color-transparent);
2608
- --sky-color-border-action-tertiary-disabled: var(--bb-color-gray-800);
2609
- --sky-color-border-action-tertiary-focus: var(--bb-color-blue-dark-400);
2610
- --sky-color-border-action-tertiary-hover: var(--bb-color-blue-dark-400);
2661
+ --sky-color-border-action-tertiary-disabled: var(--bb-color-steel-gray-800);
2662
+ --sky-color-border-action-tertiary-focus: var(--bb-color-blue-dark-375);
2663
+ --sky-color-border-action-tertiary-hover: var(--bb-color-blue-dark-375);
2611
2664
  --sky-color-border-action-tertiary-on_prominent-active: var(--bb-color-blue-300);
2612
2665
  --sky-color-border-action-tertiary-on_prominent-base: var(--bb-color-transparent);
2613
2666
  --sky-color-border-action-tertiary-on_prominent-focus: var(--bb-color-blue-300);
2614
2667
  --sky-color-border-action-tertiary-on_prominent-hover: var(--bb-color-blue-300);
2615
- --sky-color-border-column_divider: var(--bb-color-blue-400);
2668
+ --sky-color-border-column_divider: var(--bb-color-blue-dark-400);
2616
2669
  --sky-color-border-container-base: var(--bb-color-rgba-white-18);
2617
2670
  --sky-color-border-container-header-prominent: var(--bb-color-slate-500);
2618
2671
  --sky-color-border-danger: var(--bb-color-red-dark-700);
@@ -2623,7 +2676,7 @@
2623
2676
  --sky-color-border-input-active: var(--bb-color-blue-dark-400);
2624
2677
  --sky-color-border-input-base: var(--bb-color-steel-gray-800);
2625
2678
  --sky-color-border-input-disabled: var(--bb-color-steel-gray-400);
2626
- --sky-color-border-input-error: var(--bb-color-red-600);
2679
+ --sky-color-border-input-error: var(--bb-color-red-dark-600);
2627
2680
  --sky-color-border-input-focus: var(--bb-color-blue-dark-400);
2628
2681
  --sky-color-border-input-hover: var(--bb-color-blue-dark-400);
2629
2682
  --sky-color-border-nav-active: var(--bb-color-blue-dark-375);
@@ -2632,8 +2685,8 @@
2632
2685
  --sky-color-border-nav-focus: var(--bb-color-blue-dark-375);
2633
2686
  --sky-color-border-nav-hover: var(--bb-color-blue-dark-375);
2634
2687
  --sky-color-border-progress_step: var(--bb-color-gray-600);
2635
- --sky-color-border-selected: var(--bb-color-blue-400);
2636
- --sky-color-border-selected_soft: var(--bb-color-blue-400);
2688
+ --sky-color-border-selected: var(--bb-color-blue-dark-375);
2689
+ --sky-color-border-selected_soft: var(--bb-color-steel-blue-dark-100);
2637
2690
  --sky-color-border-separator-dark: var(--bb-color-rgba-white-18);
2638
2691
  --sky-color-border-separator-light: var(--bb-color-rgba-white-18);
2639
2692
  --sky-color-border-separator-row: var(--bb-color-rgba-white-18);
@@ -2641,21 +2694,21 @@
2641
2694
  --sky-color-border-switch-active: var(--bb-color-blue-dark-400);
2642
2695
  --sky-color-border-switch-base: var(--bb-color-steel-gray-500);
2643
2696
  --sky-color-border-switch-disabled: var(--bb-color-steel-gray-400);
2644
- --sky-color-border-switch-error: var(--bb-color-red-600);
2697
+ --sky-color-border-switch-error: var(--bb-color-red-dark-600);
2645
2698
  --sky-color-border-switch-focus: var(--bb-color-blue-dark-400);
2646
2699
  --sky-color-border-switch-hover: var(--bb-color-blue-dark-400);
2647
- --sky-color-border-switch-selected-active: var(--bb-color-blue-900);
2700
+ --sky-color-border-switch-selected-active: var(--bb-color-blue-dark-100);
2648
2701
  --sky-color-border-switch-selected-base: var(--bb-color-transparent);
2649
2702
  --sky-color-border-switch-selected-disabled: var(--bb-color-steel-gray-400);
2650
- --sky-color-border-switch-selected-focus: var(--bb-color-blue-dark-900);
2651
- --sky-color-border-switch-selected-hover: var(--bb-color-blue-dark-300);
2703
+ --sky-color-border-switch-selected-focus: var(--bb-color-blue-dark-100);
2704
+ --sky-color-border-switch-selected-hover: var(--bb-color-blue-dark-100);
2652
2705
  --sky-color-border-tab-active: var(--bb-color-blue-dark-300);
2653
2706
  --sky-color-border-tab-base: var(--bb-color-transparent);
2654
2707
  --sky-color-border-tab-disabled: var(--bb-color-steel-gray-800);
2655
2708
  --sky-color-border-tab-focus: var(--bb-color-blue-dark-400);
2656
2709
  --sky-color-border-tab-hover: var(--bb-color-blue-dark-300);
2657
2710
  --sky-color-border-tab-wizard-disabled: var(--bb-color-transparent);
2658
- --sky-color-border-text_highlight: var(--bb-color-yellow-600);
2711
+ --sky-color-border-text_highlight: var(--bb-color-yellow-dark-400);
2659
2712
  --sky-color-border-warning: var(--bb-color-yellow-dark-600);
2660
2713
  --sky-color-classify-1-heavy: var(--bb-color-teal-dark-300);
2661
2714
  --sky-color-classify-1-soft: var(--bb-color-teal-dark-700);
@@ -2681,13 +2734,14 @@
2681
2734
  --sky-color-icon-on_prominent-base: var(--bb-color-white);
2682
2735
  --sky-color-icon-on_prominent-disabled: var(--bb-color-gray-600);
2683
2736
  --sky-color-icon-on_status: var(--bb-color-white);
2737
+ --sky-color-icon-on_status_bg: var(--bb-color-steel-gray-1100);
2684
2738
  --sky-color-icon-selected: var(--bb-color-blue-dark-300);
2685
2739
  --sky-color-icon-success: var(--bb-color-green-dark-400);
2686
2740
  --sky-color-icon-warning: var(--bb-color-yellow-dark-400);
2687
- --sky-color-illustration-fill-heavy: var(--bb-color-green-700);
2688
- --sky-color-illustration-fill-soft: var(--bb-color-green-900);
2689
- --sky-color-illustration-fill-softest: var(--bb-color-gray-900);
2690
- --sky-color-illustration-stroke: var(--bb-color-green-200);
2741
+ --sky-color-illustration-fill-heavy: var(--bb-color-teal-dark-600);
2742
+ --sky-color-illustration-fill-soft: var(--bb-color-teal-dark-800);
2743
+ --sky-color-illustration-fill-softest: var(--bb-color-steel-gray-1100);
2744
+ --sky-color-illustration-stroke: var(--bb-color-teal-dark-100);
2691
2745
  --sky-color-text-action: var(--bb-color-blue-dark-375);
2692
2746
  --sky-color-text-action_contrast: var(--bb-color-blue-dark-200);
2693
2747
  --sky-color-text-danger: var(--bb-color-red-dark-400);
@@ -2809,6 +2863,12 @@
2809
2863
  transition: box-shadow var(--sky-global-duration-short);
2810
2864
  line-height: var(--sky-font-line_height-body-m);
2811
2865
  }
2866
+ .sky-theme-modern a.sky-btn:not(.sky-btn-link):not(.sky-btn-link-inline) {
2867
+ text-decoration-line: none;
2868
+ }
2869
+ .sky-theme-modern a.sky-btn:not(.sky-btn-link):not(.sky-btn-link-inline):hover, .sky-theme-modern a.sky-btn:not(.sky-btn-link):not(.sky-btn-link-inline):active, .sky-theme-modern a.sky-btn:not(.sky-btn-link):not(.sky-btn-link-inline):focus-visible {
2870
+ text-decoration-line: none;
2871
+ }
2812
2872
  .sky-theme-modern .sky-btn-default,
2813
2873
  .sky-theme-modern .sky-btn-primary,
2814
2874
  .sky-theme-modern .sky-btn-danger,
@@ -2839,7 +2899,7 @@
2839
2899
  .sky-theme-modern .sky-btn-icon:hover,
2840
2900
  .sky-theme-modern .sky-btn-link-inline:hover,
2841
2901
  .sky-theme-modern .sky-btn-borderless-inline:hover {
2842
- text-decoration: none;
2902
+ text-decoration-line: none;
2843
2903
  }
2844
2904
  .sky-theme-modern .sky-btn-default.sky-btn-disabled, .sky-theme-modern .sky-btn-default.sky-btn-disabled:hover, .sky-theme-modern .sky-btn-default.sky-btn-disabled:focus-visible, .sky-theme-modern .sky-btn-default.sky-btn-disabled.sky-btn-focus, .sky-theme-modern .sky-btn-default.sky-btn-disabled:active, .sky-theme-modern .sky-btn-default.sky-btn-disabled.sky-btn-active, .sky-theme-modern .sky-btn-default[disabled], .sky-theme-modern .sky-btn-default[disabled]:hover, .sky-theme-modern .sky-btn-default[disabled]:focus-visible, .sky-theme-modern .sky-btn-default[disabled].sky-btn-focus, .sky-theme-modern .sky-btn-default[disabled]:active, .sky-theme-modern .sky-btn-default[disabled].sky-btn-active,
2845
2905
  .sky-theme-modern .sky-btn-primary.sky-btn-disabled,
@@ -3174,6 +3234,21 @@
3174
3234
  }
3175
3235
  .sky-theme-modern .sky-btn-link {
3176
3236
  color: var(--sky-color-text-action);
3237
+ text-decoration-line: var(--sky-comp-override-link-text-decoration-line, var(--sky-font-text_decoration-action-tertiary-base));
3238
+ text-underline-offset: var(--sky-size-text_underline-offset);
3239
+ text-decoration-thickness: var(--sky-size-text_underline-thickness);
3240
+ }
3241
+ .sky-theme-modern .sky-btn-link:hover {
3242
+ text-decoration-line: var(--sky-comp-override-link-text-decoration-line-hover, var(--sky-font-text_decoration-action-tertiary-hover));
3243
+ }
3244
+ .sky-theme-modern .sky-btn-link:active {
3245
+ text-decoration-line: var(--sky-comp-override-link-text-decoration-line-active, var(--sky-font-text_decoration-action-tertiary-active));
3246
+ }
3247
+ .sky-theme-modern .sky-btn-link:focus-visible {
3248
+ text-decoration-line: var(--sky-comp-override-link-text-decoration-line-focus, var(--sky-font-text_decoration-action-tertiary-focus));
3249
+ }
3250
+ .sky-theme-modern .sky-btn-link.sky-btn-disabled, .sky-theme-modern .sky-btn-link.sky-btn-disabled:hover, .sky-theme-modern .sky-btn-link.sky-btn-disabled:focus-visible, .sky-theme-modern .sky-btn-link.sky-btn-disabled.sky-btn-focus, .sky-theme-modern .sky-btn-link.sky-btn-disabled:active, .sky-theme-modern .sky-btn-link.sky-btn-disabled.sky-btn-active, .sky-theme-modern .sky-btn-link[disabled], .sky-theme-modern .sky-btn-link[disabled]:hover, .sky-theme-modern .sky-btn-link[disabled]:focus-visible, .sky-theme-modern .sky-btn-link[disabled].sky-btn-focus, .sky-theme-modern .sky-btn-link[disabled]:active, .sky-theme-modern .sky-btn-link[disabled].sky-btn-active {
3251
+ text-decoration-line: var(--sky-comp-override-link-text-decoration-line-disabled, var(--sky-font-text_decoration-action-tertiary-disabled));
3177
3252
  }
3178
3253
  .sky-theme-modern .sky-btn-borderless,
3179
3254
  .sky-theme-modern .sky-btn-icon-borderless {
@@ -3298,22 +3373,28 @@
3298
3373
  border-radius: var(--sky-border-radius-s);
3299
3374
  padding: var(--sky-space-inset-balanced-none);
3300
3375
  color: var(--sky-color-text-action);
3376
+ text-decoration-line: var(--sky-comp-override-inline-link-text-decoration-line, var(--sky-font-text_decoration-inline_link-base));
3377
+ text-underline-offset: var(--sky-size-text_underline-offset);
3378
+ text-decoration-thickness: var(--sky-size-text_underline-thickness);
3301
3379
  }
3302
3380
  .sky-theme-modern .sky-btn-link-inline:focus-visible:not(:active) {
3303
3381
  background-color: transparent;
3304
3382
  box-shadow: 0 0 0 var(--sky-border-width-action-focus) var(--sky-color-border-action-tertiary-focus);
3383
+ text-decoration-line: var(--sky-comp-override-inline-link-text-decoration-line-focus, var(--sky-font-text_decoration-inline_link-focus));
3305
3384
  }
3306
3385
  .sky-theme-modern .sky-btn-link-inline:active {
3307
3386
  background-color: transparent;
3387
+ text-decoration-line: var(--sky-comp-override-inline-link-text-decoration-line-active, var(--sky-font-text_decoration-inline_link-active));
3308
3388
  }
3309
3389
  .sky-theme-modern .sky-btn-link-inline:hover {
3310
3390
  background-color: transparent;
3391
+ text-decoration-line: var(--sky-comp-override-inline-link-text-decoration-line-hover, var(--sky-font-text_decoration-inline_link-hover));
3311
3392
  }
3312
3393
  .sky-theme-modern .sky-btn-link-inline:hover, .sky-theme-modern .sky-btn-link-inline:active {
3313
3394
  color: var(--sky-color-text-action);
3314
- text-decoration: underline;
3315
3395
  }
3316
3396
  .sky-theme-modern .sky-btn-link-inline.sky-btn-disabled, .sky-theme-modern .sky-btn-link-inline.sky-btn-disabled:hover, .sky-theme-modern .sky-btn-link-inline.sky-btn-disabled:focus-visible, .sky-theme-modern .sky-btn-link-inline.sky-btn-disabled.sky-btn-focus, .sky-theme-modern .sky-btn-link-inline.sky-btn-disabled:active, .sky-theme-modern .sky-btn-link-inline.sky-btn-disabled.sky-btn-active, .sky-theme-modern .sky-btn-link-inline[disabled], .sky-theme-modern .sky-btn-link-inline[disabled]:hover, .sky-theme-modern .sky-btn-link-inline[disabled]:focus-visible, .sky-theme-modern .sky-btn-link-inline[disabled].sky-btn-focus, .sky-theme-modern .sky-btn-link-inline[disabled]:active, .sky-theme-modern .sky-btn-link-inline[disabled].sky-btn-active {
3397
+ text-decoration-line: var(--sky-comp-override-inline-link-text-decoration-line-disabled, var(--sky-font-text_decoration-inline_link-disabled));
3317
3398
  box-shadow: inset 0 0 0 0 var(--sky-color-border-action-tertiary-disabled);
3318
3399
  }
3319
3400
  .sky-theme-modern .sky-btn-link-inline.sky-btn-disabled:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link-inline.sky-btn-disabled:hover:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link-inline.sky-btn-disabled:focus-visible:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link-inline.sky-btn-disabled.sky-btn-focus:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link-inline.sky-btn-disabled:active:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link-inline.sky-btn-disabled.sky-btn-active:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link-inline[disabled]:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link-inline[disabled]:hover:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link-inline[disabled]:focus-visible:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link-inline[disabled].sky-btn-focus:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link-inline[disabled]:active:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link-inline[disabled].sky-btn-active:is(:focus-visible, .sky-btn-focus) {
@@ -3368,16 +3449,19 @@
3368
3449
  line-height: var(--sky-font-line_height-body-m);
3369
3450
  padding: var(--sky-comp-tab-horizontal-space-inset-top) var(--sky-comp-tab-horizontal-space-inset-right) var(--sky-comp-tab-horizontal-space-inset-bottom) var(--sky-comp-tab-horizontal-space-inset-left);
3370
3451
  transition: box-shadow var(--sky-global-duration-short);
3452
+ text-decoration-line: var(--sky-comp-override-inline-link-text-decoration-line, var(--sky-font-text_decoration-standalone_link-base));
3371
3453
  }
3372
3454
  .sky-theme-modern .sky-btn-tab:hover:not(.sky-btn-tab-disabled):not(.sky-btn-tab-selected):not(.sky-dropdown-button-type-tab):not(:focus-visible) {
3373
3455
  background-color: var(--sky-color-background-tab-hover);
3374
3456
  border-bottom: var(--sky-border-width-selected-s) var(--sky-border-style-accent) var(--sky-color-border-tab-hover);
3375
3457
  color: var(--sky-color-text-default);
3376
3458
  padding-bottom: calc(var(--sky-comp-tab-horizontal-space-inset-bottom) - var(--sky-border-width-selected-s));
3459
+ text-decoration-line: var(--sky-comp-override-inline-link-text-decoration-line-hover, var(--sky-font-text_decoration-standalone_link-hover));
3377
3460
  }
3378
3461
  .sky-theme-modern .sky-btn-tab:focus-visible {
3379
3462
  background-color: var(--sky-color-background-tab-focus);
3380
3463
  outline: none;
3464
+ text-decoration-line: var(--sky-comp-override-inline-link-text-decoration-line-focus, var(--sky-font-text_decoration-standalone_link-focus));
3381
3465
  }
3382
3466
  .sky-theme-modern .sky-btn-tab:focus-visible:not(.sky-btn-tab-selected) {
3383
3467
  color: var(--sky-color-text-default);
@@ -3398,6 +3482,7 @@
3398
3482
  background-color: var(--sky-color-background-tab-active);
3399
3483
  border-bottom: var(--sky-border-width-selected-s) var(--sky-border-style-accent) var(--sky-color-border-tab-active);
3400
3484
  padding-bottom: calc(var(--sky-comp-tab-horizontal-space-inset-bottom) - var(--sky-border-width-selected-s));
3485
+ text-decoration-line: var(--sky-comp-override-inline-link-text-decoration-line-active, var(--sky-font-text_decoration-standalone_link-active));
3401
3486
  }
3402
3487
  .sky-theme-modern .sky-btn-tab:active.sky-btn-tab-selected, .sky-theme-modern .sky-btn-tab:active:hover:not(.sky-btn-tab-disabled):not(.sky-btn-tab-selected):not(:focus-visible).sky-btn-tab-selected {
3403
3488
  background-color: var(--sky-color-background-selected-soft);
@@ -3429,6 +3514,7 @@
3429
3514
  .sky-theme-modern .sky-btn-tab-selected:not(.sky-btn-tab-disabled):hover:not(.sky-btn-tab-disabled) {
3430
3515
  background-color: var(--sky-color-background-tab-selected);
3431
3516
  color: var(--sky-color-text-selected);
3517
+ text-decoration-line: var(--sky-comp-override-inline-link-text-decoration-line-hover, var(--sky-font-text_decoration-standalone_link-hover));
3432
3518
  }
3433
3519
  .sky-theme-modern .sky-btn-tab-selected:not(.sky-btn-tab-disabled) .sky-btn-tab-close,
3434
3520
  .sky-theme-modern .sky-btn-tab-selected:not(.sky-btn-tab-disabled) .sky-tab-header-count {
@@ -3735,10 +3821,20 @@ body.sky-theme-modern {
3735
3821
  .sky-theme-modern a {
3736
3822
  color: var(--sky-color-text-action);
3737
3823
  border-radius: var(--sky-border-radius-s);
3824
+ text-decoration-line: var(--sky-comp-override-inline-link-text-decoration-line, var(--sky-font-text_decoration-inline_link-base));
3825
+ text-underline-offset: var(--sky-size-text_underline-offset);
3826
+ text-decoration-thickness: var(--sky-size-text_underline-thickness);
3827
+ }
3828
+ .sky-theme-modern a:hover {
3829
+ text-decoration-line: var(--sky-comp-override-inline-link-text-decoration-line-hover, var(--sky-font-text_decoration-inline_link-hover));
3830
+ }
3831
+ .sky-theme-modern a:active {
3832
+ text-decoration-line: var(--sky-comp-override-inline-link-text-decoration-line-active, var(--sky-font-text_decoration-inline_link-active));
3738
3833
  }
3739
3834
  .sky-theme-modern a:focus-visible:not(:active) {
3740
3835
  outline: none;
3741
3836
  box-shadow: 0 0 0 var(--sky-border-width-action-focus) var(--sky-color-border-action-tertiary-focus);
3837
+ text-decoration-line: var(--sky-comp-override-inline-link-text-decoration-line-focus, var(--sky-font-text_decoration-inline_link-focus));
3742
3838
  }
3743
3839
  .sky-theme-modern .sky-font-heading-1 {
3744
3840
  color: var(--sky-color-text-heading);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@skyux/theme",
3
- "version": "14.17.0",
3
+ "version": "14.18.0",
4
4
  "author": "Blackbaud, Inc.",
5
5
  "keywords": [
6
6
  "blackbaud",
@@ -20,7 +20,7 @@
20
20
  "@angular/core": "^21.2.0"
21
21
  },
22
22
  "dependencies": {
23
- "@blackbaud/skyux-design-tokens": "6.8.0",
23
+ "@blackbaud/skyux-design-tokens": "6.9.0",
24
24
  "fontfaceobserver": "2.3.0",
25
25
  "tslib": "^2.8.1"
26
26
  },