@navikt/ds-css 0.16.5 → 0.16.8

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 (21) hide show
  1. package/alert.css +15 -37
  2. package/button.css +1 -1
  3. package/card.css +1 -1
  4. package/dist/index.css +48 -67
  5. package/form/confirmation-panel.css +1 -1
  6. package/form/radio-checkbox.css +3 -3
  7. package/form/select.css +1 -1
  8. package/form/switch.css +2 -2
  9. package/form/text-field.css +1 -1
  10. package/form/textarea.css +1 -1
  11. package/guide-panel.css +2 -2
  12. package/help-text.css +2 -2
  13. package/modal.css +1 -1
  14. package/package.json +2 -2
  15. package/pagination.css +6 -2
  16. package/panel.css +1 -1
  17. package/popover.css +1 -1
  18. package/speech-bubble.css +3 -3
  19. package/step-indicator.css +2 -2
  20. package/tag.css +1 -1
  21. package/toggle-group.css +2 -2
package/form/confirmation-panel.css CHANGED
@@ -39,7 +39,7 @@
39
39
  flex-direction: column;
40
40
  gap: var(--navds-spacing-4);
41
41
  padding: var(--navds-spacing-4);
42
- border-radius: 4px;
42
+ border-radius: var(--navds-border-radius-medium);
43
43
  border: 1px solid var(--navds-confirmation-panel-color-border);
44
44
  background-color: var(--navds-confirmation-panel-color-background);
45
45
  transition: background-color linear 100ms;
package/form/radio-checkbox.css CHANGED
@@ -57,12 +57,12 @@
57
57
  box-shadow: inset 0 0 0 2px var(--navds-radio-checkbox-color-shadow);
58
58
  width: 1.5rem;
59
59
  height: 1.5rem;
60
- border-radius: 4px;
60
+ border-radius: var(--navds-border-radius-medium);
61
61
  flex-shrink: 0;
62
62
  }
63
63
 
64
64
  .navds-radio__label::before {
65
- border-radius: 50%;
65
+ border-radius: var(--navds-border-radius-full);
66
66
  }
67
67
 
68
68
  .navds-checkbox__content,
@@ -121,7 +121,7 @@
121
121
  background-color: var(--navds-radio-checkbox-color-background);
122
122
  width: 0.75rem;
123
123
  height: 0.25rem;
124
- border-radius: 1px;
124
+ border-radius: 1px; /* Custom value OK */
125
125
  flex-shrink: 0;
126
126
  }
127
127
 
package/form/select.css CHANGED
@@ -22,7 +22,7 @@
22
22
  .navds-select__input {
23
23
  appearance: none;
24
24
  background-color: var(--navds-select-color-background);
25
- border-radius: 4px;
25
+ border-radius: var(--navds-border-radius-medium);
26
26
  border: 1px solid var(--navds-select-color-border);
27
27
  width: 100%;
28
28
  box-sizing: border-box;
package/form/switch.css CHANGED
@@ -112,7 +112,7 @@
112
112
  position: absolute;
113
113
  top: var(--navds-spacing-3);
114
114
  left: 0;
115
- border-radius: 4px;
115
+ border-radius: var(--navds-border-radius-medium);
116
116
  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1);
117
117
  }
118
118
 
@@ -155,7 +155,7 @@
155
155
  .navds-switch__thumb {
156
156
  background-color: var(--navds-switch-color-thumb);
157
157
  color: var(--navds-switch-color-thumb-icon);
158
- border-radius: 2.5px;
158
+ border-radius: var(--navds-border-radius-small);
159
159
  width: 20px;
160
160
  height: 20px;
161
161
  position: absolute;
package/form/text-field.css CHANGED
@@ -24,7 +24,7 @@
24
24
  appearance: none;
25
25
  padding: 0.5rem;
26
26
  background-color: var(--navds-text-field-color-background);
27
- border-radius: 4px;
27
+ border-radius: var(--navds-border-radius-medium);
28
28
  border: 1px solid var(--navds-text-field-color-border);
29
29
  min-height: 48px;
30
30
  width: 100%;
package/form/textarea.css CHANGED
@@ -32,7 +32,7 @@
32
32
  appearance: none;
33
33
  padding: var(--navds-spacing-2);
34
34
  background-color: var(--navds-textarea-color-background);
35
- border-radius: 4px;
35
+ border-radius: var(--navds-border-radius-medium);
36
36
  border: 1px solid var(--navds-textarea-color-border);
37
37
  resize: none;
38
38
  width: 100%;
package/guide-panel.css CHANGED
@@ -18,7 +18,7 @@
18
18
 
19
19
  .navds-guide-panel__content {
20
20
  background-color: var(--navds-guide-panel-color-background);
21
- border-radius: 4px;
21
+ border-radius: var(--navds-border-radius-medium);
22
22
  border: 2px solid var(--navds-guide-panel-color-border);
23
23
  min-height: 7.25rem;
24
24
  padding: 1.5rem;
@@ -58,7 +58,7 @@
58
58
  /* Guide illustration frame */
59
59
  .navds-guide__illustration {
60
60
  background: var(--navds-guide-panel-color-illustration-background);
61
- border-radius: 50%;
61
+ border-radius: var(--navds-border-radius-full);
62
62
  overflow: hidden;
63
63
  }
64
64
 
package/help-text.css CHANGED
@@ -27,7 +27,7 @@
27
27
  border: 0;
28
28
  cursor: pointer;
29
29
  background-color: transparent;
30
- border-radius: 50%;
30
+ border-radius: var(--navds-border-radius-full);
31
31
  display: flex;
32
32
  justify-content: center;
33
33
  align-items: center;
@@ -49,7 +49,7 @@
49
49
  }
50
50
 
51
51
  .navds-help-text__icon {
52
- border-radius: 50%;
52
+ border-radius: var(--navds-border-radius-full);
53
53
  }
54
54
 
55
55
  .navds-help-text__popover > .navds-popover__arrow::before {
package/modal.css CHANGED
@@ -11,7 +11,7 @@
11
11
 
12
12
  .navds-modal {
13
13
  background-color: var(--navds-modal-color-background);
14
- border-radius: 4px;
14
+ border-radius: var(--navds-border-radius-medium);
15
15
  display: block;
16
16
  position: relative;
17
17
  overflow: auto;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@navikt/ds-css",
3
- "version": "0.16.5",
3
+ "version": "0.16.8",
4
4
  "private": false,
5
5
  "description": "Css for NAV Designsystem components",
6
6
  "author": "NAV Designsystem team",
@@ -27,5 +27,5 @@
27
27
  "postcss-cli": "^8.3.1",
28
28
  "postcss-import": "^14.0.2"
29
29
  },
30
- "gitHead": "f6042d01aad8740107376679bdd2917fa56dd3a0"
30
+ "gitHead": "62ba36ae0944d7db43a265b24b24040322f0366f"
31
31
  }
package/pagination.css CHANGED
@@ -47,7 +47,7 @@
47
47
  text-decoration: none;
48
48
  border: none;
49
49
  background: none;
50
- border-radius: 2px;
50
+ border-radius: var(--navds-border-radius-small);
51
51
  padding: var(--navds-spacing-1) var(--navds-spacing-3);
52
52
  }
53
53
 
@@ -87,7 +87,7 @@
87
87
  color: var(--navds-semantic-color-link);
88
88
  align-items: center;
89
89
  gap: var(--navds-spacing-1);
90
- border-radius: 2px;
90
+ border-radius: var(--navds-border-radius-small);
91
91
  }
92
92
 
93
93
  .navds-pagination__prev-next:focus {
@@ -116,3 +116,7 @@
116
116
  .navds-pagination__prev-text {
117
117
  padding-right: 0.75rem;
118
118
  }
119
+
120
+ .navds-pagination--invisible {
121
+ visibility: hidden;
122
+ }
package/panel.css CHANGED
@@ -8,7 +8,7 @@
8
8
  .navds-panel {
9
9
  background-color: var(--navds-panel-color-background);
10
10
  padding: var(--navds-spacing-4);
11
- border-radius: 4px;
11
+ border-radius: var(--navds-border-radius-small);
12
12
  border: 1px solid transparent;
13
13
  }
14
14
 
package/popover.css CHANGED
@@ -11,7 +11,7 @@
11
11
  box-shadow: var(--navds-shadow-popover);
12
12
  border: 1px solid;
13
13
  border-color: var(--navds-popover-color-border);
14
- border-radius: 4px;
14
+ border-radius: var(--navds-border-radius-medium);
15
15
  }
16
16
 
17
17
  .navds-popover__content {
package/speech-bubble.css CHANGED
@@ -38,7 +38,7 @@
38
38
  align-items: center;
39
39
  background: var(--navds-speechbubble-color-illustration-background);
40
40
  color: var(--navds-speechbubble-color-illustration);
41
- border-radius: 50%;
41
+ border-radius: var(--navds-border-radius-full);
42
42
  display: flex;
43
43
  flex-shrink: 0;
44
44
  justify-content: center;
@@ -59,7 +59,7 @@
59
59
  width: fit-content;
60
60
  max-width: 37.5rem;
61
61
  background-color: var(--navds-speechbubble-color-background);
62
- border-radius: 12px;
62
+ border-radius: var(--navds-border-radius-xlarge);
63
63
  border-bottom-left-radius: 2px;
64
64
  display: flex;
65
65
  flex-direction: column;
@@ -72,7 +72,7 @@
72
72
  }
73
73
 
74
74
  .navds-speechbubble--right .navds-speechbubble__bubble {
75
- border-radius: 12px;
75
+ border-radius: var(--navds-border-radius-xlarge);
76
76
  border-bottom-right-radius: 2px;
77
77
  }
78
78
 
package/step-indicator.css CHANGED
@@ -72,7 +72,7 @@
72
72
  width: 2rem;
73
73
  height: 2rem;
74
74
  margin: 0.5rem;
75
- border-radius: 50%;
75
+ border-radius: var(--navds-border-radius-full);
76
76
  align-items: center;
77
77
  justify-content: center;
78
78
  box-shadow: 0 0 0 1px var(--navds-step-indicator-color-step-number-shadow);
@@ -107,7 +107,7 @@
107
107
  left: calc(-50% + 2rem);
108
108
  display: block;
109
109
  border-top: 2px solid var(--navds-step-indicator-color-step-line);
110
- border-radius: 4px;
110
+ border-radius: var(--navds-border-radius-medium);
111
111
  pointer-events: none;
112
112
  }
113
113
 
package/tag.css CHANGED
@@ -32,7 +32,7 @@
32
32
  .navds-tag {
33
33
  border: 1px solid;
34
34
  border-color: var(--navds-tag-color-border);
35
- border-radius: 4px;
35
+ border-radius: var(--navds-border-radius-medium);
36
36
  background-color: var(--navds-tag-color-background);
37
37
  display: inline-flex;
38
38
  align-items: center;
package/toggle-group.css CHANGED
@@ -19,7 +19,7 @@
19
19
  }
20
20
 
21
21
  .navds-toggle-group {
22
- border-radius: 7px;
22
+ border-radius: 7px; /* Custom value OK */
23
23
  background-color: var(--navds-toggle-group-color-background);
24
24
  box-shadow: inset 0 0 0 1px var(--navds-toggle-group-color-border);
25
25
  padding: calc(var(--navds-spacing-1) + 1px);
@@ -39,7 +39,7 @@
39
39
  cursor: pointer;
40
40
  background-color: var(--navds-toggle-group-color-background);
41
41
  color: var(--navds-toggle-group-color-text);
42
- border-radius: 2px;
42
+ border-radius: var(--navds-border-radius-small);
43
43
  min-width: fit-content;
44
44
  }
45
45