@aristobyte-ui/button 1.0.53 → 1.0.54

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.
Files changed (9) hide show
  1. package/dist/index.css +0 -690
  2. package/dist/index.css.map +1 -1
  3. package/dist/index.d.mts +3 -3
  4. package/dist/index.d.ts +3 -3
  5. package/dist/index.js +61 -72
  6. package/dist/index.js.map +1 -1
  7. package/dist/index.mjs +61 -72
  8. package/dist/index.mjs.map +1 -1
  9. package/package.json +5 -5
package/dist/index.css CHANGED
@@ -1,693 +1,3 @@
1
- /* components/Button/Button.module.scss */
2
- .Button_module_button {
3
- align-items: center;
4
- border: none;
5
- cursor: pointer;
6
- display: flex;
7
- font-weight: 500;
8
- gap: 10px;
9
- justify-content: center;
10
- letter-spacing: 0rem;
11
- line-height: 1.42;
12
- overflow: hidden;
13
- position: relative;
14
- text-align: center;
15
- transition: background-color 200ms ease, transform 300ms ease;
16
- }
17
- .Button_module_button:disabled {
18
- cursor: not-allowed;
19
- opacity: 1;
20
- }
21
- .Button_module_button:active {
22
- transform: scale(0.96);
23
- }
24
- .Button_module_button--transparent {
25
- background-color: transparent !important;
26
- }
27
- .Button_module_button-variant--default.Button_module_button-appearance--solid {
28
- background-color: #1f2937;
29
- backdrop-filter: 8px;
30
- color: #ffffff;
31
- }
32
- .Button_module_button-variant--default.Button_module_button-appearance--solid:hover {
33
- background-color: #111827;
34
- }
35
- .Button_module_button-variant--default.Button_module_button-appearance--solid:disabled {
36
- background-color: rgba(31, 41, 55, 0.5);
37
- color: rgba(255, 255, 255, 0.5);
38
- }
39
- .Button_module_button-variant--default.Button_module_button-appearance--solid:disabled .Button_module_icon {
40
- color: rgba(255, 255, 255, 0.5);
41
- }
42
- .Button_module_button-variant--default.Button_module_button-appearance--solid .Button_module_icon {
43
- color: #ffffff;
44
- }
45
- .Button_module_button-variant--default.Button_module_button-appearance--outline {
46
- background-color: rgba(31, 41, 55, 0.2);
47
- backdrop-filter: 8px;
48
- border: 1px solid #1f2937;
49
- color: #ffffff;
50
- }
51
- .Button_module_button-variant--default.Button_module_button-appearance--outline:hover {
52
- background-color: #1f2937;
53
- }
54
- .Button_module_button-variant--default.Button_module_button-appearance--outline:disabled {
55
- background-color: rgba(31, 41, 55, 0.2);
56
- color: rgba(255, 255, 255, 0.5);
57
- }
58
- .Button_module_button-variant--default.Button_module_button-appearance--outline:disabled .Button_module_icon {
59
- color: rgba(255, 255, 255, 0.5);
60
- }
61
- .Button_module_button-variant--default.Button_module_button-appearance--outline .Button_module_icon {
62
- color: #ffffff;
63
- }
64
- .Button_module_button-variant--default.Button_module_button-appearance--outline-dashed {
65
- background-color: rgba(31, 41, 55, 0.2);
66
- backdrop-filter: 8px;
67
- border: 1px dashed #1f2937;
68
- color: #ffffff;
69
- }
70
- .Button_module_button-variant--default.Button_module_button-appearance--outline-dashed:hover {
71
- background-color: #1f2937;
72
- }
73
- .Button_module_button-variant--default.Button_module_button-appearance--outline-dashed:disabled {
74
- background-color: rgba(31, 41, 55, 0.2);
75
- color: rgba(255, 255, 255, 0.5);
76
- }
77
- .Button_module_button-variant--default.Button_module_button-appearance--outline-dashed:disabled .Button_module_icon {
78
- color: rgba(255, 255, 255, 0.5);
79
- }
80
- .Button_module_button-variant--default.Button_module_button-appearance--outline-dashed .Button_module_icon {
81
- color: #ffffff;
82
- }
83
- .Button_module_button-variant--default.Button_module_button-appearance--no-outline {
84
- background-color: rgba(31, 41, 55, 0.2);
85
- backdrop-filter: 8px;
86
- color: #ffffff;
87
- }
88
- .Button_module_button-variant--default.Button_module_button-appearance--no-outline:hover {
89
- background-color: #1f2937;
90
- }
91
- .Button_module_button-variant--default.Button_module_button-appearance--no-outline:disabled {
92
- background-color: rgba(31, 41, 55, 0.2);
93
- color: rgba(255, 255, 255, 0.5);
94
- }
95
- .Button_module_button-variant--default.Button_module_button-appearance--no-outline:disabled .Button_module_icon {
96
- color: rgba(255, 255, 255, 0.5);
97
- }
98
- .Button_module_button-variant--default.Button_module_button-appearance--no-outline .Button_module_icon {
99
- color: #ffffff;
100
- }
101
- .Button_module_button-variant--default.Button_module_button-appearance--glowing {
102
- background-color: rgba(31, 41, 55, 0.2);
103
- backdrop-filter: 8px;
104
- border: 1px solid #1f2937;
105
- color: #ffffff;
106
- box-shadow:
107
- 0 0 8px rgba(31, 41, 55, 0.5),
108
- 0 0 16px rgba(31, 41, 55, 0.4),
109
- 0 0 24px rgba(31, 41, 55, 0.3);
110
- }
111
- .Button_module_button-variant--default.Button_module_button-appearance--glowing:hover {
112
- background-color: #1f2937;
113
- }
114
- .Button_module_button-variant--default.Button_module_button-appearance--glowing:disabled {
115
- background-color: rgba(31, 41, 55, 0.2);
116
- color: rgba(255, 255, 255, 0.5);
117
- }
118
- .Button_module_button-variant--default.Button_module_button-appearance--glowing:disabled .Button_module_icon {
119
- color: rgba(255, 255, 255, 0.5);
120
- }
121
- .Button_module_button-variant--default.Button_module_button-appearance--glowing .Button_module_icon {
122
- color: #ffffff;
123
- }
124
- .Button_module_button-variant--primary.Button_module_button-appearance--solid {
125
- background-color: #2563eb;
126
- backdrop-filter: 8px;
127
- color: #ffffff;
128
- }
129
- .Button_module_button-variant--primary.Button_module_button-appearance--solid:hover {
130
- background-color: #1d4ed8;
131
- }
132
- .Button_module_button-variant--primary.Button_module_button-appearance--solid:disabled {
133
- background-color: rgba(37, 99, 235, 0.5);
134
- color: rgba(255, 255, 255, 0.5);
135
- }
136
- .Button_module_button-variant--primary.Button_module_button-appearance--solid:disabled .Button_module_icon {
137
- color: rgba(255, 255, 255, 0.5);
138
- }
139
- .Button_module_button-variant--primary.Button_module_button-appearance--solid .Button_module_icon {
140
- color: #ffffff;
141
- }
142
- .Button_module_button-variant--primary.Button_module_button-appearance--outline {
143
- background-color: rgba(37, 99, 235, 0.2);
144
- backdrop-filter: 8px;
145
- border: 1px solid #2563eb;
146
- color: #ffffff;
147
- }
148
- .Button_module_button-variant--primary.Button_module_button-appearance--outline:hover {
149
- background-color: #2563eb;
150
- }
151
- .Button_module_button-variant--primary.Button_module_button-appearance--outline:disabled {
152
- background-color: rgba(37, 99, 235, 0.2);
153
- color: rgba(255, 255, 255, 0.5);
154
- }
155
- .Button_module_button-variant--primary.Button_module_button-appearance--outline:disabled .Button_module_icon {
156
- color: rgba(255, 255, 255, 0.5);
157
- }
158
- .Button_module_button-variant--primary.Button_module_button-appearance--outline .Button_module_icon {
159
- color: #ffffff;
160
- }
161
- .Button_module_button-variant--primary.Button_module_button-appearance--outline-dashed {
162
- background-color: rgba(37, 99, 235, 0.2);
163
- backdrop-filter: 8px;
164
- border: 1px dashed #2563eb;
165
- color: #ffffff;
166
- }
167
- .Button_module_button-variant--primary.Button_module_button-appearance--outline-dashed:hover {
168
- background-color: #2563eb;
169
- }
170
- .Button_module_button-variant--primary.Button_module_button-appearance--outline-dashed:disabled {
171
- background-color: rgba(37, 99, 235, 0.2);
172
- color: rgba(255, 255, 255, 0.5);
173
- }
174
- .Button_module_button-variant--primary.Button_module_button-appearance--outline-dashed:disabled .Button_module_icon {
175
- color: rgba(255, 255, 255, 0.5);
176
- }
177
- .Button_module_button-variant--primary.Button_module_button-appearance--outline-dashed .Button_module_icon {
178
- color: #ffffff;
179
- }
180
- .Button_module_button-variant--primary.Button_module_button-appearance--no-outline {
181
- background-color: rgba(37, 99, 235, 0.2);
182
- backdrop-filter: 8px;
183
- color: #ffffff;
184
- }
185
- .Button_module_button-variant--primary.Button_module_button-appearance--no-outline:hover {
186
- background-color: #2563eb;
187
- }
188
- .Button_module_button-variant--primary.Button_module_button-appearance--no-outline:disabled {
189
- background-color: rgba(37, 99, 235, 0.2);
190
- color: rgba(255, 255, 255, 0.5);
191
- }
192
- .Button_module_button-variant--primary.Button_module_button-appearance--no-outline:disabled .Button_module_icon {
193
- color: rgba(255, 255, 255, 0.5);
194
- }
195
- .Button_module_button-variant--primary.Button_module_button-appearance--no-outline .Button_module_icon {
196
- color: #ffffff;
197
- }
198
- .Button_module_button-variant--primary.Button_module_button-appearance--glowing {
199
- background-color: rgba(37, 99, 235, 0.2);
200
- backdrop-filter: 8px;
201
- border: 1px solid #2563eb;
202
- color: #ffffff;
203
- box-shadow:
204
- 0 0 8px rgba(37, 99, 235, 0.5),
205
- 0 0 16px rgba(37, 99, 235, 0.4),
206
- 0 0 24px rgba(37, 99, 235, 0.3);
207
- }
208
- .Button_module_button-variant--primary.Button_module_button-appearance--glowing:hover {
209
- background-color: #2563eb;
210
- }
211
- .Button_module_button-variant--primary.Button_module_button-appearance--glowing:disabled {
212
- background-color: rgba(37, 99, 235, 0.2);
213
- color: rgba(255, 255, 255, 0.5);
214
- }
215
- .Button_module_button-variant--primary.Button_module_button-appearance--glowing:disabled .Button_module_icon {
216
- color: rgba(255, 255, 255, 0.5);
217
- }
218
- .Button_module_button-variant--primary.Button_module_button-appearance--glowing .Button_module_icon {
219
- color: #ffffff;
220
- }
221
- .Button_module_button-variant--secondary.Button_module_button-appearance--solid {
222
- background-color: #4f46e5;
223
- backdrop-filter: 8px;
224
- color: #ffffff;
225
- }
226
- .Button_module_button-variant--secondary.Button_module_button-appearance--solid:hover {
227
- background-color: #4338ca;
228
- }
229
- .Button_module_button-variant--secondary.Button_module_button-appearance--solid:disabled {
230
- background-color: rgba(79, 70, 229, 0.5);
231
- color: rgba(255, 255, 255, 0.5);
232
- }
233
- .Button_module_button-variant--secondary.Button_module_button-appearance--solid:disabled .Button_module_icon {
234
- color: rgba(255, 255, 255, 0.5);
235
- }
236
- .Button_module_button-variant--secondary.Button_module_button-appearance--solid .Button_module_icon {
237
- color: #ffffff;
238
- }
239
- .Button_module_button-variant--secondary.Button_module_button-appearance--outline {
240
- background-color: rgba(79, 70, 229, 0.2);
241
- backdrop-filter: 8px;
242
- border: 1px solid #4f46e5;
243
- color: #ffffff;
244
- }
245
- .Button_module_button-variant--secondary.Button_module_button-appearance--outline:hover {
246
- background-color: #4f46e5;
247
- }
248
- .Button_module_button-variant--secondary.Button_module_button-appearance--outline:disabled {
249
- background-color: rgba(79, 70, 229, 0.2);
250
- color: rgba(255, 255, 255, 0.5);
251
- }
252
- .Button_module_button-variant--secondary.Button_module_button-appearance--outline:disabled .Button_module_icon {
253
- color: rgba(255, 255, 255, 0.5);
254
- }
255
- .Button_module_button-variant--secondary.Button_module_button-appearance--outline .Button_module_icon {
256
- color: #ffffff;
257
- }
258
- .Button_module_button-variant--secondary.Button_module_button-appearance--outline-dashed {
259
- background-color: rgba(79, 70, 229, 0.2);
260
- backdrop-filter: 8px;
261
- border: 1px dashed #4f46e5;
262
- color: #ffffff;
263
- }
264
- .Button_module_button-variant--secondary.Button_module_button-appearance--outline-dashed:hover {
265
- background-color: #4f46e5;
266
- }
267
- .Button_module_button-variant--secondary.Button_module_button-appearance--outline-dashed:disabled {
268
- background-color: rgba(79, 70, 229, 0.2);
269
- color: rgba(255, 255, 255, 0.5);
270
- }
271
- .Button_module_button-variant--secondary.Button_module_button-appearance--outline-dashed:disabled .Button_module_icon {
272
- color: rgba(255, 255, 255, 0.5);
273
- }
274
- .Button_module_button-variant--secondary.Button_module_button-appearance--outline-dashed .Button_module_icon {
275
- color: #ffffff;
276
- }
277
- .Button_module_button-variant--secondary.Button_module_button-appearance--no-outline {
278
- background-color: rgba(79, 70, 229, 0.2);
279
- backdrop-filter: 8px;
280
- color: #ffffff;
281
- }
282
- .Button_module_button-variant--secondary.Button_module_button-appearance--no-outline:hover {
283
- background-color: #4f46e5;
284
- }
285
- .Button_module_button-variant--secondary.Button_module_button-appearance--no-outline:disabled {
286
- background-color: rgba(79, 70, 229, 0.2);
287
- color: rgba(255, 255, 255, 0.5);
288
- }
289
- .Button_module_button-variant--secondary.Button_module_button-appearance--no-outline:disabled .Button_module_icon {
290
- color: rgba(255, 255, 255, 0.5);
291
- }
292
- .Button_module_button-variant--secondary.Button_module_button-appearance--no-outline .Button_module_icon {
293
- color: #ffffff;
294
- }
295
- .Button_module_button-variant--secondary.Button_module_button-appearance--glowing {
296
- background-color: rgba(79, 70, 229, 0.2);
297
- backdrop-filter: 8px;
298
- border: 1px solid #4f46e5;
299
- color: #ffffff;
300
- box-shadow:
301
- 0 0 8px rgba(79, 70, 229, 0.5),
302
- 0 0 16px rgba(79, 70, 229, 0.4),
303
- 0 0 24px rgba(79, 70, 229, 0.3);
304
- }
305
- .Button_module_button-variant--secondary.Button_module_button-appearance--glowing:hover {
306
- background-color: #4f46e5;
307
- }
308
- .Button_module_button-variant--secondary.Button_module_button-appearance--glowing:disabled {
309
- background-color: rgba(79, 70, 229, 0.2);
310
- color: rgba(255, 255, 255, 0.5);
311
- }
312
- .Button_module_button-variant--secondary.Button_module_button-appearance--glowing:disabled .Button_module_icon {
313
- color: rgba(255, 255, 255, 0.5);
314
- }
315
- .Button_module_button-variant--secondary.Button_module_button-appearance--glowing .Button_module_icon {
316
- color: #ffffff;
317
- }
318
- .Button_module_button-variant--success.Button_module_button-appearance--solid {
319
- background-color: #16a34a;
320
- backdrop-filter: 8px;
321
- color: #ffffff;
322
- }
323
- .Button_module_button-variant--success.Button_module_button-appearance--solid:hover {
324
- background-color: #15803d;
325
- }
326
- .Button_module_button-variant--success.Button_module_button-appearance--solid:disabled {
327
- background-color: rgba(22, 163, 74, 0.5);
328
- color: rgba(255, 255, 255, 0.5);
329
- }
330
- .Button_module_button-variant--success.Button_module_button-appearance--solid:disabled .Button_module_icon {
331
- color: rgba(255, 255, 255, 0.5);
332
- }
333
- .Button_module_button-variant--success.Button_module_button-appearance--solid .Button_module_icon {
334
- color: #ffffff;
335
- }
336
- .Button_module_button-variant--success.Button_module_button-appearance--outline {
337
- background-color: rgba(22, 163, 74, 0.2);
338
- backdrop-filter: 8px;
339
- border: 1px solid #16a34a;
340
- color: #ffffff;
341
- }
342
- .Button_module_button-variant--success.Button_module_button-appearance--outline:hover {
343
- background-color: #16a34a;
344
- }
345
- .Button_module_button-variant--success.Button_module_button-appearance--outline:disabled {
346
- background-color: rgba(22, 163, 74, 0.2);
347
- color: rgba(255, 255, 255, 0.5);
348
- }
349
- .Button_module_button-variant--success.Button_module_button-appearance--outline:disabled .Button_module_icon {
350
- color: rgba(255, 255, 255, 0.5);
351
- }
352
- .Button_module_button-variant--success.Button_module_button-appearance--outline .Button_module_icon {
353
- color: #ffffff;
354
- }
355
- .Button_module_button-variant--success.Button_module_button-appearance--outline-dashed {
356
- background-color: rgba(22, 163, 74, 0.2);
357
- backdrop-filter: 8px;
358
- border: 1px dashed #16a34a;
359
- color: #ffffff;
360
- }
361
- .Button_module_button-variant--success.Button_module_button-appearance--outline-dashed:hover {
362
- background-color: #16a34a;
363
- }
364
- .Button_module_button-variant--success.Button_module_button-appearance--outline-dashed:disabled {
365
- background-color: rgba(22, 163, 74, 0.2);
366
- color: rgba(255, 255, 255, 0.5);
367
- }
368
- .Button_module_button-variant--success.Button_module_button-appearance--outline-dashed:disabled .Button_module_icon {
369
- color: rgba(255, 255, 255, 0.5);
370
- }
371
- .Button_module_button-variant--success.Button_module_button-appearance--outline-dashed .Button_module_icon {
372
- color: #ffffff;
373
- }
374
- .Button_module_button-variant--success.Button_module_button-appearance--no-outline {
375
- background-color: rgba(22, 163, 74, 0.2);
376
- backdrop-filter: 8px;
377
- color: #ffffff;
378
- }
379
- .Button_module_button-variant--success.Button_module_button-appearance--no-outline:hover {
380
- background-color: #16a34a;
381
- }
382
- .Button_module_button-variant--success.Button_module_button-appearance--no-outline:disabled {
383
- background-color: rgba(22, 163, 74, 0.2);
384
- color: rgba(255, 255, 255, 0.5);
385
- }
386
- .Button_module_button-variant--success.Button_module_button-appearance--no-outline:disabled .Button_module_icon {
387
- color: rgba(255, 255, 255, 0.5);
388
- }
389
- .Button_module_button-variant--success.Button_module_button-appearance--no-outline .Button_module_icon {
390
- color: #ffffff;
391
- }
392
- .Button_module_button-variant--success.Button_module_button-appearance--glowing {
393
- background-color: rgba(22, 163, 74, 0.2);
394
- backdrop-filter: 8px;
395
- border: 1px solid #16a34a;
396
- color: #ffffff;
397
- box-shadow:
398
- 0 0 8px rgba(22, 163, 74, 0.5),
399
- 0 0 16px rgba(22, 163, 74, 0.4),
400
- 0 0 24px rgba(22, 163, 74, 0.3);
401
- }
402
- .Button_module_button-variant--success.Button_module_button-appearance--glowing:hover {
403
- background-color: #16a34a;
404
- }
405
- .Button_module_button-variant--success.Button_module_button-appearance--glowing:disabled {
406
- background-color: rgba(22, 163, 74, 0.2);
407
- color: rgba(255, 255, 255, 0.5);
408
- }
409
- .Button_module_button-variant--success.Button_module_button-appearance--glowing:disabled .Button_module_icon {
410
- color: rgba(255, 255, 255, 0.5);
411
- }
412
- .Button_module_button-variant--success.Button_module_button-appearance--glowing .Button_module_icon {
413
- color: #ffffff;
414
- }
415
- .Button_module_button-variant--error.Button_module_button-appearance--solid {
416
- background-color: #dc2626;
417
- backdrop-filter: 8px;
418
- color: #ffffff;
419
- }
420
- .Button_module_button-variant--error.Button_module_button-appearance--solid:hover {
421
- background-color: #b91c1c;
422
- }
423
- .Button_module_button-variant--error.Button_module_button-appearance--solid:disabled {
424
- background-color: rgba(220, 38, 38, 0.5);
425
- color: rgba(255, 255, 255, 0.5);
426
- }
427
- .Button_module_button-variant--error.Button_module_button-appearance--solid:disabled .Button_module_icon {
428
- color: rgba(255, 255, 255, 0.5);
429
- }
430
- .Button_module_button-variant--error.Button_module_button-appearance--solid .Button_module_icon {
431
- color: #ffffff;
432
- }
433
- .Button_module_button-variant--error.Button_module_button-appearance--outline {
434
- background-color: rgba(220, 38, 38, 0.2);
435
- backdrop-filter: 8px;
436
- border: 1px solid #dc2626;
437
- color: #ffffff;
438
- }
439
- .Button_module_button-variant--error.Button_module_button-appearance--outline:hover {
440
- background-color: #dc2626;
441
- }
442
- .Button_module_button-variant--error.Button_module_button-appearance--outline:disabled {
443
- background-color: rgba(220, 38, 38, 0.2);
444
- color: rgba(255, 255, 255, 0.5);
445
- }
446
- .Button_module_button-variant--error.Button_module_button-appearance--outline:disabled .Button_module_icon {
447
- color: rgba(255, 255, 255, 0.5);
448
- }
449
- .Button_module_button-variant--error.Button_module_button-appearance--outline .Button_module_icon {
450
- color: #ffffff;
451
- }
452
- .Button_module_button-variant--error.Button_module_button-appearance--outline-dashed {
453
- background-color: rgba(220, 38, 38, 0.2);
454
- backdrop-filter: 8px;
455
- border: 1px dashed #dc2626;
456
- color: #ffffff;
457
- }
458
- .Button_module_button-variant--error.Button_module_button-appearance--outline-dashed:hover {
459
- background-color: #dc2626;
460
- }
461
- .Button_module_button-variant--error.Button_module_button-appearance--outline-dashed:disabled {
462
- background-color: rgba(220, 38, 38, 0.2);
463
- color: rgba(255, 255, 255, 0.5);
464
- }
465
- .Button_module_button-variant--error.Button_module_button-appearance--outline-dashed:disabled .Button_module_icon {
466
- color: rgba(255, 255, 255, 0.5);
467
- }
468
- .Button_module_button-variant--error.Button_module_button-appearance--outline-dashed .Button_module_icon {
469
- color: #ffffff;
470
- }
471
- .Button_module_button-variant--error.Button_module_button-appearance--no-outline {
472
- background-color: rgba(220, 38, 38, 0.2);
473
- backdrop-filter: 8px;
474
- color: #ffffff;
475
- }
476
- .Button_module_button-variant--error.Button_module_button-appearance--no-outline:hover {
477
- background-color: #dc2626;
478
- }
479
- .Button_module_button-variant--error.Button_module_button-appearance--no-outline:disabled {
480
- background-color: rgba(220, 38, 38, 0.2);
481
- color: rgba(255, 255, 255, 0.5);
482
- }
483
- .Button_module_button-variant--error.Button_module_button-appearance--no-outline:disabled .Button_module_icon {
484
- color: rgba(255, 255, 255, 0.5);
485
- }
486
- .Button_module_button-variant--error.Button_module_button-appearance--no-outline .Button_module_icon {
487
- color: #ffffff;
488
- }
489
- .Button_module_button-variant--error.Button_module_button-appearance--glowing {
490
- background-color: rgba(220, 38, 38, 0.2);
491
- backdrop-filter: 8px;
492
- border: 1px solid #dc2626;
493
- color: #ffffff;
494
- box-shadow:
495
- 0 0 8px rgba(220, 38, 38, 0.5),
496
- 0 0 16px rgba(220, 38, 38, 0.4),
497
- 0 0 24px rgba(220, 38, 38, 0.3);
498
- }
499
- .Button_module_button-variant--error.Button_module_button-appearance--glowing:hover {
500
- background-color: #dc2626;
501
- }
502
- .Button_module_button-variant--error.Button_module_button-appearance--glowing:disabled {
503
- background-color: rgba(220, 38, 38, 0.2);
504
- color: rgba(255, 255, 255, 0.5);
505
- }
506
- .Button_module_button-variant--error.Button_module_button-appearance--glowing:disabled .Button_module_icon {
507
- color: rgba(255, 255, 255, 0.5);
508
- }
509
- .Button_module_button-variant--error.Button_module_button-appearance--glowing .Button_module_icon {
510
- color: #ffffff;
511
- }
512
- .Button_module_button-variant--warning.Button_module_button-appearance--solid {
513
- background-color: #d97706;
514
- backdrop-filter: 8px;
515
- color: #ffffff;
516
- }
517
- .Button_module_button-variant--warning.Button_module_button-appearance--solid:hover {
518
- background-color: #b45309;
519
- }
520
- .Button_module_button-variant--warning.Button_module_button-appearance--solid:disabled {
521
- background-color: rgba(217, 119, 6, 0.5);
522
- color: rgba(255, 255, 255, 0.5);
523
- }
524
- .Button_module_button-variant--warning.Button_module_button-appearance--solid:disabled .Button_module_icon {
525
- color: rgba(255, 255, 255, 0.5);
526
- }
527
- .Button_module_button-variant--warning.Button_module_button-appearance--solid .Button_module_icon {
528
- color: #ffffff;
529
- }
530
- .Button_module_button-variant--warning.Button_module_button-appearance--outline {
531
- background-color: rgba(217, 119, 6, 0.2);
532
- backdrop-filter: 8px;
533
- border: 1px solid #d97706;
534
- color: #ffffff;
535
- }
536
- .Button_module_button-variant--warning.Button_module_button-appearance--outline:hover {
537
- background-color: #d97706;
538
- }
539
- .Button_module_button-variant--warning.Button_module_button-appearance--outline:disabled {
540
- background-color: rgba(217, 119, 6, 0.2);
541
- color: rgba(255, 255, 255, 0.5);
542
- }
543
- .Button_module_button-variant--warning.Button_module_button-appearance--outline:disabled .Button_module_icon {
544
- color: rgba(255, 255, 255, 0.5);
545
- }
546
- .Button_module_button-variant--warning.Button_module_button-appearance--outline .Button_module_icon {
547
- color: #ffffff;
548
- }
549
- .Button_module_button-variant--warning.Button_module_button-appearance--outline-dashed {
550
- background-color: rgba(217, 119, 6, 0.2);
551
- backdrop-filter: 8px;
552
- border: 1px dashed #d97706;
553
- color: #ffffff;
554
- }
555
- .Button_module_button-variant--warning.Button_module_button-appearance--outline-dashed:hover {
556
- background-color: #d97706;
557
- }
558
- .Button_module_button-variant--warning.Button_module_button-appearance--outline-dashed:disabled {
559
- background-color: rgba(217, 119, 6, 0.2);
560
- color: rgba(255, 255, 255, 0.5);
561
- }
562
- .Button_module_button-variant--warning.Button_module_button-appearance--outline-dashed:disabled .Button_module_icon {
563
- color: rgba(255, 255, 255, 0.5);
564
- }
565
- .Button_module_button-variant--warning.Button_module_button-appearance--outline-dashed .Button_module_icon {
566
- color: #ffffff;
567
- }
568
- .Button_module_button-variant--warning.Button_module_button-appearance--no-outline {
569
- background-color: rgba(217, 119, 6, 0.2);
570
- backdrop-filter: 8px;
571
- color: #ffffff;
572
- }
573
- .Button_module_button-variant--warning.Button_module_button-appearance--no-outline:hover {
574
- background-color: #d97706;
575
- }
576
- .Button_module_button-variant--warning.Button_module_button-appearance--no-outline:disabled {
577
- background-color: rgba(217, 119, 6, 0.2);
578
- color: rgba(255, 255, 255, 0.5);
579
- }
580
- .Button_module_button-variant--warning.Button_module_button-appearance--no-outline:disabled .Button_module_icon {
581
- color: rgba(255, 255, 255, 0.5);
582
- }
583
- .Button_module_button-variant--warning.Button_module_button-appearance--no-outline .Button_module_icon {
584
- color: #ffffff;
585
- }
586
- .Button_module_button-variant--warning.Button_module_button-appearance--glowing {
587
- background-color: rgba(217, 119, 6, 0.2);
588
- backdrop-filter: 8px;
589
- border: 1px solid #d97706;
590
- color: #ffffff;
591
- box-shadow:
592
- 0 0 8px rgba(217, 119, 6, 0.5),
593
- 0 0 16px rgba(217, 119, 6, 0.4),
594
- 0 0 24px rgba(217, 119, 6, 0.3);
595
- }
596
- .Button_module_button-variant--warning.Button_module_button-appearance--glowing:hover {
597
- background-color: #d97706;
598
- }
599
- .Button_module_button-variant--warning.Button_module_button-appearance--glowing:disabled {
600
- background-color: rgba(217, 119, 6, 0.2);
601
- color: rgba(255, 255, 255, 0.5);
602
- }
603
- .Button_module_button-variant--warning.Button_module_button-appearance--glowing:disabled .Button_module_icon {
604
- color: rgba(255, 255, 255, 0.5);
605
- }
606
- .Button_module_button-variant--warning.Button_module_button-appearance--glowing .Button_module_icon {
607
- color: #ffffff;
608
- }
609
- .Button_module_button-size--xsm {
610
- font-size: 0.75rem;
611
- line-height: 1rem;
612
- padding: 0.25rem 0.5rem;
613
- min-height: 28px;
614
- }
615
- .Button_module_button-size--xsm .Button_module_spinner,
616
- .Button_module_button-size--xsm .Button_module_icon {
617
- max-height: 1rem;
618
- max-width: 1rem;
619
- }
620
- .Button_module_button-size--sm {
621
- font-size: 0.875rem;
622
- line-height: 1.25rem;
623
- padding: 0.375rem 0.75rem;
624
- min-height: 32px;
625
- }
626
- .Button_module_button-size--sm .Button_module_spinner,
627
- .Button_module_button-size--sm .Button_module_icon {
628
- max-height: 1.125rem;
629
- max-width: 1.125rem;
630
- }
631
- .Button_module_button-size--md {
632
- font-size: 1rem;
633
- line-height: 1.5rem;
634
- padding: 0.5rem 1rem;
635
- min-height: 40px;
636
- }
637
- .Button_module_button-size--md .Button_module_spinner,
638
- .Button_module_button-size--md .Button_module_icon {
639
- height: 1.25rem;
640
- width: 1.25rem;
641
- }
642
- .Button_module_button-size--lg {
643
- font-size: 1.125rem;
644
- line-height: 1.75rem;
645
- padding: 0.625rem 1.25rem;
646
- min-height: 44px;
647
- }
648
- .Button_module_button-size--lg .Button_module_spinner,
649
- .Button_module_button-size--lg .Button_module_icon {
650
- max-height: 1.375rem;
651
- max-width: 1.375rem;
652
- }
653
- .Button_module_button-size--xlg {
654
- font-size: 1.25rem;
655
- line-height: 1.75rem;
656
- padding: 0.75rem 1.5rem;
657
- min-height: 48px;
658
- }
659
- .Button_module_button-size--xlg .Button_module_spinner,
660
- .Button_module_button-size--xlg .Button_module_icon {
661
- max-height: 1.5rem;
662
- max-width: 1.5rem;
663
- }
664
- .Button_module_button-radius--none {
665
- border-radius: 0rem;
666
- }
667
- .Button_module_button-radius--sm {
668
- border-radius: 0.125rem;
669
- }
670
- .Button_module_button-radius--md {
671
- border-radius: 0.375rem;
672
- }
673
- .Button_module_button-radius--lg {
674
- border-radius: 0.5rem;
675
- }
676
- .Button_module_button-radius--full {
677
- border-radius: 1.5rem;
678
- }
679
- .Button_module_button .Button_module_icon {
680
- align-items: center;
681
- display: flex;
682
- justify-content: center;
683
- }
684
- .Button_module_button .Button_module_icon--right {
685
- order: 5;
686
- }
687
- .Button_module_button .Button_module_icon svg {
688
- width: 100%;
689
- }
690
-
691
1
  /* components/ButtonGroup/ButtonGroup.module.scss */
692
2
  .ButtonGroup_module_button-group {
693
3
  align-items: center;