@navikt/ds-css 6.10.1 → 6.12.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.
@@ -1,29 +1,23 @@
1
- .navds-box {
2
- --__ac-box-padding-xs: initial;
3
- --__ac-box-padding-sm: var(--__ac-box-padding-xs);
4
- --__ac-box-padding-md: var(--__ac-box-padding-sm);
5
- --__ac-box-padding-lg: var(--__ac-box-padding-md);
6
- --__ac-box-padding-xl: var(--__ac-box-padding-lg);
7
- --__ac-box-padding-2xl: var(--__ac-box-padding-xl);
8
- --__ac-box-padding-inline-xs: initial;
9
- --__ac-box-padding-inline-sm: var(--__ac-box-padding-inline-xs);
10
- --__ac-box-padding-inline-md: var(--__ac-box-padding-inline-sm);
11
- --__ac-box-padding-inline-lg: var(--__ac-box-padding-inline-md);
12
- --__ac-box-padding-inline-xl: var(--__ac-box-padding-inline-lg);
13
- --__ac-box-padding-inline-2xl: var(--__ac-box-padding-inline-xl);
14
- --__ac-box-padding-block-xs: initial;
15
- --__ac-box-padding-block-sm: var(--__ac-box-padding-block-xs);
16
- --__ac-box-padding-block-md: var(--__ac-box-padding-block-sm);
17
- --__ac-box-padding-block-lg: var(--__ac-box-padding-block-md);
18
- --__ac-box-padding-block-xl: var(--__ac-box-padding-block-lg);
19
- --__ac-box-padding-block-2xl: var(--__ac-box-padding-block-xl);
20
- --__ac-box-padding: var(--__ac-box-padding-xs);
21
- --__ac-box-padding-inline: var(--__ac-box-padding-inline-xs);
22
- --__ac-box-padding-block: var(--__ac-box-padding-block-xs);
1
+ .navds-box-bg {
23
2
  --__ac-box-background: initial;
3
+
4
+ background-color: var(--__ac-box-background);
5
+ }
6
+
7
+ .navds-box-border-color {
24
8
  --__ac-box-border-color: initial;
25
- --__ac-box-shadow: initial;
9
+
10
+ border-color: var(--__ac-box-border-color);
11
+ }
12
+
13
+ .navds-box-border-width {
26
14
  --__ac-box-border-width: initial;
15
+
16
+ border-style: solid;
17
+ border-width: var(--__ac-box-border-width, 0);
18
+ }
19
+
20
+ .navds-box-border-radius {
27
21
  --__ac-box-border-radius-xs: initial;
28
22
  --__ac-box-border-radius-sm: var(--__ac-box-border-radius-xs);
29
23
  --__ac-box-border-radius-md: var(--__ac-box-border-radius-sm);
@@ -32,57 +26,41 @@
32
26
  --__ac-box-border-radius-2xl: var(--__ac-box-border-radius-xl);
33
27
  --__ac-box-border-radius: var(--__ac-box-border-radius-xs);
34
28
 
35
- padding-inline: var(--__ac-box-padding-inline, var(--__ac-box-padding));
36
- padding-block: var(--__ac-box-padding-block, var(--__ac-box-padding));
37
- background-color: var(--__ac-box-background);
38
- border-style: solid;
39
- border-color: var(--__ac-box-border-color);
40
29
  border-radius: var(--__ac-box-border-radius);
30
+ }
31
+
32
+ .navds-box-shadow {
33
+ --__ac-box-shadow: initial;
34
+
41
35
  box-shadow: var(--__ac-box-shadow);
42
- border-width: var(--__ac-box-border-width, 0);
43
36
  }
44
37
 
45
38
  @media (min-width: 480px) {
46
- .navds-box {
47
- --__ac-box-padding: var(--__ac-box-padding-sm);
48
- --__ac-box-padding-inline: var(--__ac-box-padding-inline-sm);
49
- --__ac-box-padding-block: var(--__ac-box-padding-block-sm);
39
+ .navds-box-border-radius {
50
40
  --__ac-box-border-radius: var(--__ac-box-border-radius-sm);
51
41
  }
52
42
  }
53
43
 
54
44
  @media (min-width: 768px) {
55
- .navds-box {
56
- --__ac-box-padding: var(--__ac-box-padding-md);
57
- --__ac-box-padding-inline: var(--__ac-box-padding-inline-md);
58
- --__ac-box-padding-block: var(--__ac-box-padding-block-md);
45
+ .navds-box-border-radius {
59
46
  --__ac-box-border-radius: var(--__ac-box-border-radius-md);
60
47
  }
61
48
  }
62
49
 
63
50
  @media (min-width: 1024px) {
64
- .navds-box {
65
- --__ac-box-padding: var(--__ac-box-padding-lg);
66
- --__ac-box-padding-inline: var(--__ac-box-padding-inline-lg);
67
- --__ac-box-padding-block: var(--__ac-box-padding-block-lg);
51
+ .navds-box-border-radius {
68
52
  --__ac-box-border-radius: var(--__ac-box-border-radius-lg);
69
53
  }
70
54
  }
71
55
 
72
56
  @media (min-width: 1280px) {
73
- .navds-box {
74
- --__ac-box-padding: var(--__ac-box-padding-xl);
75
- --__ac-box-padding-inline: var(--__ac-box-padding-inline-xl);
76
- --__ac-box-padding-block: var(--__ac-box-padding-block-xl);
57
+ .navds-box-border-radius {
77
58
  --__ac-box-border-radius: var(--__ac-box-border-radius-xl);
78
59
  }
79
60
  }
80
61
 
81
62
  @media (min-width: 1440px) {
82
- .navds-box {
83
- --__ac-box-padding: var(--__ac-box-padding-2xl);
84
- --__ac-box-padding-inline: var(--__ac-box-padding-inline-2xl);
85
- --__ac-box-padding-block: var(--__ac-box-padding-block-2xl);
63
+ .navds-box-border-radius {
86
64
  --__ac-box-border-radius: var(--__ac-box-border-radius-2xl);
87
65
  }
88
66
  }
@@ -4,3 +4,4 @@
4
4
  @import "hgrid.css";
5
5
  @import "stack.css";
6
6
  @import "responsive.css";
7
+ @import "base.css";