@salt-ds/theme 1.22.0 → 1.23.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 (4) hide show
  1. package/css/theme-next.css +1 -0
  2. package/css/theme.css +9 -2
  3. package/index.css +9 -2
  4. package/package.json +1 -1
package/css/theme-next.css CHANGED
@@ -727,6 +727,7 @@
727
727
  /* css/characteristics/accent-next.css */
728
728
  .salt-theme.salt-theme-next {
729
729
  --salt-accent-background: var(--salt-palette-accent);
730
+ --salt-accent-background-disabled: var(--salt-palette-accent-disabled);
730
731
  --salt-accent-borderColor: var(--salt-palette-accent);
731
732
  --salt-accent-foreground: var(--salt-palette-foreground-primary-alt);
732
733
  }
package/css/theme.css CHANGED
@@ -662,6 +662,7 @@
662
662
  /* css/palette/accent.css */
663
663
  .salt-theme[data-mode=light] {
664
664
  --salt-palette-accent-background: var(--salt-color-blue-500);
665
+ --salt-palette-accent-background-disabled: var(--salt-color-blue-500-fade-background);
665
666
  --salt-palette-accent-border: var(--salt-color-blue-500);
666
667
  --salt-palette-accent-border-disabled: var(--salt-color-blue-500-fade-border);
667
668
  --salt-palette-accent-foreground: var(--salt-color-white);
@@ -670,6 +671,7 @@
670
671
  }
671
672
  .salt-theme[data-mode=dark] {
672
673
  --salt-palette-accent-background: var(--salt-color-blue-500);
674
+ --salt-palette-accent-background-disabled: var(--salt-color-blue-500-fade-background);
673
675
  --salt-palette-accent-border: var(--salt-color-blue-500);
674
676
  --salt-palette-accent-border-disabled: var(--salt-color-blue-500-fade-border);
675
677
  --salt-palette-accent-foreground: var(--salt-color-white);
@@ -866,6 +868,8 @@
866
868
  --salt-palette-interact-cta-foreground-active: var(--salt-color-white);
867
869
  --salt-palette-interact-cta-foreground-disabled: var(--salt-color-white-fade-foreground);
868
870
  --salt-palette-interact-cta-foreground-hover: var(--salt-color-white);
871
+ --salt-palette-interact-cta-border-hover: var(--salt-color-blue-500);
872
+ --salt-palette-interact-cta-border-active: var(--salt-color-blue-700);
869
873
  --salt-palette-interact-primary-background: var(--salt-color-gray-60);
870
874
  --salt-palette-interact-primary-background-active: var(--salt-color-gray-200);
871
875
  --salt-palette-interact-primary-background-disabled: var(--salt-color-gray-60-fade-background);
@@ -911,6 +915,8 @@
911
915
  --salt-palette-interact-cta-foreground-active: var(--salt-color-white);
912
916
  --salt-palette-interact-cta-foreground-disabled: var(--salt-color-white-fade-foreground);
913
917
  --salt-palette-interact-cta-foreground-hover: var(--salt-color-white);
918
+ --salt-palette-interact-cta-border-hover: var(--salt-color-blue-500);
919
+ --salt-palette-interact-cta-border-active: var(--salt-color-blue-700);
914
920
  --salt-palette-interact-primary-background: var(--salt-color-gray-300);
915
921
  --salt-palette-interact-primary-background-active: var(--salt-color-gray-70);
916
922
  --salt-palette-interact-primary-background-disabled: var(--salt-color-gray-300-fade-background);
@@ -1132,6 +1138,7 @@
1132
1138
  /* css/characteristics/accent.css */
1133
1139
  .salt-theme {
1134
1140
  --salt-accent-background: var(--salt-palette-accent-background);
1141
+ --salt-accent-background-disabled: var(--salt-palette-accent-background-disabled);
1135
1142
  --salt-accent-borderColor: var(--salt-palette-accent-border);
1136
1143
  --salt-accent-foreground: var(--salt-palette-accent-foreground);
1137
1144
  }
@@ -1169,9 +1176,9 @@
1169
1176
  --salt-actionable-accented-background-disabled: var(--salt-palette-interact-background);
1170
1177
  --salt-actionable-accented-background-hover: var(--salt-palette-interact-cta-background-hover);
1171
1178
  --salt-actionable-accented-background: var(--salt-palette-interact-background);
1172
- --salt-actionable-accented-borderColor-active: var(--salt-palette-interact-border-none);
1179
+ --salt-actionable-accented-borderColor-active: var(--salt-palette-interact-cta-border-active);
1173
1180
  --salt-actionable-accented-borderColor-disabled: var(--salt-palette-accent-border-disabled);
1174
- --salt-actionable-accented-borderColor-hover: var(--salt-palette-interact-border-none);
1181
+ --salt-actionable-accented-borderColor-hover: var(--salt-palette-interact-cta-border-hover);
1175
1182
  --salt-actionable-accented-borderColor: var(--salt-palette-accent-border);
1176
1183
  --salt-actionable-accented-foreground-active: var(--salt-palette-interact-cta-foreground);
1177
1184
  --salt-actionable-accented-foreground-disabled: var(--salt-palette-accent-foreground-informative-disabled);
package/index.css CHANGED
@@ -691,6 +691,7 @@
691
691
  /* css/palette/accent.css */
692
692
  .salt-theme[data-mode=light] {
693
693
  --salt-palette-accent-background: var(--salt-color-blue-500);
694
+ --salt-palette-accent-background-disabled: var(--salt-color-blue-500-fade-background);
694
695
  --salt-palette-accent-border: var(--salt-color-blue-500);
695
696
  --salt-palette-accent-border-disabled: var(--salt-color-blue-500-fade-border);
696
697
  --salt-palette-accent-foreground: var(--salt-color-white);
@@ -699,6 +700,7 @@
699
700
  }
700
701
  .salt-theme[data-mode=dark] {
701
702
  --salt-palette-accent-background: var(--salt-color-blue-500);
703
+ --salt-palette-accent-background-disabled: var(--salt-color-blue-500-fade-background);
702
704
  --salt-palette-accent-border: var(--salt-color-blue-500);
703
705
  --salt-palette-accent-border-disabled: var(--salt-color-blue-500-fade-border);
704
706
  --salt-palette-accent-foreground: var(--salt-color-white);
@@ -895,6 +897,8 @@
895
897
  --salt-palette-interact-cta-foreground-active: var(--salt-color-white);
896
898
  --salt-palette-interact-cta-foreground-disabled: var(--salt-color-white-fade-foreground);
897
899
  --salt-palette-interact-cta-foreground-hover: var(--salt-color-white);
900
+ --salt-palette-interact-cta-border-hover: var(--salt-color-blue-500);
901
+ --salt-palette-interact-cta-border-active: var(--salt-color-blue-700);
898
902
  --salt-palette-interact-primary-background: var(--salt-color-gray-60);
899
903
  --salt-palette-interact-primary-background-active: var(--salt-color-gray-200);
900
904
  --salt-palette-interact-primary-background-disabled: var(--salt-color-gray-60-fade-background);
@@ -940,6 +944,8 @@
940
944
  --salt-palette-interact-cta-foreground-active: var(--salt-color-white);
941
945
  --salt-palette-interact-cta-foreground-disabled: var(--salt-color-white-fade-foreground);
942
946
  --salt-palette-interact-cta-foreground-hover: var(--salt-color-white);
947
+ --salt-palette-interact-cta-border-hover: var(--salt-color-blue-500);
948
+ --salt-palette-interact-cta-border-active: var(--salt-color-blue-700);
943
949
  --salt-palette-interact-primary-background: var(--salt-color-gray-300);
944
950
  --salt-palette-interact-primary-background-active: var(--salt-color-gray-70);
945
951
  --salt-palette-interact-primary-background-disabled: var(--salt-color-gray-300-fade-background);
@@ -1161,6 +1167,7 @@
1161
1167
  /* css/characteristics/accent.css */
1162
1168
  .salt-theme {
1163
1169
  --salt-accent-background: var(--salt-palette-accent-background);
1170
+ --salt-accent-background-disabled: var(--salt-palette-accent-background-disabled);
1164
1171
  --salt-accent-borderColor: var(--salt-palette-accent-border);
1165
1172
  --salt-accent-foreground: var(--salt-palette-accent-foreground);
1166
1173
  }
@@ -1198,9 +1205,9 @@
1198
1205
  --salt-actionable-accented-background-disabled: var(--salt-palette-interact-background);
1199
1206
  --salt-actionable-accented-background-hover: var(--salt-palette-interact-cta-background-hover);
1200
1207
  --salt-actionable-accented-background: var(--salt-palette-interact-background);
1201
- --salt-actionable-accented-borderColor-active: var(--salt-palette-interact-border-none);
1208
+ --salt-actionable-accented-borderColor-active: var(--salt-palette-interact-cta-border-active);
1202
1209
  --salt-actionable-accented-borderColor-disabled: var(--salt-palette-accent-border-disabled);
1203
- --salt-actionable-accented-borderColor-hover: var(--salt-palette-interact-border-none);
1210
+ --salt-actionable-accented-borderColor-hover: var(--salt-palette-interact-cta-border-hover);
1204
1211
  --salt-actionable-accented-borderColor: var(--salt-palette-accent-border);
1205
1212
  --salt-actionable-accented-foreground-active: var(--salt-palette-interact-cta-foreground);
1206
1213
  --salt-actionable-accented-foreground-disabled: var(--salt-palette-accent-foreground-informative-disabled);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@salt-ds/theme",
3
- "version": "1.22.0",
3
+ "version": "1.23.0",
4
4
  "license": "Apache-2.0",
5
5
  "repository": {
6
6
  "type": "git",