@toptal/picasso-user-badge 2.0.7 → 2.0.8
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": "@toptal/picasso-user-badge",
|
|
3
|
-
"version": "2.0.
|
|
3
|
+
"version": "2.0.8",
|
|
4
4
|
"description": "Toptal UI components library - UserBadge",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"access": "public"
|
|
@@ -22,7 +22,7 @@
|
|
|
22
22
|
},
|
|
23
23
|
"homepage": "https://github.com/toptal/picasso/tree/master/packages/picasso#readme",
|
|
24
24
|
"dependencies": {
|
|
25
|
-
"@toptal/picasso-avatar": "
|
|
25
|
+
"@toptal/picasso-avatar": "4.0.0",
|
|
26
26
|
"@toptal/picasso-container": "1.0.3",
|
|
27
27
|
"@toptal/picasso-typography": "2.0.2",
|
|
28
28
|
"@toptal/picasso-utils": "1.0.3",
|
|
@@ -9,16 +9,20 @@ exports[`UserBadge auto center alignment 1`] = `
|
|
|
9
9
|
class="PicassoContainer-centerAlignItems PicassoContainer-flex PicassoUserBadge-root"
|
|
10
10
|
>
|
|
11
11
|
<div
|
|
12
|
-
class="relative
|
|
12
|
+
class="flex relative"
|
|
13
13
|
>
|
|
14
14
|
<div
|
|
15
|
-
class="
|
|
15
|
+
class="relative bg-gray text-[1rem] shrink-0 grow-0 w-[2.5em] h-[2.5em] [clip-path:polygon(0_0,_100%_0,_100%_100%,_0.5em_100%,_0_calc(100%-0.5em))]"
|
|
16
16
|
>
|
|
17
|
-
<
|
|
18
|
-
class="
|
|
17
|
+
<div
|
|
18
|
+
class="uppercase absolute top-1/2 left-1/2 [transform:translate(-50%,-50%)] text-[1em] PicassoUserBadge-avatar"
|
|
19
19
|
>
|
|
20
|
-
|
|
21
|
-
|
|
20
|
+
<p
|
|
21
|
+
class="m-0 text-white font-regular text-[1em] leading-[1.5em]"
|
|
22
|
+
>
|
|
23
|
+
JD
|
|
24
|
+
</p>
|
|
25
|
+
</div>
|
|
22
26
|
</div>
|
|
23
27
|
</div>
|
|
24
28
|
<div
|
|
@@ -48,16 +52,20 @@ exports[`UserBadge custom name 1`] = `
|
|
|
48
52
|
class="PicassoContainer-flexStartAlignItems PicassoContainer-flex PicassoUserBadge-root"
|
|
49
53
|
>
|
|
50
54
|
<div
|
|
51
|
-
class="relative
|
|
55
|
+
class="flex relative"
|
|
52
56
|
>
|
|
53
57
|
<div
|
|
54
|
-
class="
|
|
58
|
+
class="relative bg-gray text-[1rem] shrink-0 grow-0 w-[2.5em] h-[2.5em] [clip-path:polygon(0_0,_100%_0,_100%_100%,_0.5em_100%,_0_calc(100%-0.5em))]"
|
|
55
59
|
>
|
|
56
|
-
<
|
|
57
|
-
class="
|
|
60
|
+
<div
|
|
61
|
+
class="uppercase absolute top-1/2 left-1/2 [transform:translate(-50%,-50%)] text-[1em] PicassoUserBadge-avatar"
|
|
58
62
|
>
|
|
59
|
-
|
|
60
|
-
|
|
63
|
+
<p
|
|
64
|
+
class="m-0 text-white font-regular text-[1em] leading-[1.5em]"
|
|
65
|
+
>
|
|
66
|
+
JD
|
|
67
|
+
</p>
|
|
68
|
+
</div>
|
|
61
69
|
</div>
|
|
62
70
|
</div>
|
|
63
71
|
<div
|
|
@@ -90,16 +98,20 @@ exports[`UserBadge custom title 1`] = `
|
|
|
90
98
|
class="PicassoContainer-flexStartAlignItems PicassoContainer-flex PicassoUserBadge-root"
|
|
91
99
|
>
|
|
92
100
|
<div
|
|
93
|
-
class="relative
|
|
101
|
+
class="flex relative"
|
|
94
102
|
>
|
|
95
103
|
<div
|
|
96
|
-
class="
|
|
104
|
+
class="relative bg-gray text-[1rem] shrink-0 grow-0 w-[2.5em] h-[2.5em] [clip-path:polygon(0_0,_100%_0,_100%_100%,_0.5em_100%,_0_calc(100%-0.5em))]"
|
|
97
105
|
>
|
|
98
|
-
<
|
|
99
|
-
class="
|
|
106
|
+
<div
|
|
107
|
+
class="uppercase absolute top-1/2 left-1/2 [transform:translate(-50%,-50%)] text-[1em] PicassoUserBadge-avatar"
|
|
100
108
|
>
|
|
101
|
-
|
|
102
|
-
|
|
109
|
+
<p
|
|
110
|
+
class="m-0 text-white font-regular text-[1em] leading-[1.5em]"
|
|
111
|
+
>
|
|
112
|
+
JD
|
|
113
|
+
</p>
|
|
114
|
+
</div>
|
|
103
115
|
</div>
|
|
104
116
|
</div>
|
|
105
117
|
<div
|
|
@@ -137,16 +149,20 @@ exports[`UserBadge invert render 1`] = `
|
|
|
137
149
|
class="PicassoContainer-flexStartAlignItems PicassoContainer-flex PicassoUserBadge-root"
|
|
138
150
|
>
|
|
139
151
|
<div
|
|
140
|
-
class="relative
|
|
152
|
+
class="flex relative"
|
|
141
153
|
>
|
|
142
154
|
<div
|
|
143
|
-
class="
|
|
155
|
+
class="relative bg-gray text-[1rem] shrink-0 grow-0 w-[2.5em] h-[2.5em] [clip-path:polygon(0_0,_100%_0,_100%_100%,_0.5em_100%,_0_calc(100%-0.5em))]"
|
|
144
156
|
>
|
|
145
|
-
<
|
|
146
|
-
class="
|
|
157
|
+
<div
|
|
158
|
+
class="uppercase absolute top-1/2 left-1/2 [transform:translate(-50%,-50%)] text-[1em] PicassoUserBadge-avatar"
|
|
147
159
|
>
|
|
148
|
-
|
|
149
|
-
|
|
160
|
+
<p
|
|
161
|
+
class="m-0 text-white font-regular text-[1em] leading-[1.5em]"
|
|
162
|
+
>
|
|
163
|
+
JD
|
|
164
|
+
</p>
|
|
165
|
+
</div>
|
|
150
166
|
</div>
|
|
151
167
|
</div>
|
|
152
168
|
<div
|
|
@@ -181,16 +197,20 @@ exports[`UserBadge manual center alignment 1`] = `
|
|
|
181
197
|
class="PicassoContainer-centerAlignItems PicassoContainer-flex PicassoUserBadge-root"
|
|
182
198
|
>
|
|
183
199
|
<div
|
|
184
|
-
class="relative
|
|
200
|
+
class="flex relative"
|
|
185
201
|
>
|
|
186
202
|
<div
|
|
187
|
-
class="
|
|
203
|
+
class="relative bg-gray text-[1rem] shrink-0 grow-0 w-[2.5em] h-[2.5em] [clip-path:polygon(0_0,_100%_0,_100%_100%,_0.5em_100%,_0_calc(100%-0.5em))]"
|
|
188
204
|
>
|
|
189
|
-
<
|
|
190
|
-
class="
|
|
205
|
+
<div
|
|
206
|
+
class="uppercase absolute top-1/2 left-1/2 [transform:translate(-50%,-50%)] text-[1em] PicassoUserBadge-avatar"
|
|
191
207
|
>
|
|
192
|
-
|
|
193
|
-
|
|
208
|
+
<p
|
|
209
|
+
class="m-0 text-white font-regular text-[1em] leading-[1.5em]"
|
|
210
|
+
>
|
|
211
|
+
JD
|
|
212
|
+
</p>
|
|
213
|
+
</div>
|
|
194
214
|
</div>
|
|
195
215
|
</div>
|
|
196
216
|
<div
|
|
@@ -225,16 +245,20 @@ exports[`UserBadge override auto center alignment 1`] = `
|
|
|
225
245
|
class="PicassoContainer-flexStartAlignItems PicassoContainer-flex PicassoUserBadge-root"
|
|
226
246
|
>
|
|
227
247
|
<div
|
|
228
|
-
class="relative
|
|
248
|
+
class="flex relative"
|
|
229
249
|
>
|
|
230
250
|
<div
|
|
231
|
-
class="
|
|
251
|
+
class="relative bg-gray text-[1rem] shrink-0 grow-0 w-[2.5em] h-[2.5em] [clip-path:polygon(0_0,_100%_0,_100%_100%,_0.5em_100%,_0_calc(100%-0.5em))]"
|
|
232
252
|
>
|
|
233
|
-
<
|
|
234
|
-
class="
|
|
253
|
+
<div
|
|
254
|
+
class="uppercase absolute top-1/2 left-1/2 [transform:translate(-50%,-50%)] text-[1em] PicassoUserBadge-avatar"
|
|
235
255
|
>
|
|
236
|
-
|
|
237
|
-
|
|
256
|
+
<p
|
|
257
|
+
class="m-0 text-white font-regular text-[1em] leading-[1.5em]"
|
|
258
|
+
>
|
|
259
|
+
JD
|
|
260
|
+
</p>
|
|
261
|
+
</div>
|
|
238
262
|
</div>
|
|
239
263
|
</div>
|
|
240
264
|
<div
|
|
@@ -264,16 +288,20 @@ exports[`UserBadge renders 1`] = `
|
|
|
264
288
|
class="PicassoContainer-flexStartAlignItems PicassoContainer-flex PicassoUserBadge-root"
|
|
265
289
|
>
|
|
266
290
|
<div
|
|
267
|
-
class="relative
|
|
291
|
+
class="flex relative"
|
|
268
292
|
>
|
|
269
293
|
<div
|
|
270
|
-
class="
|
|
294
|
+
class="relative bg-gray text-[1rem] shrink-0 grow-0 w-[2.5em] h-[2.5em] [clip-path:polygon(0_0,_100%_0,_100%_100%,_0.5em_100%,_0_calc(100%-0.5em))]"
|
|
271
295
|
>
|
|
272
|
-
<
|
|
273
|
-
class="
|
|
296
|
+
<div
|
|
297
|
+
class="uppercase absolute top-1/2 left-1/2 [transform:translate(-50%,-50%)] text-[1em] PicassoUserBadge-avatar"
|
|
274
298
|
>
|
|
275
|
-
|
|
276
|
-
|
|
299
|
+
<p
|
|
300
|
+
class="m-0 text-white font-regular text-[1em] leading-[1.5em]"
|
|
301
|
+
>
|
|
302
|
+
JD
|
|
303
|
+
</p>
|
|
304
|
+
</div>
|
|
277
305
|
</div>
|
|
278
306
|
</div>
|
|
279
307
|
<div
|
|
@@ -308,16 +336,20 @@ exports[`UserBadge small size 1`] = `
|
|
|
308
336
|
class="PicassoContainer-flexStartAlignItems PicassoContainer-flex PicassoUserBadge-root"
|
|
309
337
|
>
|
|
310
338
|
<div
|
|
311
|
-
class="relative
|
|
339
|
+
class="flex relative"
|
|
312
340
|
>
|
|
313
341
|
<div
|
|
314
|
-
class="
|
|
342
|
+
class="relative bg-gray text-[1rem] shrink-0 grow-0 w-[5em] h-[5em] [clip-path:polygon(0_0,_100%_0,_100%_100%,_1em_100%,_0_calc(100%-1em))]"
|
|
315
343
|
>
|
|
316
|
-
<
|
|
317
|
-
class="
|
|
344
|
+
<div
|
|
345
|
+
class="uppercase absolute top-1/2 left-1/2 [transform:translate(-50%,-50%)] text-[2em] PicassoUserBadge-avatar"
|
|
318
346
|
>
|
|
319
|
-
|
|
320
|
-
|
|
347
|
+
<p
|
|
348
|
+
class="m-0 text-white font-regular text-[1em] leading-[1.5em]"
|
|
349
|
+
>
|
|
350
|
+
JD
|
|
351
|
+
</p>
|
|
352
|
+
</div>
|
|
321
353
|
</div>
|
|
322
354
|
</div>
|
|
323
355
|
<div
|