@salt-ds/theme 1.10.1 → 1.11.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 (4) hide show
  1. package/css/global.css +1 -1
  2. package/css/theme.css +6 -5
  3. package/index.css +7 -6
  4. package/package.json +1 -1
package/css/global.css CHANGED
@@ -6,7 +6,7 @@
6
6
  letter-spacing: var(--salt-text-letterSpacing);
7
7
  line-height: var(--salt-text-lineHeight);
8
8
  }
9
- ::selection {
9
+ .salt-theme ::selection {
10
10
  background: var(--salt-content-foreground-highlight);
11
11
  }
12
12
  .salt-theme[data-mode=light] {
package/css/theme.css CHANGED
@@ -9,8 +9,8 @@
9
9
  --salt-animation-scale-end: 1;
10
10
  --salt-animation-transform-start: 100%;
11
11
  --salt-animation-transform-end: 0;
12
- --salt-animation-duration: 0.3s;
13
- --salt-animation-timing-function: ease-in;
12
+ --salt-animation-duration: var(--salt-duration-perceptible);
13
+ --salt-animation-timing-function: ease-in-out;
14
14
  --salt-animation-slide-in-top: slide-in-top var(--salt-animation-duration) var(--salt-animation-timing-function);
15
15
  --salt-animation-slide-in-left: slide-in-left var(--salt-animation-duration) var(--salt-animation-timing-function);
16
16
  --salt-animation-slide-in-right: slide-in-right var(--salt-animation-duration) var(--salt-animation-timing-function);
@@ -22,7 +22,7 @@
22
22
  --salt-animation-fade-in-back: fade-in-back var(--salt-animation-duration) var(--salt-animation-timing-function);
23
23
  --salt-animation-fade-in-forward: fade-in-forward var(--salt-animation-duration) var(--salt-animation-timing-function);
24
24
  --salt-animation-fade-in-center: fade-in-center var(--salt-animation-duration) var(--salt-animation-timing-function);
25
- --salt-animation-fade-out-back: fade-out-back var(--salt-animation-duration) ease-out both;
25
+ --salt-animation-fade-out-back: fade-out-back var(--salt-animation-duration) ease-in-out both;
26
26
  }
27
27
  @keyframes slide-in-top {
28
28
  0% {
@@ -306,7 +306,8 @@
306
306
  --salt-color-gray-20-fade-background-readonly: rgba(234, 237, 239, var(--salt-palette-opacity-background-readonly));
307
307
  --salt-color-gray-600-fade-background-readonly: rgba(47, 49, 54, var(--salt-palette-opacity-background-readonly));
308
308
  --salt-color-gray-800-fade-background-readonly: rgba(36, 37, 38, var(--salt-palette-opacity-background-readonly));
309
- --salt-color-black-fade-backdrop: rgba(36, 37, 38, var(--salt-palette-opacity-backdrop));
309
+ --salt-color-white-fade-backdrop: rgba(255, 255, 255, var(--salt-palette-opacity-backdrop));
310
+ --salt-color-black-fade-backdrop: rgba(0, 0, 0, var(--salt-palette-opacity-backdrop));
310
311
  --salt-color-blue-100-fade-fill: rgba(100, 177, 228, var(--salt-palette-opacity-disabled));
311
312
  --salt-color-blue-600-fade-fill: rgba(21, 92, 147, var(--salt-palette-opacity-disabled));
312
313
  --salt-color-white-fade-separatorOpacity-primary: rgba(255, 255, 255, var(--salt-palette-opacity-primary-border));
@@ -1077,6 +1078,7 @@
1077
1078
  --salt-track-borderStyle-active: solid;
1078
1079
  --salt-track-borderStyle-complete: solid;
1079
1080
  --salt-track-borderStyle-incomplete: dotted;
1081
+ --salt-track-borderColor: var(--salt-palette-neutral-secondary-border);
1080
1082
  }
1081
1083
 
1082
1084
  /* css/deprecated/characteristics.css */
@@ -1198,7 +1200,6 @@
1198
1200
  --salt-track-textAlign: center;
1199
1201
  --salt-track-background: var(--salt-palette-track-background);
1200
1202
  --salt-track-background-disabled: var(--salt-palette-track-background-disabled);
1201
- --salt-track-borderColor: var(--salt-palette-track-border);
1202
1203
  --salt-track-borderColor-disabled: var(--salt-palette-track-border-disabled);
1203
1204
  --salt-taggable-cursor-hover: pointer;
1204
1205
  --salt-taggable-cursor-active: pointer;
package/index.css CHANGED
@@ -6,7 +6,7 @@
6
6
  letter-spacing: var(--salt-text-letterSpacing);
7
7
  line-height: var(--salt-text-lineHeight);
8
8
  }
9
- ::selection {
9
+ .salt-theme ::selection {
10
10
  background: var(--salt-content-foreground-highlight);
11
11
  }
12
12
  .salt-theme[data-mode=light] {
@@ -43,8 +43,8 @@
43
43
  --salt-animation-scale-end: 1;
44
44
  --salt-animation-transform-start: 100%;
45
45
  --salt-animation-transform-end: 0;
46
- --salt-animation-duration: 0.3s;
47
- --salt-animation-timing-function: ease-in;
46
+ --salt-animation-duration: var(--salt-duration-perceptible);
47
+ --salt-animation-timing-function: ease-in-out;
48
48
  --salt-animation-slide-in-top: slide-in-top var(--salt-animation-duration) var(--salt-animation-timing-function);
49
49
  --salt-animation-slide-in-left: slide-in-left var(--salt-animation-duration) var(--salt-animation-timing-function);
50
50
  --salt-animation-slide-in-right: slide-in-right var(--salt-animation-duration) var(--salt-animation-timing-function);
@@ -56,7 +56,7 @@
56
56
  --salt-animation-fade-in-back: fade-in-back var(--salt-animation-duration) var(--salt-animation-timing-function);
57
57
  --salt-animation-fade-in-forward: fade-in-forward var(--salt-animation-duration) var(--salt-animation-timing-function);
58
58
  --salt-animation-fade-in-center: fade-in-center var(--salt-animation-duration) var(--salt-animation-timing-function);
59
- --salt-animation-fade-out-back: fade-out-back var(--salt-animation-duration) ease-out both;
59
+ --salt-animation-fade-out-back: fade-out-back var(--salt-animation-duration) ease-in-out both;
60
60
  }
61
61
  @keyframes slide-in-top {
62
62
  0% {
@@ -340,7 +340,8 @@
340
340
  --salt-color-gray-20-fade-background-readonly: rgba(234, 237, 239, var(--salt-palette-opacity-background-readonly));
341
341
  --salt-color-gray-600-fade-background-readonly: rgba(47, 49, 54, var(--salt-palette-opacity-background-readonly));
342
342
  --salt-color-gray-800-fade-background-readonly: rgba(36, 37, 38, var(--salt-palette-opacity-background-readonly));
343
- --salt-color-black-fade-backdrop: rgba(36, 37, 38, var(--salt-palette-opacity-backdrop));
343
+ --salt-color-white-fade-backdrop: rgba(255, 255, 255, var(--salt-palette-opacity-backdrop));
344
+ --salt-color-black-fade-backdrop: rgba(0, 0, 0, var(--salt-palette-opacity-backdrop));
344
345
  --salt-color-blue-100-fade-fill: rgba(100, 177, 228, var(--salt-palette-opacity-disabled));
345
346
  --salt-color-blue-600-fade-fill: rgba(21, 92, 147, var(--salt-palette-opacity-disabled));
346
347
  --salt-color-white-fade-separatorOpacity-primary: rgba(255, 255, 255, var(--salt-palette-opacity-primary-border));
@@ -1111,6 +1112,7 @@
1111
1112
  --salt-track-borderStyle-active: solid;
1112
1113
  --salt-track-borderStyle-complete: solid;
1113
1114
  --salt-track-borderStyle-incomplete: dotted;
1115
+ --salt-track-borderColor: var(--salt-palette-neutral-secondary-border);
1114
1116
  }
1115
1117
 
1116
1118
  /* css/deprecated/characteristics.css */
@@ -1232,7 +1234,6 @@
1232
1234
  --salt-track-textAlign: center;
1233
1235
  --salt-track-background: var(--salt-palette-track-background);
1234
1236
  --salt-track-background-disabled: var(--salt-palette-track-background-disabled);
1235
- --salt-track-borderColor: var(--salt-palette-track-border);
1236
1237
  --salt-track-borderColor-disabled: var(--salt-palette-track-border-disabled);
1237
1238
  --salt-taggable-cursor-hover: pointer;
1238
1239
  --salt-taggable-cursor-active: pointer;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@salt-ds/theme",
3
- "version": "1.10.1",
3
+ "version": "1.11.1",
4
4
  "license": "Apache-2.0",
5
5
  "repository": {
6
6
  "type": "git",