@navikt/ds-react 1.5.9 → 2.0.0-next.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.
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@navikt/ds-react",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "2.0.0-next.0",
|
|
4
4
|
"description": "NAV designsystem react components",
|
|
5
5
|
"author": "NAV Designsystem team",
|
|
6
6
|
"license": "MIT",
|
|
@@ -37,7 +37,7 @@
|
|
|
37
37
|
},
|
|
38
38
|
"dependencies": {
|
|
39
39
|
"@floating-ui/react-dom-interactions": "0.9.2",
|
|
40
|
-
"@navikt/ds-icons": "^
|
|
40
|
+
"@navikt/ds-icons": "^2.0.0-next.0",
|
|
41
41
|
"@radix-ui/react-tabs": "1.0.0",
|
|
42
42
|
"@radix-ui/react-toggle-group": "1.0.0",
|
|
43
43
|
"clsx": "^1.2.1",
|
|
@@ -52,8 +52,8 @@ export const Farger = () => {
|
|
|
52
52
|
avatar="ON"
|
|
53
53
|
name="Ola Normann"
|
|
54
54
|
timestamp="01.01.21 14:00"
|
|
55
|
-
avatarBgColor="var(--
|
|
56
|
-
backgroundColor="var(--
|
|
55
|
+
avatarBgColor="var(--a-lightblue-200)"
|
|
56
|
+
backgroundColor="var(--a-lightblue-100)"
|
|
57
57
|
>
|
|
58
58
|
<Chat.Bubble>
|
|
59
59
|
Aute minim nisi sunt mollit duis sunt nulla minim non proident.
|
|
@@ -49,7 +49,7 @@ export const Contentcontainer = () => {
|
|
|
49
49
|
</ContentContainer>
|
|
50
50
|
<style>{`.container {
|
|
51
51
|
display: flex;
|
|
52
|
-
border-radius: var(--
|
|
52
|
+
border-radius: var(--a-border-radius-medium);
|
|
53
53
|
justify-content: center;
|
|
54
54
|
align-items: center;
|
|
55
55
|
margin-bottom: 1.5rem;
|
|
@@ -15,10 +15,8 @@ export const Default = (props) => {
|
|
|
15
15
|
const newProps = props?.colorOverride
|
|
16
16
|
? {
|
|
17
17
|
style: {
|
|
18
|
-
["--
|
|
19
|
-
|
|
20
|
-
["--navds-guide-panel-color-border" as any]:
|
|
21
|
-
"var(--navds-global-color-purple-400)",
|
|
18
|
+
["--ac-guide-panel-illustration-bg" as any]: "var(--a-purple-200)",
|
|
19
|
+
["--ac-guide-panel-border" as any]: "var(--a-purple-400)",
|
|
22
20
|
},
|
|
23
21
|
}
|
|
24
22
|
: {};
|
|
@@ -40,10 +38,8 @@ export const Poster = () => <GuidePanel poster>{panelText}</GuidePanel>;
|
|
|
40
38
|
export const ColorOverride = () => (
|
|
41
39
|
<GuidePanel
|
|
42
40
|
style={{
|
|
43
|
-
["--
|
|
44
|
-
|
|
45
|
-
["--navds-guide-panel-color-border" as any]:
|
|
46
|
-
"var(--navds-global-color-purple-400)",
|
|
41
|
+
["--ac-guide-panel-illustration-bg" as any]: "var(--a-purple-200)",
|
|
42
|
+
["--ac-guide-panel-border" as any]: "var(--a-purple-400)",
|
|
47
43
|
}}
|
|
48
44
|
>
|
|
49
45
|
{panelText}
|
|
@@ -28,7 +28,7 @@ const Panel = () => {
|
|
|
28
28
|
<Tabs.Panel
|
|
29
29
|
value="test1"
|
|
30
30
|
className="panel"
|
|
31
|
-
style={{ background: "var(--
|
|
31
|
+
style={{ background: "var(--a-gray-50)", height: 100 }}
|
|
32
32
|
>
|
|
33
33
|
Innholdspanel for Skap-tab
|
|
34
34
|
</Tabs.Panel>
|
|
@@ -36,7 +36,7 @@ const Panel = () => {
|
|
|
36
36
|
value="test2"
|
|
37
37
|
className="panel"
|
|
38
38
|
style={{
|
|
39
|
-
background: "var(--
|
|
39
|
+
background: "var(--a-green-50)",
|
|
40
40
|
height: 100,
|
|
41
41
|
}}
|
|
42
42
|
>
|
|
@@ -45,7 +45,7 @@ const Panel = () => {
|
|
|
45
45
|
<Tabs.Panel
|
|
46
46
|
value="test3"
|
|
47
47
|
className="panel"
|
|
48
|
-
style={{ background: "var(--
|
|
48
|
+
style={{ background: "var(--a-red-50)", height: 100 }}
|
|
49
49
|
>
|
|
50
50
|
Innholdspanel for Fryser-tab
|
|
51
51
|
</Tabs.Panel>
|