@pareto-engineering/design-system 4.0.0-alpha.36 → 4.0.0-alpha.37

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.
@@ -14,8 +14,8 @@ $default-input-border-radius: var(--theme-default-input-border-radius);
14
14
  $default-border: var(--theme-default-input-border);
15
15
  $hover-border: var(--theme-hover-input-border);
16
16
  $focus-border: var(--theme-focus-input-border);
17
- $default-background: var(--theme-default-input-background);
18
- $disabled-background: var(--theme-disabled-input-background);
17
+ $default-background: var(--background-inputs);
18
+ $disabled-background: var(--background-inputs-30);
19
19
 
20
20
  .#{bem.$base}.choices-input {
21
21
  &.#{bem.$base}.input-wrapper {
@@ -13,8 +13,8 @@ $default-input-border-radius: var(--theme-default-input-border-radius);
13
13
  $default-border: var(--theme-default-input-border);
14
14
  $hover-border: var(--theme-hover-input-border);
15
15
  $focus-border: var(--theme-focus-input-border);
16
- $default-background: var(--theme-default-input-background);
17
- $disabled-background: var(--theme-disabled-input-background);
16
+ $default-background: var(--background-inputs);
17
+ $disabled-background: var(--background-inputs-30);
18
18
 
19
19
  .#{bem.$base}.combobox,
20
20
  .#{bem.$base}.multiple-combobox {
@@ -12,8 +12,8 @@ $default-input-border-radius: var(--theme-default-input-border-radius);
12
12
  $default-border: var(--theme-default-input-border);
13
13
  $hover-border: var(--theme-hover-input-border);
14
14
  $focus-border: var(--theme-focus-input-border);
15
- $default-background: var(--theme-default-input-background);
16
- $disabled-background: var(--theme-disabled-input-background);
15
+ $default-background: var(--background-inputs);
16
+ $disabled-background: var(--background-inputs-30);
17
17
 
18
18
  .#{bem.$base}.select-input {
19
19
  &.#{bem.$base}.label {
@@ -62,6 +62,7 @@ $disabled-background: var(--theme-disabled-input-background);
62
62
 
63
63
  select {
64
64
  appearance: none;
65
+ background-color: $default-background;
65
66
  background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMTIiIHZpZXdCb3g9IjAgMCAyMCAxMiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTE5IDEuNUwxMCAxMC41TDEgMS41IiBzdHJva2U9IiM0QzRENTMiIHN0cm9rZS13aWR0aD0iMiIvPgo8L3N2Zz4=");
66
67
  background-position: calc(100% - $default-spacing-size);
67
68
  background-repeat: no-repeat;
@@ -15,8 +15,8 @@ $default-input-border-radius: var(--theme-default-input-border-radius);
15
15
  $default-border: var(--theme-default-input-border);
16
16
  $hover-border: var(--theme-hover-input-border);
17
17
  $focus-border: var(--theme-focus-input-border);
18
- $default-background: var(--theme-default-input-background);
19
- $disabled-background: var(--theme-disabled-input-background);
18
+ $default-background: var(--background-inputs);
19
+ $disabled-background: var(--background-inputs-30);
20
20
 
21
21
  .#{bem.$base}.text-input {
22
22
  &.#{bem.$base}.input-wrapper {
@@ -10,8 +10,8 @@ $default-input-border-radius: var(--theme-default-input-border-radius);
10
10
  $default-border: var(--theme-default-input-border);
11
11
  $hover-border: var(--theme-hover-input-border);
12
12
  $focus-border: var(--theme-focus-input-border);
13
- $default-background: var(--theme-default-input-background);
14
- $disabled-background: var(--theme-disabled-input-background);
13
+ $default-background: var(--background-inputs);
14
+ $disabled-background: var(--background-inputs-30);
15
15
 
16
16
  .#{bem.$base}.text-area-input {
17
17
  &.#{bem.$base}.input-wrapper {
@@ -14,8 +14,8 @@ $default-input-border-radius: var(--theme-default-input-border-radius);
14
14
  $default-border: var(--theme-default-input-border);
15
15
  $hover-border: var(--theme-hover-input-border);
16
16
  $focus-border: var(--theme-focus-input-border);
17
- $default-background: var(--theme-default-input-background);
18
- $disabled-background: var(--theme-disabled-input-background);
17
+ $default-background: var(--background-inputs);
18
+ $disabled-background: var(--background-inputs-30);
19
19
 
20
20
  .#{bem.$base}.choices-input {
21
21
  &.#{bem.$base}.input-wrapper {
@@ -13,8 +13,8 @@ $default-input-border-radius: var(--theme-default-input-border-radius);
13
13
  $default-border: var(--theme-default-input-border);
14
14
  $hover-border: var(--theme-hover-input-border);
15
15
  $focus-border: var(--theme-focus-input-border);
16
- $default-background: var(--theme-default-input-background);
17
- $disabled-background: var(--theme-disabled-input-background);
16
+ $default-background: var(--background-inputs);
17
+ $disabled-background: var(--background-inputs-30);
18
18
 
19
19
  .#{bem.$base}.combobox,
20
20
  .#{bem.$base}.multiple-combobox {
@@ -12,8 +12,8 @@ $default-input-border-radius: var(--theme-default-input-border-radius);
12
12
  $default-border: var(--theme-default-input-border);
13
13
  $hover-border: var(--theme-hover-input-border);
14
14
  $focus-border: var(--theme-focus-input-border);
15
- $default-background: var(--theme-default-input-background);
16
- $disabled-background: var(--theme-disabled-input-background);
15
+ $default-background: var(--background-inputs);
16
+ $disabled-background: var(--background-inputs-30);
17
17
 
18
18
  .#{bem.$base}.select-input {
19
19
  &.#{bem.$base}.label {
@@ -62,6 +62,7 @@ $disabled-background: var(--theme-disabled-input-background);
62
62
 
63
63
  select {
64
64
  appearance: none;
65
+ background-color: $default-background;
65
66
  background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMTIiIHZpZXdCb3g9IjAgMCAyMCAxMiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTE5IDEuNUwxMCAxMC41TDEgMS41IiBzdHJva2U9IiM0QzRENTMiIHN0cm9rZS13aWR0aD0iMiIvPgo8L3N2Zz4=");
66
67
  background-position: calc(100% - $default-spacing-size);
67
68
  background-repeat: no-repeat;
@@ -15,8 +15,8 @@ $default-input-border-radius: var(--theme-default-input-border-radius);
15
15
  $default-border: var(--theme-default-input-border);
16
16
  $hover-border: var(--theme-hover-input-border);
17
17
  $focus-border: var(--theme-focus-input-border);
18
- $default-background: var(--theme-default-input-background);
19
- $disabled-background: var(--theme-disabled-input-background);
18
+ $default-background: var(--background-inputs);
19
+ $disabled-background: var(--background-inputs-30);
20
20
 
21
21
  .#{bem.$base}.text-input {
22
22
  &.#{bem.$base}.input-wrapper {
@@ -10,8 +10,8 @@ $default-input-border-radius: var(--theme-default-input-border-radius);
10
10
  $default-border: var(--theme-default-input-border);
11
11
  $hover-border: var(--theme-hover-input-border);
12
12
  $focus-border: var(--theme-focus-input-border);
13
- $default-background: var(--theme-default-input-background);
14
- $disabled-background: var(--theme-disabled-input-background);
13
+ $default-background: var(--background-inputs);
14
+ $disabled-background: var(--background-inputs-30);
15
15
 
16
16
  .#{bem.$base}.text-area-input {
17
17
  &.#{bem.$base}.input-wrapper {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@pareto-engineering/design-system",
3
- "version": "4.0.0-alpha.36",
3
+ "version": "4.0.0-alpha.37",
4
4
  "description": "",
5
5
  "main": "dist/cjs/index.js",
6
6
  "module": "dist/es/index.js",
@@ -68,5 +68,5 @@
68
68
  "relay-test-utils": "^15.0.0"
69
69
  },
70
70
  "browserslist": "> 2%",
71
- "gitHead": "4dc53480a5291f6c20adad65bbcaf9fafe2cfa02"
71
+ "gitHead": "a8f3ccb1df8b4de05c21fbd6416d553efea9f1a5"
72
72
  }
@@ -14,8 +14,8 @@ $default-input-border-radius: var(--theme-default-input-border-radius);
14
14
  $default-border: var(--theme-default-input-border);
15
15
  $hover-border: var(--theme-hover-input-border);
16
16
  $focus-border: var(--theme-focus-input-border);
17
- $default-background: var(--theme-default-input-background);
18
- $disabled-background: var(--theme-disabled-input-background);
17
+ $default-background: var(--background-inputs);
18
+ $disabled-background: var(--background-inputs-30);
19
19
 
20
20
  .#{bem.$base}.choices-input {
21
21
  &.#{bem.$base}.input-wrapper {
@@ -13,8 +13,8 @@ $default-input-border-radius: var(--theme-default-input-border-radius);
13
13
  $default-border: var(--theme-default-input-border);
14
14
  $hover-border: var(--theme-hover-input-border);
15
15
  $focus-border: var(--theme-focus-input-border);
16
- $default-background: var(--theme-default-input-background);
17
- $disabled-background: var(--theme-disabled-input-background);
16
+ $default-background: var(--background-inputs);
17
+ $disabled-background: var(--background-inputs-30);
18
18
 
19
19
  .#{bem.$base}.combobox,
20
20
  .#{bem.$base}.multiple-combobox {
@@ -12,8 +12,8 @@ $default-input-border-radius: var(--theme-default-input-border-radius);
12
12
  $default-border: var(--theme-default-input-border);
13
13
  $hover-border: var(--theme-hover-input-border);
14
14
  $focus-border: var(--theme-focus-input-border);
15
- $default-background: var(--theme-default-input-background);
16
- $disabled-background: var(--theme-disabled-input-background);
15
+ $default-background: var(--background-inputs);
16
+ $disabled-background: var(--background-inputs-30);
17
17
 
18
18
  .#{bem.$base}.select-input {
19
19
  &.#{bem.$base}.label {
@@ -62,6 +62,7 @@ $disabled-background: var(--theme-disabled-input-background);
62
62
 
63
63
  select {
64
64
  appearance: none;
65
+ background-color: $default-background;
65
66
  background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMTIiIHZpZXdCb3g9IjAgMCAyMCAxMiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTE5IDEuNUwxMCAxMC41TDEgMS41IiBzdHJva2U9IiM0QzRENTMiIHN0cm9rZS13aWR0aD0iMiIvPgo8L3N2Zz4=");
66
67
  background-position: calc(100% - $default-spacing-size);
67
68
  background-repeat: no-repeat;
@@ -15,8 +15,8 @@ $default-input-border-radius: var(--theme-default-input-border-radius);
15
15
  $default-border: var(--theme-default-input-border);
16
16
  $hover-border: var(--theme-hover-input-border);
17
17
  $focus-border: var(--theme-focus-input-border);
18
- $default-background: var(--theme-default-input-background);
19
- $disabled-background: var(--theme-disabled-input-background);
18
+ $default-background: var(--background-inputs);
19
+ $disabled-background: var(--background-inputs-30);
20
20
 
21
21
  .#{bem.$base}.text-input {
22
22
  &.#{bem.$base}.input-wrapper {
@@ -10,8 +10,8 @@ $default-input-border-radius: var(--theme-default-input-border-radius);
10
10
  $default-border: var(--theme-default-input-border);
11
11
  $hover-border: var(--theme-hover-input-border);
12
12
  $focus-border: var(--theme-focus-input-border);
13
- $default-background: var(--theme-default-input-background);
14
- $disabled-background: var(--theme-disabled-input-background);
13
+ $default-background: var(--background-inputs);
14
+ $disabled-background: var(--background-inputs-30);
15
15
 
16
16
  .#{bem.$base}.text-area-input {
17
17
  &.#{bem.$base}.input-wrapper {