@navikt/ds-css 0.18.11 → 0.18.12

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/dist/index.css +26 -63
  2. package/form/confirmation-panel.css +6 -66
  3. package/loader.css +18 -1
  4. package/package.json +2 -2
package/form/confirmation-panel.css CHANGED
@@ -5,6 +5,9 @@
5
5
  --navds-confirmation-panel-color-background-checked: var(
6
6
  --navds-global-color-green-50
7
7
  );
8
+ --navds-confirmation-panel-color-background-error: var(
9
+ --navds-global-color-red-50
10
+ );
8
11
  --navds-confirmation-panel-color-border: var(
9
12
  --navds-semantic-color-feedback-warning-border
10
13
  );
@@ -12,32 +15,14 @@
12
15
  --navds-semantic-color-feedback-success-border
13
16
  );
14
17
  --navds-confirmation-panel-color-border-error: var(
15
- --navds-semantic-color-feedback-danger-background
16
- );
17
- --navds-confirmation-panel-color-background-error: var(
18
- --navds-global-color-red-50
19
- );
20
- --navds-confirmation-panel-color-checkbox-background-checked-hover: var(
21
- --navds-global-color-green-700
22
- );
23
- --navds-confirmation-panel-color-checkbox-border-checked-hover: var(
24
- --navds-global-color-green-700
25
- );
26
- --navds-confirmation-panel-color-checkbox-background-checked: var(
27
- --navds-global-color-green-500
28
- );
29
- --navds-confirmation-panel-color-checkbox-border-checked: var(
30
- --navds-semantic-color-feedback-success-border
31
- );
32
- --navds-confirmation-panel-color-checkbox-label-checked: var(
33
- --navds-semantic-color-text
18
+ --navds-semantic-color-feedback-danger-border
34
19
  );
35
20
  }
36
21
 
37
22
  .navds-confirmation-panel__inner {
38
23
  display: flex;
39
24
  flex-direction: column;
40
- gap: var(--navds-spacing-4);
25
+ gap: var(--navds-spacing-3);
41
26
  padding: var(--navds-spacing-4);
42
27
  border-radius: var(--navds-border-radius-medium);
43
28
  border: 1px solid var(--navds-confirmation-panel-color-border);
@@ -49,11 +34,6 @@
49
34
  max-width: 80ch;
50
35
  }
51
36
 
52
- .navds-confirmation-panel--small .navds-confirmation-panel__inner {
53
- padding: var(--navds-spacing-3);
54
- gap: var(--navds-spacing-2);
55
- }
56
-
57
37
  .navds-confirmation-panel--checked .navds-confirmation-panel__inner {
58
38
  background-color: var(--navds-confirmation-panel-color-background-checked);
59
39
  border-color: var(--navds-confirmation-panel-color-border-checked);
@@ -61,45 +41,5 @@
61
41
 
62
42
  .navds-confirmation-panel--error .navds-confirmation-panel__inner {
63
43
  background-color: var(--navds-confirmation-panel-color-background-error);
64
- border: 1px solid transparent;
65
- }
66
-
67
- .navds-confirmation-panel
68
- .navds-checkbox__input:hover
69
- + .navds-checkbox__label {
70
- text-decoration: underline;
71
- }
72
-
73
- .navds-confirmation-panel--checked
74
- .navds-checkbox__input:hover
75
- + .navds-checkbox__label {
76
- color: var(--navds-confirmation-panel-color-checkbox-label-checked);
77
- }
78
-
79
- .navds-confirmation-panel--checked
80
- .navds-checkbox__input
81
- + .navds-checkbox__label::before {
82
- transition: none;
83
- background-color: var(
84
- --navds-confirmation-panel-color-checkbox-background-checked
85
- );
86
- border-color: var(--navds-confirmation-panel-color-checkbox-border-checked);
87
- background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMyAxMCI+ICAgIDxnPiAgICA8cGF0aCBmaWxsPSIjRkZGRkZGIiBkPSJNNCwxMGMtMC40LDAtMC44LTAuMS0xLjEtMC40TDAuNCw3LjFDMC4xLDYuOCwwLDYuNCwwLDZzMC4yLTAuOCwwLjUtMS4xQzEsNC40LDIsNC40LDIuNSw0LjlMNCw2LjRsNi40LTYgICAgQzEwLjgsMC4xLDExLjEsMCwxMS41LDBjMC40LDAsMC44LDAuMiwxLDAuNWMwLjYsMC42LDAuNSwxLjYtMC4xLDIuMXYwTDUsOS42QzQuNyw5LjksNC40LDEwLDQsMTB6IE0xMS44LDEuOUwxMS44LDEuOSAgICBDMTEuOCwxLjksMTEuOCwxLjksMTEuOCwxLjl6IE0xMS4yLDEuMUMxMS4yLDEuMSwxMS4yLDEuMSwxMS4yLDEuMUwxMS4yLDEuMXoiLz4gICAgPC9nPjwvc3ZnPg==);
88
- }
89
-
90
- .navds-confirmation-panel--checked
91
- .navds-checkbox__input:hover
92
- + .navds-checkbox__label::before {
93
- background-color: var(
94
- --navds-confirmation-panel-color-checkbox-background-checked-hover
95
- );
96
- border-color: var(
97
- --navds-confirmation-panel-color-checkbox-border-checked-hover
98
- );
99
- }
100
-
101
- .navds-confirmation-panel--checked
102
- .navds-checkbox__input:focus:hover
103
- + .navds-checkbox__label::before {
104
- background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMyAxMCI+ICAgIDxnPiAgICA8cGF0aCBmaWxsPSIjRkZGRkZGIiBkPSJNNCwxMGMtMC40LDAtMC44LTAuMS0xLjEtMC40TDAuNCw3LjFDMC4xLDYuOCwwLDYuNCwwLDZzMC4yLTAuOCwwLjUtMS4xQzEsNC40LDIsNC40LDIuNSw0LjlMNCw2LjRsNi40LTYgICAgQzEwLjgsMC4xLDExLjEsMCwxMS41LDBjMC40LDAsMC44LDAuMiwxLDAuNWMwLjYsMC42LDAuNSwxLjYtMC4xLDIuMXYwTDUsOS42QzQuNyw5LjksNC40LDEwLDQsMTB6IE0xMS44LDEuOUwxMS44LDEuOSAgICBDMTEuOCwxLjksMTEuOCwxLjksMTEuOCwxLjl6IE0xMS4yLDEuMUMxMS4yLDEuMSwxMS4yLDEuMSwxMS4yLDEuMUwxMS4yLDEuMXoiLz4gICAgPC9nPjwvc3ZnPg==);
44
+ border-color: var(--navds-confirmation-panel-color-border-error);
105
45
  }
package/loader.css CHANGED
@@ -10,7 +10,7 @@
10
10
  --navds-loader-color-inverted-foreground: var(
11
11
  --navds-semantic-color-component-background-light
12
12
  );
13
- --navds-loader-color-inverted-background: rgb(255 255 255 / 0.3);
13
+ --navds-loader-color-inverted-background: var(--navds-global-color-gray-600);
14
14
  --navds-loader-color-transparent-background: transparent;
15
15
  }
16
16
 
@@ -20,6 +20,8 @@
20
20
  position: relative;
21
21
  animation: loader-rotate 1.8s linear infinite;
22
22
  stroke-width: 6;
23
+
24
+ --navds-loader-background-stroke-width: 5.9;
23
25
  }
24
26
 
25
27
  .navds-loader__foreground {
@@ -31,6 +33,7 @@
31
33
 
32
34
  .navds-loader__background {
33
35
  stroke: var(--navds-loader-color-background);
36
+ stroke-width: var(--navds-loader-background-stroke-width);
34
37
  }
35
38
 
36
39
  .navds-loader--neutral .navds-loader__foreground {
@@ -56,36 +59,50 @@
56
59
  .navds-loader--3xlarge {
57
60
  width: 5.5rem;
58
61
  stroke-width: 5;
62
+
63
+ --navds-loader-background-stroke-width: 4.8;
59
64
  }
60
65
 
61
66
  .navds-loader--2xlarge {
62
67
  width: 4rem;
63
68
  stroke-width: 6;
69
+
70
+ --navds-loader-background-stroke-width: 5.8;
64
71
  }
65
72
 
66
73
  .navds-loader--xlarge {
67
74
  width: 2.5rem;
68
75
  stroke-width: 6;
76
+
77
+ --navds-loader-background-stroke-width: 5.8;
69
78
  }
70
79
 
71
80
  .navds-loader--large {
72
81
  width: 2rem;
73
82
  stroke-width: 7;
83
+
84
+ --navds-loader-background-stroke-width: 6.8;
74
85
  }
75
86
 
76
87
  .navds-loader--medium {
77
88
  width: 1.5rem;
78
89
  stroke-width: 7;
90
+
91
+ --navds-loader-background-stroke-width: 6.8;
79
92
  }
80
93
 
81
94
  .navds-loader--small {
82
95
  width: 1.25rem;
83
96
  stroke-width: 8;
97
+
98
+ --navds-loader-background-stroke-width: 7.8;
84
99
  }
85
100
 
86
101
  .navds-loader--xsmall {
87
102
  width: 1rem;
88
103
  stroke-width: 8;
104
+
105
+ --navds-loader-background-stroke-width: 7.8;
89
106
  }
90
107
 
91
108
  @keyframes loader-rotate {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@navikt/ds-css",
3
- "version": "0.18.11",
3
+ "version": "0.18.12",
4
4
  "description": "Css for NAV Designsystem components",
5
5
  "author": "NAV Designsystem team",
6
6
  "keywords": [
@@ -27,5 +27,5 @@
27
27
  "postcss-combine-duplicated-selectors": "10.0.3",
28
28
  "postcss-import": "^14.0.2"
29
29
  },
30
- "gitHead": "ff89d6e4e8ccc2c891346de7339f368286e89baf"
30
+ "gitHead": "f47cfdcb9eccd1d9f559fb6c149fe9f535e4a3a9"
31
31
  }