@toptal/picasso-tailwind 2.4.0 → 2.5.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-package/package.json +1 -1
- package/dist-package/src/index.js +26 -2
- package/package.json +1 -1
- package/src/index.js +26 -2
|
@@ -31,11 +31,15 @@ module.exports = {
|
|
|
31
31
|
12: '3rem',
|
|
32
32
|
},
|
|
33
33
|
borderRadius: {
|
|
34
|
+
none: '0px',
|
|
34
35
|
sm: '4px',
|
|
35
36
|
md: '8px',
|
|
37
|
+
// to support fully rounded corners, use the same approach as TailwindCSS proposes
|
|
38
|
+
full: '9999px',
|
|
36
39
|
},
|
|
37
40
|
borderWidth: {
|
|
38
41
|
DEFAULT: '1px',
|
|
42
|
+
0: '0px',
|
|
39
43
|
},
|
|
40
44
|
fontFamily: {
|
|
41
45
|
sans: ['proxima-nova', 'Arial', 'sans-serif'],
|
|
@@ -66,6 +70,9 @@ module.exports = {
|
|
|
66
70
|
xl: ['1.25rem', { lineHeight: '1.875rem' }],
|
|
67
71
|
'2xl': ['1.75rem', { lineHeight: '2.625rem' }],
|
|
68
72
|
xxl: ['1.75rem', { lineHeight: '2.625rem' }],
|
|
73
|
+
'button-small': ['12px', { lineHeight: '15px' }],
|
|
74
|
+
'button-medium': ['13px', { lineHeight: '16px' }],
|
|
75
|
+
'button-large': ['15px', { lineHeight: '18px' }],
|
|
69
76
|
},
|
|
70
77
|
// TODO: [FX-5003] Deprecate legacy shadow classes
|
|
71
78
|
// Shadows 0-5 correspond to BASE design https://www.figma.com/file/9xnyixadrhlHe9UuXBMRlT/Foundations?type=design&node-id=22%3A21&mode=design&t=8d8TKUUuHKWosUtX-1
|
|
@@ -110,6 +117,7 @@ module.exports = {
|
|
|
110
117
|
colors: {
|
|
111
118
|
white: '#FFFFFF',
|
|
112
119
|
black: '#000000',
|
|
120
|
+
transparent: 'transparent',
|
|
113
121
|
blue: {
|
|
114
122
|
100: '#EDF1FD',
|
|
115
123
|
400: '#25A9EF',
|
|
@@ -163,8 +171,18 @@ module.exports = {
|
|
|
163
171
|
padding: {
|
|
164
172
|
input: '0.5rem',
|
|
165
173
|
},
|
|
174
|
+
transitionDuration: {
|
|
175
|
+
350: '350ms',
|
|
176
|
+
},
|
|
177
|
+
minWidth: ({ theme }) => ({
|
|
178
|
+
...theme('spacing'),
|
|
179
|
+
14: '3.5rem',
|
|
180
|
+
16: '4rem',
|
|
181
|
+
24: '6rem',
|
|
182
|
+
}),
|
|
166
183
|
// Needed to support all possible grid item widths in 12-columns grid
|
|
167
|
-
maxWidth: {
|
|
184
|
+
maxWidth: ({ theme }) => ({
|
|
185
|
+
...theme('spacing'),
|
|
168
186
|
'1/12': '8.333333%',
|
|
169
187
|
'2/12': '16.666667%',
|
|
170
188
|
'3/12': '25%',
|
|
@@ -176,7 +194,13 @@ module.exports = {
|
|
|
176
194
|
'9/12': '75%',
|
|
177
195
|
'10/12': '83.333333%',
|
|
178
196
|
'11/12': '91.666667%',
|
|
179
|
-
},
|
|
197
|
+
}),
|
|
198
|
+
minHeight: ({ theme }) => ({
|
|
199
|
+
...theme('spacing'),
|
|
200
|
+
}),
|
|
201
|
+
maxHeight: ({ theme }) => ({
|
|
202
|
+
...theme('spacing'),
|
|
203
|
+
}),
|
|
180
204
|
},
|
|
181
205
|
},
|
|
182
206
|
}
|
package/package.json
CHANGED
package/src/index.js
CHANGED
|
@@ -31,11 +31,15 @@ module.exports = {
|
|
|
31
31
|
12: '3rem',
|
|
32
32
|
},
|
|
33
33
|
borderRadius: {
|
|
34
|
+
none: '0px',
|
|
34
35
|
sm: '4px',
|
|
35
36
|
md: '8px',
|
|
37
|
+
// to support fully rounded corners, use the same approach as TailwindCSS proposes
|
|
38
|
+
full: '9999px',
|
|
36
39
|
},
|
|
37
40
|
borderWidth: {
|
|
38
41
|
DEFAULT: '1px',
|
|
42
|
+
0: '0px',
|
|
39
43
|
},
|
|
40
44
|
fontFamily: {
|
|
41
45
|
sans: ['proxima-nova', 'Arial', 'sans-serif'],
|
|
@@ -66,6 +70,9 @@ module.exports = {
|
|
|
66
70
|
xl: ['1.25rem', { lineHeight: '1.875rem' }],
|
|
67
71
|
'2xl': ['1.75rem', { lineHeight: '2.625rem' }],
|
|
68
72
|
xxl: ['1.75rem', { lineHeight: '2.625rem' }],
|
|
73
|
+
'button-small': ['12px', { lineHeight: '15px' }],
|
|
74
|
+
'button-medium': ['13px', { lineHeight: '16px' }],
|
|
75
|
+
'button-large': ['15px', { lineHeight: '18px' }],
|
|
69
76
|
},
|
|
70
77
|
// TODO: [FX-5003] Deprecate legacy shadow classes
|
|
71
78
|
// Shadows 0-5 correspond to BASE design https://www.figma.com/file/9xnyixadrhlHe9UuXBMRlT/Foundations?type=design&node-id=22%3A21&mode=design&t=8d8TKUUuHKWosUtX-1
|
|
@@ -110,6 +117,7 @@ module.exports = {
|
|
|
110
117
|
colors: {
|
|
111
118
|
white: '#FFFFFF',
|
|
112
119
|
black: '#000000',
|
|
120
|
+
transparent: 'transparent',
|
|
113
121
|
blue: {
|
|
114
122
|
100: '#EDF1FD',
|
|
115
123
|
400: '#25A9EF',
|
|
@@ -163,8 +171,18 @@ module.exports = {
|
|
|
163
171
|
padding: {
|
|
164
172
|
input: '0.5rem',
|
|
165
173
|
},
|
|
174
|
+
transitionDuration: {
|
|
175
|
+
350: '350ms',
|
|
176
|
+
},
|
|
177
|
+
minWidth: ({ theme }) => ({
|
|
178
|
+
...theme('spacing'),
|
|
179
|
+
14: '3.5rem',
|
|
180
|
+
16: '4rem',
|
|
181
|
+
24: '6rem',
|
|
182
|
+
}),
|
|
166
183
|
// Needed to support all possible grid item widths in 12-columns grid
|
|
167
|
-
maxWidth: {
|
|
184
|
+
maxWidth: ({ theme }) => ({
|
|
185
|
+
...theme('spacing'),
|
|
168
186
|
'1/12': '8.333333%',
|
|
169
187
|
'2/12': '16.666667%',
|
|
170
188
|
'3/12': '25%',
|
|
@@ -176,7 +194,13 @@ module.exports = {
|
|
|
176
194
|
'9/12': '75%',
|
|
177
195
|
'10/12': '83.333333%',
|
|
178
196
|
'11/12': '91.666667%',
|
|
179
|
-
},
|
|
197
|
+
}),
|
|
198
|
+
minHeight: ({ theme }) => ({
|
|
199
|
+
...theme('spacing'),
|
|
200
|
+
}),
|
|
201
|
+
maxHeight: ({ theme }) => ({
|
|
202
|
+
...theme('spacing'),
|
|
203
|
+
}),
|
|
180
204
|
},
|
|
181
205
|
},
|
|
182
206
|
}
|