@royalnavy/design-tokens 4.14.0 → 4.15.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/dist/variables.css +172 -0
- package/dist/{index.scss → variables.scss} +1 -1
- package/package.json +4 -4
|
@@ -0,0 +1,172 @@
|
|
|
1
|
+
:root {
|
|
2
|
+
--timing-default: 0.2s;
|
|
3
|
+
--breakpoint-root-breakpoint: 0;
|
|
4
|
+
--breakpoint-xs-breakpoint: 576px;
|
|
5
|
+
--breakpoint-s-breakpoint: 768px;
|
|
6
|
+
--breakpoint-m-breakpoint: 1024px;
|
|
7
|
+
--breakpoint-l-breakpoint: 1200px;
|
|
8
|
+
--breakpoint-xl-breakpoint: 1400px;
|
|
9
|
+
--breakpoint-xxl-breakpoint: 1600px;
|
|
10
|
+
--color-neutral-100: #e2e9ee;
|
|
11
|
+
--color-neutral-200: #b8c7d2;
|
|
12
|
+
--color-neutral-300: #748999;
|
|
13
|
+
--color-neutral-400: #3e5667;
|
|
14
|
+
--color-neutral-500: #233745;
|
|
15
|
+
--color-neutral-600: #1c2d39;
|
|
16
|
+
--color-neutral-700: #12202b;
|
|
17
|
+
--color-neutral-800: #0c1720;
|
|
18
|
+
--color-neutral-900: #0a141b;
|
|
19
|
+
--color-neutral-black: #0a141b;
|
|
20
|
+
--color-neutral-white: #ffffff;
|
|
21
|
+
--color-neutral-000: #f8fafc;
|
|
22
|
+
--color-action-100: #ddf4ff;
|
|
23
|
+
--color-action-200: #b7dff7;
|
|
24
|
+
--color-action-300: #85c6f2;
|
|
25
|
+
--color-action-400: #58aae9;
|
|
26
|
+
--color-action-500: #3a8fdd;
|
|
27
|
+
--color-action-600: #2a77c7;
|
|
28
|
+
--color-action-700: #2661a7;
|
|
29
|
+
--color-action-800: #274776;
|
|
30
|
+
--color-action-900: #253b5b;
|
|
31
|
+
--color-action-000: #ecf8ff;
|
|
32
|
+
--color-success-100: #e5ffd9;
|
|
33
|
+
--color-success-200: #c6f3b5;
|
|
34
|
+
--color-success-300: #abe39b;
|
|
35
|
+
--color-success-400: #8fd57f;
|
|
36
|
+
--color-success-500: #76c767;
|
|
37
|
+
--color-success-600: #60b255;
|
|
38
|
+
--color-success-700: #479442;
|
|
39
|
+
--color-success-800: #3b6f33;
|
|
40
|
+
--color-success-900: #3b612c;
|
|
41
|
+
--color-success-000: #f4ffef;
|
|
42
|
+
--color-warning-100: #fffddc;
|
|
43
|
+
--color-warning-200: #fefbb8;
|
|
44
|
+
--color-warning-300: #faed7e;
|
|
45
|
+
--color-warning-400: #f5db54;
|
|
46
|
+
--color-warning-500: #e8c242;
|
|
47
|
+
--color-warning-600: #cf9328;
|
|
48
|
+
--color-warning-700: #ae6d1d;
|
|
49
|
+
--color-warning-800: #8c4f17;
|
|
50
|
+
--color-warning-900: #693a12;
|
|
51
|
+
--color-warning-000: #ffffee;
|
|
52
|
+
--color-danger-100: #feeaec;
|
|
53
|
+
--color-danger-200: #fed1d1;
|
|
54
|
+
--color-danger-300: #fea9a9;
|
|
55
|
+
--color-danger-400: #fc7c75;
|
|
56
|
+
--color-danger-500: #f45249;
|
|
57
|
+
--color-danger-600: #ec4138;
|
|
58
|
+
--color-danger-700: #d53229;
|
|
59
|
+
--color-danger-800: #b22820;
|
|
60
|
+
--color-danger-900: #841c1b;
|
|
61
|
+
--color-danger-000: #fff3f4;
|
|
62
|
+
--color-supa-100: #deebff;
|
|
63
|
+
--color-supa-200: #bbd5fe;
|
|
64
|
+
--color-supa-300: #99b7f9;
|
|
65
|
+
--color-supa-400: #7392f3;
|
|
66
|
+
--color-supa-500: #5b73e6;
|
|
67
|
+
--color-supa-600: #4e5cd3;
|
|
68
|
+
--color-supa-700: #4248b6;
|
|
69
|
+
--color-supa-800: #3b3985;
|
|
70
|
+
--color-supa-900: #343160;
|
|
71
|
+
--color-supa-000: #e8f2ff;
|
|
72
|
+
--color-supb-100: #f2e9ff;
|
|
73
|
+
--color-supb-200: #e5d3fd;
|
|
74
|
+
--color-supb-300: #d0b5f9;
|
|
75
|
+
--color-supb-400: #ad89f1;
|
|
76
|
+
--color-supb-500: #936fe8;
|
|
77
|
+
--color-supb-600: #744fd0;
|
|
78
|
+
--color-supb-700: #603fb8;
|
|
79
|
+
--color-supb-800: #4b358f;
|
|
80
|
+
--color-supb-900: #3b2d6e;
|
|
81
|
+
--color-supb-000: #f9f3ff;
|
|
82
|
+
--color-supc-100: #fee9ff;
|
|
83
|
+
--color-supc-200: #fcd3fd;
|
|
84
|
+
--color-supc-300: #f7b5f9;
|
|
85
|
+
--color-supc-400: #ee89f1;
|
|
86
|
+
--color-supc-500: #e46fe8;
|
|
87
|
+
--color-supc-600: #cc4fd0;
|
|
88
|
+
--color-supc-700: #b43fb8;
|
|
89
|
+
--color-supc-800: #8c358f;
|
|
90
|
+
--color-supc-900: #6c2d6e;
|
|
91
|
+
--color-supc-000: #fff3ff;
|
|
92
|
+
--color-supd-100: #ffe1f0;
|
|
93
|
+
--color-supd-200: #ffcce5;
|
|
94
|
+
--color-supd-300: #ffa2b5;
|
|
95
|
+
--color-supd-400: #f77f97;
|
|
96
|
+
--color-supd-500: #f35d7b;
|
|
97
|
+
--color-supd-600: #d84b67;
|
|
98
|
+
--color-supd-700: #c43854;
|
|
99
|
+
--color-supd-800: #972b41;
|
|
100
|
+
--color-supd-900: #702232;
|
|
101
|
+
--color-supd-000: #ffeef6;
|
|
102
|
+
--color-supe-100: #fef2ea;
|
|
103
|
+
--color-supe-200: #fee2d1;
|
|
104
|
+
--color-supe-300: #fecaa9;
|
|
105
|
+
--color-supe-400: #fca975;
|
|
106
|
+
--color-supe-500: #f48b49;
|
|
107
|
+
--color-supe-600: #e0712c;
|
|
108
|
+
--color-supe-700: #c25c1d;
|
|
109
|
+
--color-supe-800: #9d4712;
|
|
110
|
+
--color-supe-900: #853a0c;
|
|
111
|
+
--color-supe-000: #fff8f3;
|
|
112
|
+
--color-supf-100: #dfffe9;
|
|
113
|
+
--color-supf-200: #bff4cf;
|
|
114
|
+
--color-supf-300: #8fe2ab;
|
|
115
|
+
--color-supf-400: #5dcd86;
|
|
116
|
+
--color-supf-500: #3fb26d;
|
|
117
|
+
--color-supf-600: #31975e;
|
|
118
|
+
--color-supf-700: #297a4f;
|
|
119
|
+
--color-supf-800: #245c40;
|
|
120
|
+
--color-supf-900: #1f4a35;
|
|
121
|
+
--color-supf-000: #eefff2;
|
|
122
|
+
--shadow-0: 0 0 0 transparent;
|
|
123
|
+
--shadow-1: 0 1px 3px rgba(0, 0, 0, 0.04);
|
|
124
|
+
--shadow-2: 0 2px 4px rgba(0, 0, 0, 0.08);
|
|
125
|
+
--shadow-3: 0 1px 3px rgba(0, 0, 0, 0.04), 0 4px 8px rgba(0, 0, 0, 0.14);
|
|
126
|
+
--spacing-0: 0;
|
|
127
|
+
--spacing-1: 0.125rem;
|
|
128
|
+
--spacing-2: 0.25rem;
|
|
129
|
+
--spacing-3: 0.375rem;
|
|
130
|
+
--spacing-4: 0.5rem;
|
|
131
|
+
--spacing-5: 0.625rem;
|
|
132
|
+
--spacing-6: 0.75rem;
|
|
133
|
+
--spacing-7: 0.875rem;
|
|
134
|
+
--spacing-8: 1rem;
|
|
135
|
+
--spacing-9: 1.125rem;
|
|
136
|
+
--spacing-10: 1.25rem;
|
|
137
|
+
--spacing-11: 1.5rem;
|
|
138
|
+
--spacing-12: 2rem;
|
|
139
|
+
--spacing-13: 2.5rem;
|
|
140
|
+
--spacing-14: 3rem;
|
|
141
|
+
--spacing-15: 4rem;
|
|
142
|
+
--spacing-16: 5rem;
|
|
143
|
+
--spacing-17: 6rem;
|
|
144
|
+
--spacing-18: 7rem;
|
|
145
|
+
--spacing-19: 8rem;
|
|
146
|
+
--spacing-20: 9rem;
|
|
147
|
+
--spacing-px: 1px;
|
|
148
|
+
--spacing-half: 50%;
|
|
149
|
+
--spacing-full: 100%;
|
|
150
|
+
--typography-xxs: 0.5rem;
|
|
151
|
+
--typography-xs: 0.625rem;
|
|
152
|
+
--typography-s: 0.75rem;
|
|
153
|
+
--typography-base: 0.875rem;
|
|
154
|
+
--typography-m: 1rem;
|
|
155
|
+
--typography-l: 1.125rem;
|
|
156
|
+
--typography-xl: 1.25rem;
|
|
157
|
+
--typography-xxl: 1.5rem;
|
|
158
|
+
--typography-display: 1.875rem;
|
|
159
|
+
--typography-display-l: 2.25rem;
|
|
160
|
+
--typography-display-xl: 3rem;
|
|
161
|
+
--zindex-context: 10000;
|
|
162
|
+
--zindex-dialog: 9000;
|
|
163
|
+
--zindex-modal: 8000;
|
|
164
|
+
--zindex-masthead: 7000;
|
|
165
|
+
--zindex-sidebar: 7000;
|
|
166
|
+
--zindex-overlay: 6000;
|
|
167
|
+
--zindex-dropdown: 5000;
|
|
168
|
+
--zindex-header: 4000;
|
|
169
|
+
--zindex-footer: 3000;
|
|
170
|
+
--zindex-timeline: 0;
|
|
171
|
+
--zindex-body: 0;
|
|
172
|
+
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@royalnavy/design-tokens",
|
|
3
|
-
"version": "4.
|
|
3
|
+
"version": "4.15.0",
|
|
4
4
|
"main": "dist/cjs/index.js",
|
|
5
5
|
"author": "Royal Navy",
|
|
6
6
|
"license": "Apache-2.0",
|
|
@@ -24,11 +24,11 @@
|
|
|
24
24
|
"types": "tsc --emitDeclarationOnly --declarationMap --declaration --noEmit false --allowJs false --outDir dist/types",
|
|
25
25
|
"prepack": "pnpm run build",
|
|
26
26
|
"test": "jest",
|
|
27
|
-
"lint": "eslint src --ext .js --ext .jsx --ext .ts --ext .tsx --ext .json --
|
|
27
|
+
"lint": "eslint src --ext .js --ext .jsx --ext .ts --ext .tsx --ext .json --resolve-plugins-relative-to ../eslint-config-react"
|
|
28
28
|
},
|
|
29
29
|
"lint-staged": {
|
|
30
30
|
"*.@(js|jsx|ts|tsx)": [
|
|
31
|
-
"eslint --ext .js --ext .jsx --ext .ts --ext .tsx --ext .json --
|
|
31
|
+
"eslint --ext .js --ext .jsx --ext .ts --ext .tsx --ext .json --resolve-plugins-relative-to ../eslint-config-react",
|
|
32
32
|
"prettier --write"
|
|
33
33
|
]
|
|
34
34
|
},
|
|
@@ -39,7 +39,7 @@
|
|
|
39
39
|
"@babel/preset-env": "^7.11.5",
|
|
40
40
|
"@babel/preset-react": "^7.10.4",
|
|
41
41
|
"@babel/preset-typescript": "^7.10.4",
|
|
42
|
-
"@royalnavy/eslint-config-react": "^4.
|
|
42
|
+
"@royalnavy/eslint-config-react": "^4.15.0",
|
|
43
43
|
"@testing-library/jest-dom": "^6.4.2",
|
|
44
44
|
"@testing-library/react": "^15.0.5",
|
|
45
45
|
"@types/jest": "^29.0.3",
|