@navikt/ds-tailwind 0.2.7 → 1.0.0-rc.2
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/README.md +36 -0
- package/package.json +3 -3
- package/tailwind.config.js +7 -7
package/README.md
ADDED
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
# NAV tailwind-preset
|
|
2
|
+
|
|
3
|
+
Custom tailwind-preset based on @navikt/ds-tokens.
|
|
4
|
+
|
|
5
|
+
## Installation
|
|
6
|
+
|
|
7
|
+
Install `@navikt/ds-tailwind` with yarn
|
|
8
|
+
|
|
9
|
+
```bash
|
|
10
|
+
yarn add @navikt/ds-tailwind
|
|
11
|
+
```
|
|
12
|
+
|
|
13
|
+
Install `@navikt/ds-tailwind` with npm
|
|
14
|
+
|
|
15
|
+
```bash
|
|
16
|
+
npm install @navikt/ds-tailwind
|
|
17
|
+
```
|
|
18
|
+
|
|
19
|
+
## Usage
|
|
20
|
+
|
|
21
|
+
```javascript
|
|
22
|
+
// tailwind.config.js
|
|
23
|
+
|
|
24
|
+
module.exports = {
|
|
25
|
+
presets: [require("@navikt/ds-tailwind")],
|
|
26
|
+
};
|
|
27
|
+
```
|
|
28
|
+
|
|
29
|
+
## Learn more
|
|
30
|
+
|
|
31
|
+
- [Designsystem documentation](https://aksel.nav.no/designsystem)
|
|
32
|
+
- [Storybook](https://master--5f801fb2aea7820022de2936.chromatic.com/)
|
|
33
|
+
|
|
34
|
+
## License
|
|
35
|
+
|
|
36
|
+
[MIT](https://github.com/navikt/Designsystemet/blob/master/LICENCE)
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@navikt/ds-tailwind",
|
|
3
|
-
"version": "0.2
|
|
3
|
+
"version": "1.0.0-rc.2",
|
|
4
4
|
"description": "Auto-generated tailwind config based on @navikt/ds-tokens",
|
|
5
5
|
"author": "NAV Designsystem team",
|
|
6
6
|
"keywords": [
|
|
@@ -22,7 +22,7 @@
|
|
|
22
22
|
"directory": "@navikt/core/tailwind"
|
|
23
23
|
},
|
|
24
24
|
"devDependencies": {
|
|
25
|
-
"@navikt/ds-tokens": "^0.
|
|
25
|
+
"@navikt/ds-tokens": "^1.0.0-rc.2",
|
|
26
26
|
"@types/jest": "^27.0.1",
|
|
27
27
|
"@types/node": "^17.0.35",
|
|
28
28
|
"jest": "^27.2.0",
|
|
@@ -31,5 +31,5 @@
|
|
|
31
31
|
"ts-node": "^10.3.0",
|
|
32
32
|
"typescript": "^4.7.2"
|
|
33
33
|
},
|
|
34
|
-
"gitHead": "
|
|
34
|
+
"gitHead": "60f13970436275f5af4a206995c545475c2f09db"
|
|
35
35
|
}
|
package/tailwind.config.js
CHANGED
|
@@ -104,20 +104,20 @@ module.exports = {
|
|
|
104
104
|
"component-background-inverted": "rgba(38, 38, 38, 1)",
|
|
105
105
|
"component-background-light": "rgba(255, 255, 255, 1)",
|
|
106
106
|
"divider": "rgba(207, 207, 207, 1)",
|
|
107
|
-
"feedback-danger-background": "rgba(
|
|
107
|
+
"feedback-danger-background": "rgba(253, 232, 230, 1)",
|
|
108
108
|
"feedback-danger-border": "rgba(186, 58, 38, 1)",
|
|
109
109
|
"feedback-danger-icon": "rgba(186, 58, 38, 1)",
|
|
110
110
|
"feedback-danger-text": "rgba(186, 58, 38, 1)",
|
|
111
|
-
"feedback-info-background": "rgba(
|
|
111
|
+
"feedback-info-background": "rgba(235, 252, 255, 1)",
|
|
112
112
|
"feedback-info-border": "rgba(54, 141, 168, 1)",
|
|
113
113
|
"feedback-info-icon": "rgba(54, 141, 168, 1)",
|
|
114
|
-
"feedback-success-background": "rgba(
|
|
114
|
+
"feedback-success-background": "rgba(243, 252, 245, 1)",
|
|
115
115
|
"feedback-success-border": "rgba(6, 137, 58, 1)",
|
|
116
116
|
"feedback-success-icon": "rgba(0, 124, 46, 1)",
|
|
117
|
-
"feedback-warning-background": "rgba(255,
|
|
117
|
+
"feedback-warning-background": "rgba(255, 249, 240, 1)",
|
|
118
118
|
"feedback-warning-border": "rgba(212, 123, 0, 1)",
|
|
119
119
|
"feedback-warning-icon": "rgba(212, 123, 0, 1)",
|
|
120
|
-
"focus-inverted": "rgba(
|
|
120
|
+
"focus-inverted": "rgba(153, 195, 255, 1)",
|
|
121
121
|
"focus": "rgba(0, 52, 125, 1)",
|
|
122
122
|
"interaction-danger-hover": "rgba(163, 42, 23, 1)",
|
|
123
123
|
"interaction-danger-selected": "rgba(136, 29, 12, 1)",
|
|
@@ -161,12 +161,12 @@ module.exports = {
|
|
|
161
161
|
},
|
|
162
162
|
"boxShadow": {
|
|
163
163
|
"xsmall": "0 1px 2px 0 rgba(0, 0, 0, 0.12)",
|
|
164
|
-
"small": "0 1px 2px -1px rgba(0, 0, 0, 0.1), 0 1px 3px 0 rgba(0, 0, 0, 0.
|
|
164
|
+
"small": "0 1px 2px -1px rgba(0, 0, 0, 0.1), 0 1px 3px 0 rgba(0, 0, 0, 0.1)",
|
|
165
165
|
"medium": "0 2px 4px -2px rgba(0, 0, 0, 0.1), 0 4px 6px -1px rgba(0, 0, 0, 0.1)",
|
|
166
166
|
"large": "0 4px 6px -4px rgba(0, 0, 0, 0.1), 0 10px 15px -3px rgba(0, 0, 0, 0.1)",
|
|
167
167
|
"xlarge": "0 8px 10px -6px rgba(0, 0, 0, 0.1), 0 25px 50px -5px rgba(0, 0, 0, 0.1)",
|
|
168
168
|
"focus": "0 0 0 3px rgba(0, 52, 125, 1)",
|
|
169
|
-
"focus-inverted": "0 0 0 3px rgba(
|
|
169
|
+
"focus-inverted": "0 0 0 3px rgba(153, 195, 255, 1)"
|
|
170
170
|
},
|
|
171
171
|
"fontWeight": {
|
|
172
172
|
"bold": "600",
|