@navikt/ds-tokens 0.8.0 → 0.8.3
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/dist/tokens-cjs.js +15 -5
- package/dist/tokens.css +13 -3
- package/dist/tokens.js +15 -5
- package/dist/tokens.less +15 -5
- package/dist/tokens.scss +15 -5
- package/package.json +4 -3
- package/src/border.json +13 -0
- package/src/index.js +0 -13
- package/src/shadow.json +33 -0
package/dist/tokens-cjs.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly
|
|
3
|
-
* Generated on
|
|
3
|
+
* Generated on Wed, 23 Feb 2022 13:31:56 GMT
|
|
4
4
|
*/
|
|
5
5
|
|
|
6
6
|
module.exports = {
|
|
@@ -26,13 +26,14 @@ module.exports = {
|
|
|
26
26
|
"NavdsFontSizeSmall": "0.875rem",
|
|
27
27
|
"NavdsFontWeightBold": "600",
|
|
28
28
|
"NavdsFontWeightRegular": "400",
|
|
29
|
-
"NavdsShadowFocus": "0 0 0 3px rgba(0, 52, 125, 1)",
|
|
30
|
-
"NavdsShadowFocusInverted": "0 0 0 3px rgba(153, 195, 255, 1)",
|
|
31
|
-
"NavdsShadowPopover": "0 2px 4px 0 rgba(229, 229, 229, 1)",
|
|
32
|
-
"NavdsShadowCard": "0 1px 3px 0 rgba(38,38,38,0.2),0 2px 1px 0 rgba(38,38,38,0.12),0 1px 1px 0 rgba(38,38,38,0.14)",
|
|
33
29
|
"NavdsZIndexModal": 2000,
|
|
34
30
|
"NavdsZIndexPopover": 1000,
|
|
35
31
|
"NavdsZIndexFocus": 10,
|
|
32
|
+
"NavdsBorderRadiusSmall": "2px",
|
|
33
|
+
"NavdsBorderRadiusMedium": "4px",
|
|
34
|
+
"NavdsBorderRadiusLarge": "8px",
|
|
35
|
+
"NavdsBorderRadiusXlarge": "12px",
|
|
36
|
+
"NavdsBorderRadiusFull": "9999px",
|
|
36
37
|
"NavdsGlobalColorBlue50": "rgba(230, 240, 255, 1)",
|
|
37
38
|
"NavdsGlobalColorBlue100": "rgba(204, 225, 255, 1)",
|
|
38
39
|
"NavdsGlobalColorBlue200": "rgba(153, 195, 255, 1)",
|
|
@@ -163,6 +164,15 @@ module.exports = {
|
|
|
163
164
|
"NavdsSemanticColorTextInverted": "rgba(255, 255, 255, 1)",
|
|
164
165
|
"NavdsSemanticColorTextMuted": "rgba(112, 112, 112, 1)",
|
|
165
166
|
"NavdsSemanticColorText": "rgba(38, 38, 38, 1)",
|
|
167
|
+
"NavdsShadowXsmall": "0px 2px 1px -1px rgba(0, 0, 0, 0.1), 0px 1px 3px 0px rgba(0, 0, 0, 0.1)",
|
|
168
|
+
"NavdsShadowSmall": "0px 2px 4px -2px rgba(0, 0, 0, 0.1), 0px 4px 6px -1px rgba(0, 0, 0, 0.1)",
|
|
169
|
+
"NavdsShadowMedium": "0px 4px 6px -4px rgba(0, 0, 0, 0.1) ,0px 10px 15px -3px rgba(0, 0, 0, 0.1)",
|
|
170
|
+
"NavdsShadowLarge": "0px 8px 10px -6px rgba(0, 0, 0, 0.1), 0px 20px 25px -5px rgba(0, 0, 0, 0.1)",
|
|
171
|
+
"NavdsShadowXlarge": "0px 8px 10px -6px rgba(0, 0, 0, 0.1), 0px 25px 50px -12px rgba(0, 0, 0, 0.25)",
|
|
172
|
+
"NavdsShadowFocus": "0 0 0 3px rgba(0, 52, 125, 1)",
|
|
173
|
+
"NavdsShadowFocusInverted": "0 0 0 3px rgba(153, 195, 255, 1)",
|
|
174
|
+
"NavdsShadowPopover": "0 2px 4px 0 rgba(229, 229, 229, 1)",
|
|
175
|
+
"NavdsShadowCard": "0 1px 3px 0 rgba(38,38,38,0.2),0 2px 1px 0 rgba(38,38,38,0.12),0 1px 1px 0 rgba(38,38,38,0.14)",
|
|
166
176
|
"NavdsSpacing1": "0.25rem",
|
|
167
177
|
"NavdsSpacing2": "0.5rem",
|
|
168
178
|
"NavdsSpacing3": "0.75rem",
|
package/dist/tokens.css
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly
|
|
3
|
-
* Generated on
|
|
3
|
+
* Generated on Wed, 23 Feb 2022 13:31:56 GMT
|
|
4
4
|
*/
|
|
5
5
|
|
|
6
6
|
:root {
|
|
@@ -22,6 +22,12 @@
|
|
|
22
22
|
--navds-spacing-3: 0.75rem;
|
|
23
23
|
--navds-spacing-2: 0.5rem;
|
|
24
24
|
--navds-spacing-1: 0.25rem;
|
|
25
|
+
--navds-shadow-card: 0 1px 3px 0 rgba(38,38,38,0.2),0 2px 1px 0 rgba(38,38,38,0.12),0 1px 1px 0 rgba(38,38,38,0.14);
|
|
26
|
+
--navds-shadow-xlarge: 0px 8px 10px -6px rgba(0, 0, 0, 0.1), 0px 25px 50px -12px rgba(0, 0, 0, 0.25);
|
|
27
|
+
--navds-shadow-large: 0px 8px 10px -6px rgba(0, 0, 0, 0.1), 0px 20px 25px -5px rgba(0, 0, 0, 0.1);
|
|
28
|
+
--navds-shadow-medium: 0px 4px 6px -4px rgba(0, 0, 0, 0.1) ,0px 10px 15px -3px rgba(0, 0, 0, 0.1);
|
|
29
|
+
--navds-shadow-small: 0px 2px 4px -2px rgba(0, 0, 0, 0.1), 0px 4px 6px -1px rgba(0, 0, 0, 0.1);
|
|
30
|
+
--navds-shadow-xsmall: 0px 2px 1px -1px rgba(0, 0, 0, 0.1), 0px 1px 3px 0px rgba(0, 0, 0, 0.1);
|
|
25
31
|
--navds-global-color-white: rgba(255, 255, 255, 1);
|
|
26
32
|
--navds-global-color-transparent: rgba(255, 255, 255, 0);
|
|
27
33
|
--navds-global-color-red-900: rgba(72, 9, 0, 1);
|
|
@@ -115,10 +121,14 @@
|
|
|
115
121
|
--navds-global-color-blue-200: rgba(153, 195, 255, 1);
|
|
116
122
|
--navds-global-color-blue-100: rgba(204, 225, 255, 1);
|
|
117
123
|
--navds-global-color-blue-50: rgba(230, 240, 255, 1);
|
|
124
|
+
--navds-border-radius-full: 9999px;
|
|
125
|
+
--navds-border-radius-xlarge: 12px;
|
|
126
|
+
--navds-border-radius-large: 8px;
|
|
127
|
+
--navds-border-radius-medium: 4px;
|
|
128
|
+
--navds-border-radius-small: 2px;
|
|
118
129
|
--navds-z-index-focus: 10;
|
|
119
130
|
--navds-z-index-popover: 1000;
|
|
120
131
|
--navds-z-index-modal: 2000;
|
|
121
|
-
--navds-shadow-card: 0 1px 3px 0 rgba(38,38,38,0.2),0 2px 1px 0 rgba(38,38,38,0.12),0 1px 1px 0 rgba(38,38,38,0.14);
|
|
122
132
|
--navds-font-weight-regular: 400;
|
|
123
133
|
--navds-font-weight-bold: 600;
|
|
124
134
|
--navds-font-size-small: 0.875rem;
|
|
@@ -141,6 +151,7 @@
|
|
|
141
151
|
--navds-font-line-height-heading-xlarge: 2.5rem;
|
|
142
152
|
--navds-font-line-height-heading-2xlarge: 3.25rem;
|
|
143
153
|
--navds-font-family: "Source Sans Pro", Arial, sans-serif;
|
|
154
|
+
--navds-shadow-popover: 0 2px 4px 0 var(--navds-global-color-gray-200);
|
|
144
155
|
--navds-semantic-color-text: var(--navds-global-color-gray-900);
|
|
145
156
|
--navds-semantic-color-text-muted: var(--navds-global-color-gray-600);
|
|
146
157
|
--navds-semantic-color-text-inverted: var(--navds-global-color-white);
|
|
@@ -178,7 +189,6 @@
|
|
|
178
189
|
--navds-semantic-color-border: var(--navds-global-color-gray-600);
|
|
179
190
|
--navds-semantic-color-border-muted: var(--navds-global-color-gray-400);
|
|
180
191
|
--navds-semantic-color-border-inverted: var(--navds-global-color-gray-200);
|
|
181
|
-
--navds-shadow-popover: 0 2px 4px 0 var(--navds-global-color-gray-200);
|
|
182
192
|
--navds-shadow-focus-inverted: 0 0 0 3px var(--navds-semantic-color-focus-inverted);
|
|
183
193
|
--navds-shadow-focus: 0 0 0 3px var(--navds-semantic-color-focus);
|
|
184
194
|
}
|
package/dist/tokens.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly
|
|
3
|
-
* Generated on
|
|
3
|
+
* Generated on Wed, 23 Feb 2022 13:31:56 GMT
|
|
4
4
|
*/
|
|
5
5
|
|
|
6
6
|
export const NavdsFontFamily = "\"Source Sans Pro\", Arial, sans-serif";
|
|
@@ -25,13 +25,14 @@ export const NavdsFontSizeMedium = "1rem";
|
|
|
25
25
|
export const NavdsFontSizeSmall = "0.875rem";
|
|
26
26
|
export const NavdsFontWeightBold = "600";
|
|
27
27
|
export const NavdsFontWeightRegular = "400";
|
|
28
|
-
export const NavdsShadowFocus = "0 0 0 3px rgba(0, 52, 125, 1)";
|
|
29
|
-
export const NavdsShadowFocusInverted = "0 0 0 3px rgba(153, 195, 255, 1)";
|
|
30
|
-
export const NavdsShadowPopover = "0 2px 4px 0 rgba(229, 229, 229, 1)";
|
|
31
|
-
export const NavdsShadowCard = "0 1px 3px 0 rgba(38,38,38,0.2),0 2px 1px 0 rgba(38,38,38,0.12),0 1px 1px 0 rgba(38,38,38,0.14)";
|
|
32
28
|
export const NavdsZIndexModal = 2000;
|
|
33
29
|
export const NavdsZIndexPopover = 1000;
|
|
34
30
|
export const NavdsZIndexFocus = 10;
|
|
31
|
+
export const NavdsBorderRadiusSmall = "2px";
|
|
32
|
+
export const NavdsBorderRadiusMedium = "4px";
|
|
33
|
+
export const NavdsBorderRadiusLarge = "8px";
|
|
34
|
+
export const NavdsBorderRadiusXlarge = "12px";
|
|
35
|
+
export const NavdsBorderRadiusFull = "9999px";
|
|
35
36
|
export const NavdsGlobalColorBlue50 = "rgba(230, 240, 255, 1)";
|
|
36
37
|
export const NavdsGlobalColorBlue100 = "rgba(204, 225, 255, 1)";
|
|
37
38
|
export const NavdsGlobalColorBlue200 = "rgba(153, 195, 255, 1)";
|
|
@@ -162,6 +163,15 @@ export const NavdsSemanticColorLink = "rgba(0, 103, 197, 1)";
|
|
|
162
163
|
export const NavdsSemanticColorTextInverted = "rgba(255, 255, 255, 1)";
|
|
163
164
|
export const NavdsSemanticColorTextMuted = "rgba(112, 112, 112, 1)";
|
|
164
165
|
export const NavdsSemanticColorText = "rgba(38, 38, 38, 1)";
|
|
166
|
+
export const NavdsShadowXsmall = "0px 2px 1px -1px rgba(0, 0, 0, 0.1), 0px 1px 3px 0px rgba(0, 0, 0, 0.1)";
|
|
167
|
+
export const NavdsShadowSmall = "0px 2px 4px -2px rgba(0, 0, 0, 0.1), 0px 4px 6px -1px rgba(0, 0, 0, 0.1)";
|
|
168
|
+
export const NavdsShadowMedium = "0px 4px 6px -4px rgba(0, 0, 0, 0.1) ,0px 10px 15px -3px rgba(0, 0, 0, 0.1)";
|
|
169
|
+
export const NavdsShadowLarge = "0px 8px 10px -6px rgba(0, 0, 0, 0.1), 0px 20px 25px -5px rgba(0, 0, 0, 0.1)";
|
|
170
|
+
export const NavdsShadowXlarge = "0px 8px 10px -6px rgba(0, 0, 0, 0.1), 0px 25px 50px -12px rgba(0, 0, 0, 0.25)";
|
|
171
|
+
export const NavdsShadowFocus = "0 0 0 3px rgba(0, 52, 125, 1)";
|
|
172
|
+
export const NavdsShadowFocusInverted = "0 0 0 3px rgba(153, 195, 255, 1)";
|
|
173
|
+
export const NavdsShadowPopover = "0 2px 4px 0 rgba(229, 229, 229, 1)";
|
|
174
|
+
export const NavdsShadowCard = "0 1px 3px 0 rgba(38,38,38,0.2),0 2px 1px 0 rgba(38,38,38,0.12),0 1px 1px 0 rgba(38,38,38,0.14)";
|
|
165
175
|
export const NavdsSpacing1 = "0.25rem";
|
|
166
176
|
export const NavdsSpacing2 = "0.5rem";
|
|
167
177
|
export const NavdsSpacing3 = "0.75rem";
|
package/dist/tokens.less
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
|
|
2
2
|
// Do not edit directly
|
|
3
|
-
// Generated on
|
|
3
|
+
// Generated on Wed, 23 Feb 2022 13:31:56 GMT
|
|
4
4
|
|
|
5
5
|
@navds-font-family: "Source Sans Pro", Arial, sans-serif;
|
|
6
6
|
@navds-font-line-height-heading-2xlarge: 3.25rem;
|
|
@@ -24,13 +24,14 @@
|
|
|
24
24
|
@navds-font-size-small: 0.875rem;
|
|
25
25
|
@navds-font-weight-bold: 600;
|
|
26
26
|
@navds-font-weight-regular: 400;
|
|
27
|
-
@navds-shadow-focus: 0 0 0 3px rgba(0, 52, 125, 1);
|
|
28
|
-
@navds-shadow-focus-inverted: 0 0 0 3px rgba(153, 195, 255, 1);
|
|
29
|
-
@navds-shadow-popover: 0 2px 4px 0 rgba(229, 229, 229, 1);
|
|
30
|
-
@navds-shadow-card: 0 1px 3px 0 rgba(38,38,38,0.2),0 2px 1px 0 rgba(38,38,38,0.12),0 1px 1px 0 rgba(38,38,38,0.14);
|
|
31
27
|
@navds-z-index-modal: 2000;
|
|
32
28
|
@navds-z-index-popover: 1000;
|
|
33
29
|
@navds-z-index-focus: 10;
|
|
30
|
+
@navds-border-radius-small: 2px;
|
|
31
|
+
@navds-border-radius-medium: 4px;
|
|
32
|
+
@navds-border-radius-large: 8px;
|
|
33
|
+
@navds-border-radius-xlarge: 12px;
|
|
34
|
+
@navds-border-radius-full: 9999px;
|
|
34
35
|
@navds-global-color-blue-50: rgba(230, 240, 255, 1);
|
|
35
36
|
@navds-global-color-blue-100: rgba(204, 225, 255, 1);
|
|
36
37
|
@navds-global-color-blue-200: rgba(153, 195, 255, 1);
|
|
@@ -161,6 +162,15 @@
|
|
|
161
162
|
@navds-semantic-color-text-inverted: rgba(255, 255, 255, 1);
|
|
162
163
|
@navds-semantic-color-text-muted: rgba(112, 112, 112, 1);
|
|
163
164
|
@navds-semantic-color-text: rgba(38, 38, 38, 1);
|
|
165
|
+
@navds-shadow-xsmall: 0px 2px 1px -1px rgba(0, 0, 0, 0.1), 0px 1px 3px 0px rgba(0, 0, 0, 0.1);
|
|
166
|
+
@navds-shadow-small: 0px 2px 4px -2px rgba(0, 0, 0, 0.1), 0px 4px 6px -1px rgba(0, 0, 0, 0.1);
|
|
167
|
+
@navds-shadow-medium: 0px 4px 6px -4px rgba(0, 0, 0, 0.1) ,0px 10px 15px -3px rgba(0, 0, 0, 0.1);
|
|
168
|
+
@navds-shadow-large: 0px 8px 10px -6px rgba(0, 0, 0, 0.1), 0px 20px 25px -5px rgba(0, 0, 0, 0.1);
|
|
169
|
+
@navds-shadow-xlarge: 0px 8px 10px -6px rgba(0, 0, 0, 0.1), 0px 25px 50px -12px rgba(0, 0, 0, 0.25);
|
|
170
|
+
@navds-shadow-focus: 0 0 0 3px rgba(0, 52, 125, 1);
|
|
171
|
+
@navds-shadow-focus-inverted: 0 0 0 3px rgba(153, 195, 255, 1);
|
|
172
|
+
@navds-shadow-popover: 0 2px 4px 0 rgba(229, 229, 229, 1);
|
|
173
|
+
@navds-shadow-card: 0 1px 3px 0 rgba(38,38,38,0.2),0 2px 1px 0 rgba(38,38,38,0.12),0 1px 1px 0 rgba(38,38,38,0.14);
|
|
164
174
|
@navds-spacing-1: 0.25rem;
|
|
165
175
|
@navds-spacing-2: 0.5rem;
|
|
166
176
|
@navds-spacing-3: 0.75rem;
|
package/dist/tokens.scss
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
|
|
2
2
|
// Do not edit directly
|
|
3
|
-
// Generated on
|
|
3
|
+
// Generated on Wed, 23 Feb 2022 13:31:56 GMT
|
|
4
4
|
|
|
5
5
|
$navds-font-family: "Source Sans Pro", Arial, sans-serif;
|
|
6
6
|
$navds-font-line-height-heading-2xlarge: 3.25rem;
|
|
@@ -24,13 +24,14 @@ $navds-font-size-medium: 1rem;
|
|
|
24
24
|
$navds-font-size-small: 0.875rem;
|
|
25
25
|
$navds-font-weight-bold: 600;
|
|
26
26
|
$navds-font-weight-regular: 400;
|
|
27
|
-
$navds-shadow-focus: 0 0 0 3px rgba(0, 52, 125, 1);
|
|
28
|
-
$navds-shadow-focus-inverted: 0 0 0 3px rgba(153, 195, 255, 1);
|
|
29
|
-
$navds-shadow-popover: 0 2px 4px 0 rgba(229, 229, 229, 1);
|
|
30
|
-
$navds-shadow-card: 0 1px 3px 0 rgba(38,38,38,0.2),0 2px 1px 0 rgba(38,38,38,0.12),0 1px 1px 0 rgba(38,38,38,0.14);
|
|
31
27
|
$navds-z-index-modal: 2000;
|
|
32
28
|
$navds-z-index-popover: 1000;
|
|
33
29
|
$navds-z-index-focus: 10;
|
|
30
|
+
$navds-border-radius-small: 2px;
|
|
31
|
+
$navds-border-radius-medium: 4px;
|
|
32
|
+
$navds-border-radius-large: 8px;
|
|
33
|
+
$navds-border-radius-xlarge: 12px;
|
|
34
|
+
$navds-border-radius-full: 9999px;
|
|
34
35
|
$navds-global-color-blue-50: rgba(230, 240, 255, 1);
|
|
35
36
|
$navds-global-color-blue-100: rgba(204, 225, 255, 1);
|
|
36
37
|
$navds-global-color-blue-200: rgba(153, 195, 255, 1);
|
|
@@ -161,6 +162,15 @@ $navds-semantic-color-link: rgba(0, 103, 197, 1);
|
|
|
161
162
|
$navds-semantic-color-text-inverted: rgba(255, 255, 255, 1);
|
|
162
163
|
$navds-semantic-color-text-muted: rgba(112, 112, 112, 1);
|
|
163
164
|
$navds-semantic-color-text: rgba(38, 38, 38, 1);
|
|
165
|
+
$navds-shadow-xsmall: 0px 2px 1px -1px rgba(0, 0, 0, 0.1), 0px 1px 3px 0px rgba(0, 0, 0, 0.1);
|
|
166
|
+
$navds-shadow-small: 0px 2px 4px -2px rgba(0, 0, 0, 0.1), 0px 4px 6px -1px rgba(0, 0, 0, 0.1);
|
|
167
|
+
$navds-shadow-medium: 0px 4px 6px -4px rgba(0, 0, 0, 0.1) ,0px 10px 15px -3px rgba(0, 0, 0, 0.1);
|
|
168
|
+
$navds-shadow-large: 0px 8px 10px -6px rgba(0, 0, 0, 0.1), 0px 20px 25px -5px rgba(0, 0, 0, 0.1);
|
|
169
|
+
$navds-shadow-xlarge: 0px 8px 10px -6px rgba(0, 0, 0, 0.1), 0px 25px 50px -12px rgba(0, 0, 0, 0.25);
|
|
170
|
+
$navds-shadow-focus: 0 0 0 3px rgba(0, 52, 125, 1);
|
|
171
|
+
$navds-shadow-focus-inverted: 0 0 0 3px rgba(153, 195, 255, 1);
|
|
172
|
+
$navds-shadow-popover: 0 2px 4px 0 rgba(229, 229, 229, 1);
|
|
173
|
+
$navds-shadow-card: 0 1px 3px 0 rgba(38,38,38,0.2),0 2px 1px 0 rgba(38,38,38,0.12),0 1px 1px 0 rgba(38,38,38,0.14);
|
|
164
174
|
$navds-spacing-1: 0.25rem;
|
|
165
175
|
$navds-spacing-2: 0.5rem;
|
|
166
176
|
$navds-spacing-3: 0.75rem;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@navikt/ds-tokens",
|
|
3
|
-
"version": "0.8.
|
|
3
|
+
"version": "0.8.3",
|
|
4
4
|
"private": false,
|
|
5
5
|
"description": "Auto-generated design-tokens for NAV design-systems framework",
|
|
6
6
|
"author": "NAV Designsystem team",
|
|
@@ -14,7 +14,8 @@
|
|
|
14
14
|
"license": "MIT",
|
|
15
15
|
"files": [
|
|
16
16
|
"/dist",
|
|
17
|
-
"/src"
|
|
17
|
+
"/src",
|
|
18
|
+
"/tailwind"
|
|
18
19
|
],
|
|
19
20
|
"scripts": {
|
|
20
21
|
"build": "node ./build.js",
|
|
@@ -40,5 +41,5 @@
|
|
|
40
41
|
"ts-jest": "^27.0.5",
|
|
41
42
|
"ts-node": "^10.3.0"
|
|
42
43
|
},
|
|
43
|
-
"gitHead": "
|
|
44
|
+
"gitHead": "b4377a228a64c1924ec765bd2e83b739ffbd3fc4"
|
|
44
45
|
}
|
package/src/border.json
ADDED
package/src/index.js
CHANGED
|
@@ -39,19 +39,6 @@ module.exports = {
|
|
|
39
39
|
regular: { value: "400" },
|
|
40
40
|
},
|
|
41
41
|
},
|
|
42
|
-
shadow: {
|
|
43
|
-
focus: { value: "0 0 0 3px {navds.semantic.color.focus.@.value}" },
|
|
44
|
-
"focus-inverted": {
|
|
45
|
-
value: "0 0 0 3px {navds.semantic.color.focus.inverted.value}",
|
|
46
|
-
},
|
|
47
|
-
popover: {
|
|
48
|
-
value: "0 2px 4px 0 {navds.global.color.gray.200.value}",
|
|
49
|
-
},
|
|
50
|
-
card: {
|
|
51
|
-
value:
|
|
52
|
-
"0 1px 3px 0 rgba(38,38,38,0.2),0 2px 1px 0 rgba(38,38,38,0.12),0 1px 1px 0 rgba(38,38,38,0.14)",
|
|
53
|
-
},
|
|
54
|
-
},
|
|
55
42
|
"z-index": {
|
|
56
43
|
modal: { value: 2000 },
|
|
57
44
|
popover: { value: 1000 },
|
package/src/shadow.json
ADDED
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
{
|
|
2
|
+
"navds": {
|
|
3
|
+
"shadow": {
|
|
4
|
+
"xsmall": {
|
|
5
|
+
"value": "0px 2px 1px -1px rgba(0, 0, 0, 0.1), 0px 1px 3px 0px rgba(0, 0, 0, 0.1)"
|
|
6
|
+
},
|
|
7
|
+
"small": {
|
|
8
|
+
"value": "0px 2px 4px -2px rgba(0, 0, 0, 0.1), 0px 4px 6px -1px rgba(0, 0, 0, 0.1)"
|
|
9
|
+
},
|
|
10
|
+
"medium": {
|
|
11
|
+
"value": "0px 4px 6px -4px rgba(0, 0, 0, 0.1) ,0px 10px 15px -3px rgba(0, 0, 0, 0.1)"
|
|
12
|
+
},
|
|
13
|
+
"large": {
|
|
14
|
+
"value": "0px 8px 10px -6px rgba(0, 0, 0, 0.1), 0px 20px 25px -5px rgba(0, 0, 0, 0.1)"
|
|
15
|
+
},
|
|
16
|
+
"xlarge": {
|
|
17
|
+
"value": "0px 8px 10px -6px rgba(0, 0, 0, 0.1), 0px 25px 50px -12px rgba(0, 0, 0, 0.25)"
|
|
18
|
+
},
|
|
19
|
+
"focus": {
|
|
20
|
+
"value": "0 0 0 3px {navds.semantic.color.focus.@.value}"
|
|
21
|
+
},
|
|
22
|
+
"focus-inverted": {
|
|
23
|
+
"value": "0 0 0 3px {navds.semantic.color.focus.inverted.value}"
|
|
24
|
+
},
|
|
25
|
+
"popover": {
|
|
26
|
+
"value": "0 2px 4px 0 {navds.global.color.gray.200.value}"
|
|
27
|
+
},
|
|
28
|
+
"card": {
|
|
29
|
+
"value": "0 1px 3px 0 rgba(38,38,38,0.2),0 2px 1px 0 rgba(38,38,38,0.12),0 1px 1px 0 rgba(38,38,38,0.14)"
|
|
30
|
+
}
|
|
31
|
+
}
|
|
32
|
+
}
|
|
33
|
+
}
|