slippers-ui 2.0.14 → 2.0.15
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": "slippers-ui",
|
|
3
|
-
"version": "2.0.
|
|
3
|
+
"version": "2.0.15",
|
|
4
4
|
"private": false,
|
|
5
5
|
"description": "GitLab Marketing Design System",
|
|
6
6
|
"author": "GitLab",
|
|
@@ -27,11 +27,12 @@
|
|
|
27
27
|
},
|
|
28
28
|
"devDependencies": {
|
|
29
29
|
"@babel/core": "^7.16.7",
|
|
30
|
-
"@
|
|
31
|
-
"@storybook/addon-
|
|
32
|
-
"@storybook/addon-
|
|
33
|
-
"@storybook/addon-
|
|
34
|
-
"@storybook/
|
|
30
|
+
"@mdx-js/react": "^1.6.22",
|
|
31
|
+
"@storybook/addon-actions": "^6.5.9",
|
|
32
|
+
"@storybook/addon-docs": "^6.5.9",
|
|
33
|
+
"@storybook/addon-essentials": "^6.5.9",
|
|
34
|
+
"@storybook/addon-links": "^6.5.9",
|
|
35
|
+
"@storybook/vue": "^6.5.9",
|
|
35
36
|
"@typescript-eslint/eslint-plugin": "^4.18.0",
|
|
36
37
|
"@typescript-eslint/parser": "^4.18.0",
|
|
37
38
|
"@vue/cli-plugin-babel": "~4.5.0",
|
|
@@ -44,7 +45,7 @@
|
|
|
44
45
|
"css-loader": "^5.2.7",
|
|
45
46
|
"eslint": "^6.7.2",
|
|
46
47
|
"eslint-plugin-prettier": "^3.3.1",
|
|
47
|
-
"eslint-plugin-storybook": "^0.
|
|
48
|
+
"eslint-plugin-storybook": "^0.6.1",
|
|
48
49
|
"eslint-plugin-vue": "^6.2.2",
|
|
49
50
|
"html-loader": "^1.0.0-alpha.0",
|
|
50
51
|
"prettier": "^2.2.1",
|
|
@@ -163,28 +163,34 @@ $spacing-vertical: "y" !default;
|
|
|
163
163
|
$font-size-default: 16px !default;
|
|
164
164
|
|
|
165
165
|
// Headings
|
|
166
|
-
$text-display-1:
|
|
166
|
+
$text-display-1: 96px !default;
|
|
167
167
|
|
|
168
|
-
$text-heading-1:
|
|
169
|
-
$text-heading-2:
|
|
170
|
-
$text-heading-3:
|
|
171
|
-
$text-heading-4:
|
|
172
|
-
$text-heading-5:
|
|
168
|
+
$text-heading-1: 80px !default;
|
|
169
|
+
$text-heading-2: 56px !default;
|
|
170
|
+
$text-heading-3: 40px !default;
|
|
171
|
+
$text-heading-4: 32px !default;
|
|
172
|
+
$text-heading-5: 24px !default;
|
|
173
173
|
|
|
174
174
|
$text-display-1-mobile: 77px !default;
|
|
175
175
|
|
|
176
|
-
$text-heading-1-mobile:
|
|
177
|
-
$text-heading-2-mobile:
|
|
178
|
-
$text-heading-3-mobile:
|
|
176
|
+
$text-heading-1-mobile: 68px !default;
|
|
177
|
+
$text-heading-2-mobile: 48px !default;
|
|
178
|
+
$text-heading-3-mobile: 36px !default;
|
|
179
|
+
$text-heading-4-mobile: 28px !default;
|
|
180
|
+
$text-heading-5-mobile: 20px !default;
|
|
179
181
|
|
|
180
182
|
// Body
|
|
181
|
-
$text-body-1:
|
|
182
|
-
$text-body-2:
|
|
183
|
-
$text-body-3:
|
|
183
|
+
$text-body-1: 20px !default;
|
|
184
|
+
$text-body-2: 16px !default;
|
|
185
|
+
$text-body-3: 14px !default;
|
|
184
186
|
|
|
185
187
|
$text-body-1-bold: 20px !default;
|
|
186
|
-
$text-body-2-bold:
|
|
187
|
-
$text-body-3-bold:
|
|
188
|
+
$text-body-2-bold: 16px !default;
|
|
189
|
+
$text-body-3-bold: 14px !default;
|
|
190
|
+
|
|
191
|
+
$text-body-1-link: 20px !default;
|
|
192
|
+
$text-body-2-link: 16px !default;
|
|
193
|
+
$text-body-3-link: 14px !default;
|
|
188
194
|
|
|
189
195
|
// Button
|
|
190
196
|
$text-button-1: 18px !default;
|
|
@@ -201,19 +207,21 @@ $text-emphasis: 23px !default;
|
|
|
201
207
|
// Line Heights
|
|
202
208
|
$line-height-default: 24px !default;
|
|
203
209
|
|
|
204
|
-
$line-height-display-1:
|
|
210
|
+
$line-height-display-1: 100px !default;
|
|
205
211
|
|
|
206
|
-
$line-height-heading-1:
|
|
207
|
-
$line-height-heading-2:
|
|
208
|
-
$line-height-heading-3:
|
|
209
|
-
$line-height-heading-4:
|
|
210
|
-
$line-height-heading-5:
|
|
212
|
+
$line-height-heading-1: 90px !default;
|
|
213
|
+
$line-height-heading-2: 66px !default;
|
|
214
|
+
$line-height-heading-3: 48px !default;
|
|
215
|
+
$line-height-heading-4: 40px !default;
|
|
216
|
+
$line-height-heading-5: 32px !default;
|
|
211
217
|
|
|
212
218
|
$line-height-display-1-mobile: 96px !default;
|
|
213
219
|
|
|
214
|
-
$line-height-heading-1-mobile:
|
|
215
|
-
$line-height-heading-2-mobile:
|
|
216
|
-
$line-height-heading-3-mobile:
|
|
220
|
+
$line-height-heading-1-mobile: 68px !default;
|
|
221
|
+
$line-height-heading-2-mobile: 60px !default;
|
|
222
|
+
$line-height-heading-3-mobile: 48px !default;
|
|
223
|
+
$line-height-heading-4-mobile: 36px !default;
|
|
224
|
+
$line-height-heading-5-mobile: 28px !default;
|
|
217
225
|
|
|
218
226
|
$line-height-body-1: 24px !default;
|
|
219
227
|
$line-height-body-2: 20px !default;
|
|
@@ -223,11 +231,35 @@ $line-height-body-1-bold: 32px !default;
|
|
|
223
231
|
$line-height-body-2-bold: 28px !default;
|
|
224
232
|
$line-height-body-3-bold: 24px !default;
|
|
225
233
|
|
|
234
|
+
$line-height-body-1-link: 32px !default;
|
|
235
|
+
$line-height-body-2-link: 28px !default;
|
|
236
|
+
$line-height-body-3-link: 24px !default;
|
|
237
|
+
|
|
226
238
|
$line-height-button-1: 20px !default;
|
|
227
239
|
$line-height-caps: 20px !default;
|
|
228
240
|
$line-height-quotes: 38px !default;
|
|
229
241
|
$line-height-emphasis: 38px !default;
|
|
230
242
|
|
|
243
|
+
// Heading Letter Spacing
|
|
244
|
+
$letter-spacing-display-1: -3px !default;
|
|
245
|
+
|
|
246
|
+
$letter-spacing-heading-1: -3.5px !default;
|
|
247
|
+
$letter-spacing-heading-2: -1.5px !default;
|
|
248
|
+
$letter-spacing-heading-3: -2px !default;
|
|
249
|
+
$letter-spacing-heading-4: -1.5px !default;
|
|
250
|
+
$letter-spacing-heading-5: -1px !default;
|
|
251
|
+
|
|
252
|
+
$letter-spacing-heading-2-mobile: -2.5px !default;
|
|
253
|
+
$letter-spacing-heading-5-mobile: 0px !default;
|
|
254
|
+
|
|
255
|
+
$letter-spacing-heading-1-bold: -1.5px !default;
|
|
256
|
+
$letter-spacing-heading-2-bold: -2.5px !default;
|
|
257
|
+
$letter-spacing-heading-3-bold: -2px !default;
|
|
258
|
+
$letter-spacing-heading-4-bold: -1.5px !default;
|
|
259
|
+
$letter-spacing-heading-5-bold: -1px !default;
|
|
260
|
+
|
|
261
|
+
$letter-spacing-heading-1-bold-mobile: -1.5px !default;
|
|
262
|
+
|
|
231
263
|
// Font Weight
|
|
232
264
|
$font-weight-normal: 400 !default;
|
|
233
265
|
$font-weight-bold: 600 !default;
|
|
@@ -300,3 +332,6 @@ $shadow-surface-secondary-1: $color-surface-300 0px 8px 50px -24px;
|
|
|
300
332
|
$shadow-surface-secondary-2: $color-surface-300 0px 16px 50px -24px;
|
|
301
333
|
$shadow-surface-secondary-3: $color-surface-300 0px 24px 50px -24px;
|
|
302
334
|
$shadow-surface-secondary-4: $color-surface-300 0px 32px 50px -24px;
|
|
335
|
+
|
|
336
|
+
$interactive-ease: cubic-bezier(0.70, 0.00, 0.30, 1.00);
|
|
337
|
+
$expressive-ease: cubic-bezier(0.30, 0.80, 0.70, 1.20);
|