plataforma-fundacao-componentes 2.23.34 → 2.24.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.
@@ -1,11 +1,13 @@
1
1
  import React from 'react';
2
2
  import './Chip.scss';
3
+ declare type ChipTheme = 'primary' | 'primary-outline' | 'danger';
3
4
  export interface ChipProps {
4
5
  label?: string;
5
6
  w100?: boolean;
6
7
  allClickable?: boolean;
7
8
  onClick: () => void;
8
9
  disabled?: boolean;
10
+ theme?: ChipTheme;
9
11
  }
10
12
  declare function Chip(props: ChipProps): JSX.Element;
11
13
  declare const _default: React.MemoExoticComponent<typeof Chip>;
@@ -2,6 +2,12 @@
2
2
  import { ChipProps } from './Chip';
3
3
  declare const _default: {
4
4
  title: string;
5
+ argTypes: {
6
+ theme: {
7
+ options: string[];
8
+ type: string;
9
+ };
10
+ };
5
11
  };
6
12
  export default _default;
7
13
  export declare const FirstExample: {
@@ -2,7 +2,7 @@ declare function SearchBlocoDeNotas(props: any): JSX.Element;
2
2
  declare namespace SearchBlocoDeNotas {
3
3
  export namespace propTypes {
4
4
  export const placeholder: PropTypes.Requireable<string>;
5
- export const value: PropTypes.Requireable<React.ReactText>;
5
+ export const value: PropTypes.Requireable<React.Key>;
6
6
  export const onChange: PropTypes.Requireable<(...args: any[]) => any>;
7
7
  export const rightObject: PropTypes.Requireable<object>;
8
8
  }
@@ -3,7 +3,7 @@ declare namespace TextEditorHeaderInput {
3
3
  export namespace propTypes {
4
4
  export const onChange: PropTypes.Requireable<(...args: any[]) => any>;
5
5
  export const label: PropTypes.Requireable<string>;
6
- export const value: PropTypes.Requireable<React.ReactText>;
6
+ export const value: PropTypes.Requireable<React.Key>;
7
7
  export const onEnter: PropTypes.Requireable<(...args: any[]) => any>;
8
8
  }
9
9
  export namespace defaultProps {
package/dist/index.css CHANGED
@@ -41,7 +41,6 @@ body.sb-show-main.sb-main-padded {
41
41
  font-family: "Exo 2", sans-serif; }
42
42
 
43
43
  .document-grabbing {
44
- cursor: -webkit-grabbing !important;
45
44
  cursor: grabbing !important; }
46
45
 
47
46
  h1 {
@@ -185,14 +184,7 @@ h5 {
185
184
  transition: stroke-dashoffset 0.3s ease, stroke-dasharray 0.3s ease; }
186
185
 
187
186
  .percent-loader-icon.indefinido {
188
- -webkit-animation: spinNoventa 0.6s linear infinite;
189
- animation: spinNoventa 0.6s linear infinite; }
190
-
191
- @-webkit-keyframes spinNoventa {
192
- 0% {
193
- transform: rotateZ(-90deg); }
194
- 100% {
195
- transform: rotateZ(270deg); } }
187
+ animation: spinNoventa 0.6s linear infinite; }
196
188
 
197
189
  @keyframes spinNoventa {
198
190
  0% {
@@ -211,14 +203,7 @@ h5 {
211
203
  -moz-user-select: none;
212
204
  user-select: none; }
213
205
  .refresh-icon.animate {
214
- -webkit-animation: spin 0.4s linear infinite;
215
- animation: spin 0.4s linear infinite; }
216
-
217
- @-webkit-keyframes spin {
218
- 0% {
219
- transform: rotateZ(0); }
220
- 100% {
221
- transform: rotateZ(180deg); } }
206
+ animation: spin 0.4s linear infinite; }
222
207
 
223
208
  @keyframes spin {
224
209
  0% {
@@ -327,21 +312,13 @@ h5 {
327
312
  height: var(--tdBallSize);
328
313
  border-radius: 50%;
329
314
  margin: var(--marginSize);
330
- -webkit-animation: loader 0.6s infinite alternate;
331
315
  animation: loader 0.6s infinite alternate;
332
316
  transform: translate(0, var(--tdTransformYFrom)); }
333
317
  .loader-three-dots > div:nth-child(2) {
334
- -webkit-animation-delay: 0.2s;
335
318
  animation-delay: 0.2s; }
336
319
  .loader-three-dots > div:nth-child(3) {
337
- -webkit-animation-delay: 0.4s;
338
320
  animation-delay: 0.4s; }
339
321
 
340
- @-webkit-keyframes loader {
341
- to {
342
- opacity: 0.4;
343
- transform: translate(0, var(--tdTransformYTo)); } }
344
-
345
322
  @keyframes loader {
346
323
  to {
347
324
  opacity: 0.4;
@@ -351,50 +328,25 @@ h5 {
351
328
  width: 100px;
352
329
  height: 100px; }
353
330
  .catavento-verde-icon-ui-component #um {
354
- -webkit-animation: piscar 700ms infinite;
355
- animation: piscar 700ms infinite; }
331
+ animation: piscar 700ms infinite; }
356
332
  .catavento-verde-icon-ui-component #dois {
357
- -webkit-animation: piscar 700ms infinite;
358
- animation: piscar 700ms infinite;
359
- -webkit-animation-delay: 100ms;
360
- animation-delay: 100ms; }
333
+ animation: piscar 700ms infinite;
334
+ animation-delay: 100ms; }
361
335
  .catavento-verde-icon-ui-component #tres {
362
- -webkit-animation: piscar 700ms infinite;
363
- animation: piscar 700ms infinite;
364
- -webkit-animation-delay: 200ms;
365
- animation-delay: 200ms; }
336
+ animation: piscar 700ms infinite;
337
+ animation-delay: 200ms; }
366
338
  .catavento-verde-icon-ui-component #quatro {
367
- -webkit-animation: piscar 700ms infinite;
368
- animation: piscar 700ms infinite;
369
- -webkit-animation-delay: 300ms;
370
- animation-delay: 300ms; }
339
+ animation: piscar 700ms infinite;
340
+ animation-delay: 300ms; }
371
341
  .catavento-verde-icon-ui-component #cinco {
372
- -webkit-animation: piscar 700ms infinite;
373
- animation: piscar 700ms infinite;
374
- -webkit-animation-delay: 400ms;
375
- animation-delay: 400ms; }
342
+ animation: piscar 700ms infinite;
343
+ animation-delay: 400ms; }
376
344
  .catavento-verde-icon-ui-component #seis {
377
- -webkit-animation: piscar 700ms infinite;
378
- animation: piscar 700ms infinite;
379
- -webkit-animation-delay: 500ms;
380
- animation-delay: 500ms; }
345
+ animation: piscar 700ms infinite;
346
+ animation-delay: 500ms; }
381
347
  .catavento-verde-icon-ui-component #sete {
382
- -webkit-animation: piscar 700ms infinite;
383
- animation: piscar 700ms infinite;
384
- -webkit-animation-delay: 600ms;
385
- animation-delay: 600ms; }
386
-
387
- @-webkit-keyframes piscar {
388
- 0% {
389
- opacity: 1; }
390
- 25% {
391
- opacity: 0.8; }
392
- 50% {
393
- opacity: 0.2; }
394
- 75% {
395
- opacity: 0.8; }
396
- 100% {
397
- opacity: 1; } }
348
+ animation: piscar 700ms infinite;
349
+ animation-delay: 600ms; }
398
350
 
399
351
  @keyframes piscar {
400
352
  0% {
@@ -447,41 +399,24 @@ h5 {
447
399
  user-select: none; }
448
400
  .loader-icon circle {
449
401
  fill: #33820d;
450
- -webkit-animation: loaderAnimation 1000ms linear infinite;
451
402
  animation: loaderAnimation 1000ms linear infinite; }
452
403
  .loader-icon #Elipse_0 {
453
- -webkit-animation-delay: -875ms;
454
404
  animation-delay: -875ms; }
455
405
  .loader-icon #Elipse_1 {
456
- -webkit-animation-delay: -750ms;
457
406
  animation-delay: -750ms; }
458
407
  .loader-icon #Elipse_2 {
459
- -webkit-animation-delay: -625ms;
460
408
  animation-delay: -625ms; }
461
409
  .loader-icon #Elipse_3 {
462
- -webkit-animation-delay: -500ms;
463
410
  animation-delay: -500ms; }
464
411
  .loader-icon #Elipse_4 {
465
- -webkit-animation-delay: -375ms;
466
412
  animation-delay: -375ms; }
467
413
  .loader-icon #Elipse_5 {
468
- -webkit-animation-delay: -250ms;
469
414
  animation-delay: -250ms; }
470
415
  .loader-icon #Elipse_6 {
471
- -webkit-animation-delay: -125ms;
472
416
  animation-delay: -125ms; }
473
417
  .loader-icon #Elipse_7 {
474
- -webkit-animation-delay: 0ms;
475
418
  animation-delay: 0ms; }
476
419
 
477
- @-webkit-keyframes loaderAnimation {
478
- 0% {
479
- opacity: 1; }
480
- 50% {
481
- opacity: 0.05; }
482
- 100% {
483
- opacity: 0.05; } }
484
-
485
420
  @keyframes loaderAnimation {
486
421
  0% {
487
422
  opacity: 1; }
@@ -2273,28 +2208,7 @@ h5 {
2273
2208
  position: absolute;
2274
2209
  bottom: -2px;
2275
2210
  background-color: #33820d;
2276
- -webkit-animation: inputLoading 2.5s linear infinite;
2277
- animation: inputLoading 2.5s linear infinite; }
2278
-
2279
- @-webkit-keyframes inputLoading {
2280
- 0% {
2281
- width: 0;
2282
- left: 0; }
2283
- 50% {
2284
- width: 100%;
2285
- left: 0; }
2286
- 51% {
2287
- left: unset;
2288
- right: 0;
2289
- width: 100%; }
2290
- 99% {
2291
- left: unset;
2292
- right: 0;
2293
- width: 0; }
2294
- 100% {
2295
- right: unset;
2296
- left: 0;
2297
- width: 0; } }
2211
+ animation: inputLoading 2.5s linear infinite; }
2298
2212
 
2299
2213
  @keyframes inputLoading {
2300
2214
  0% {
@@ -2342,8 +2256,7 @@ h5 {
2342
2256
  position: absolute;
2343
2257
  bottom: -2px;
2344
2258
  background-color: #33820d;
2345
- -webkit-animation: inputFocus 0.3s ease forwards;
2346
- animation: inputFocus 0.3s ease forwards; }
2259
+ animation: inputFocus 0.3s ease forwards; }
2347
2260
 
2348
2261
  .component-input:not(.component-input-error):not(.force-focus):not(.component-input-disabled):not(.component-input-loading) .component-input-input-container:not(:focus-within):not(.force-focus)::before {
2349
2262
  opacity: 0;
@@ -2353,8 +2266,7 @@ h5 {
2353
2266
  position: absolute;
2354
2267
  bottom: -2px;
2355
2268
  background-color: #33820d;
2356
- -webkit-animation: inputFocusReverse 0.3s ease forwards;
2357
- animation: inputFocusReverse 0.3s ease forwards; }
2269
+ animation: inputFocusReverse 0.3s ease forwards; }
2358
2270
 
2359
2271
  .component-input:not(.component-input-error).force-focus .component-input-input-container::before {
2360
2272
  opacity: 1;
@@ -2365,16 +2277,7 @@ h5 {
2365
2277
  position: absolute;
2366
2278
  bottom: -2px;
2367
2279
  background-color: #33820d;
2368
- -webkit-animation: inputFocus 0.3s ease forwards;
2369
- animation: inputFocus 0.3s ease forwards; }
2370
-
2371
- @-webkit-keyframes inputFocus {
2372
- 0% {
2373
- width: 0;
2374
- left: 50%; }
2375
- 100% {
2376
- left: 0;
2377
- width: 100%; } }
2280
+ animation: inputFocus 0.3s ease forwards; }
2378
2281
 
2379
2282
  @keyframes inputFocus {
2380
2283
  0% {
@@ -2384,14 +2287,6 @@ h5 {
2384
2287
  left: 0;
2385
2288
  width: 100%; } }
2386
2289
 
2387
- @-webkit-keyframes inputFocusReverse {
2388
- 0% {
2389
- left: 0;
2390
- width: 100%; }
2391
- 100% {
2392
- width: 0;
2393
- left: 50%; } }
2394
-
2395
2290
  @keyframes inputFocusReverse {
2396
2291
  0% {
2397
2292
  left: 0;
@@ -4316,7 +4211,7 @@ max-width 100% 540px 720px 960px 1140px
4316
4211
  width: 100%; }
4317
4212
  .component-date-picker-calendar .component-date-picker-calendar-month-picker .component-date-picker-calendar-months .component-date-picker-calendar-month {
4318
4213
  margin: 2px;
4319
- width: 80.5px;
4214
+ width: calc(46px * 7 / 4);
4320
4215
  height: 40px;
4321
4216
  background-color: #fefefe;
4322
4217
  border: none;
@@ -4752,7 +4647,6 @@ max-width 100% 540px 720px 960px 1140px
4752
4647
 
4753
4648
  .dropdown-selector-wrapper {
4754
4649
  position: relative;
4755
- width: -webkit-fit-content;
4756
4650
  width: -moz-fit-content;
4757
4651
  width: fit-content; }
4758
4652
  .dropdown-selector-wrapper.w-100 {
@@ -5164,7 +5058,6 @@ max-width 100% 540px 720px 960px 1140px
5164
5058
  height: 14px;
5165
5059
  width: 14px; }
5166
5060
  .component-etiqueta.fit-content {
5167
- width: -webkit-fit-content;
5168
5061
  width: -moz-fit-content;
5169
5062
  width: fit-content;
5170
5063
  padding: 8px 12px; }
@@ -5885,8 +5778,7 @@ header.component-header {
5885
5778
  transform: rotate(45deg);
5886
5779
  width: 40px;
5887
5780
  height: 40px;
5888
- -webkit-animation: borderRotate 8s linear infinite;
5889
- animation: borderRotate 8s linear infinite; }
5781
+ animation: borderRotate 8s linear infinite; }
5890
5782
  .component-header-search-field-inline-input.loading .component-header-search-field-loading-border::after {
5891
5783
  content: '';
5892
5784
  position: absolute;
@@ -5899,8 +5791,7 @@ header.component-header {
5899
5791
  border-radius: 6px; } }
5900
5792
  @media screen and (min-width: 575.98px) {
5901
5793
  .component-header-search-field-inline-input.loading .component-header-search-field-loading-border {
5902
- -webkit-animation: inputHeaderLoading 2.5s linear infinite;
5903
- animation: inputHeaderLoading 2.5s linear infinite; } }
5794
+ animation: inputHeaderLoading 2.5s linear infinite; } }
5904
5795
  @media screen and (min-width: 575.98px) {
5905
5796
  .component-header-search-field-inline-input .component-header-search-field-loading-border,
5906
5797
  .component-header-search-field-inline-input .component-header-search-field-focus-border {
@@ -5987,26 +5878,6 @@ header.component-header {
5987
5878
  transition: opacity 0.3s ease;
5988
5879
  opacity: 0; }
5989
5880
 
5990
- @-webkit-keyframes inputHeaderLoading {
5991
- 0% {
5992
- width: 0;
5993
- left: 0; }
5994
- 50% {
5995
- width: 100%;
5996
- left: 0; }
5997
- 51% {
5998
- left: unset;
5999
- right: 0;
6000
- width: 100%; }
6001
- 99% {
6002
- left: unset;
6003
- right: 0;
6004
- width: 0; }
6005
- 100% {
6006
- right: unset;
6007
- left: 0;
6008
- width: 0; } }
6009
-
6010
5881
  @keyframes inputHeaderLoading {
6011
5882
  0% {
6012
5883
  width: 0;
@@ -6027,23 +5898,6 @@ header.component-header {
6027
5898
  left: 0;
6028
5899
  width: 0; } }
6029
5900
 
6030
- @-webkit-keyframes borderRotate {
6031
- 0% {
6032
- top: -20px;
6033
- left: -20px; }
6034
- 40% {
6035
- top: -20px;
6036
- left: calc(100% - 20px); }
6037
- 50% {
6038
- top: calc(100% - 20px);
6039
- left: calc(100% - 20px); }
6040
- 90% {
6041
- top: calc(100% - 20px);
6042
- left: -20px; }
6043
- 100% {
6044
- left: -20px;
6045
- top: -20px; } }
6046
-
6047
5901
  @keyframes borderRotate {
6048
5902
  0% {
6049
5903
  top: -20px;
@@ -6462,28 +6316,7 @@ header.component-header {
6462
6316
  position: absolute;
6463
6317
  bottom: -2px;
6464
6318
  background-color: #33820d;
6465
- -webkit-animation: inputLoading 2.5s linear infinite;
6466
- animation: inputLoading 2.5s linear infinite; }
6467
-
6468
- @-webkit-keyframes inputLoading {
6469
- 0% {
6470
- width: 0;
6471
- left: 0; }
6472
- 50% {
6473
- width: 100%;
6474
- left: 0; }
6475
- 51% {
6476
- left: unset;
6477
- right: 0;
6478
- width: 100%; }
6479
- 99% {
6480
- left: unset;
6481
- right: 0;
6482
- width: 0; }
6483
- 100% {
6484
- right: unset;
6485
- left: 0;
6486
- width: 0; } }
6319
+ animation: inputLoading 2.5s linear infinite; }
6487
6320
 
6488
6321
  @keyframes inputLoading {
6489
6322
  0% {
@@ -6531,8 +6364,7 @@ header.component-header {
6531
6364
  position: absolute;
6532
6365
  bottom: -2px;
6533
6366
  background-color: #33820d;
6534
- -webkit-animation: inputFocus 0.3s ease forwards;
6535
- animation: inputFocus 0.3s ease forwards; }
6367
+ animation: inputFocus 0.3s ease forwards; }
6536
6368
 
6537
6369
  .component-input-area:not(.component-input-area-error):not(.force-focus):not(.component-input-area-disabled):not(.component-input-area-loading) .component-input-area-input-container:not(:focus-within):not(.force-focus)::before {
6538
6370
  opacity: 0;
@@ -6542,8 +6374,7 @@ header.component-header {
6542
6374
  position: absolute;
6543
6375
  bottom: -2px;
6544
6376
  background-color: #33820d;
6545
- -webkit-animation: inputFocusReverse 0.3s ease forwards;
6546
- animation: inputFocusReverse 0.3s ease forwards; }
6377
+ animation: inputFocusReverse 0.3s ease forwards; }
6547
6378
 
6548
6379
  .component-input-area:not(.component-input-area-error).force-focus .component-input-area-input-container::before {
6549
6380
  opacity: 1;
@@ -6554,16 +6385,7 @@ header.component-header {
6554
6385
  position: absolute;
6555
6386
  bottom: -2px;
6556
6387
  background-color: #33820d;
6557
- -webkit-animation: inputFocus 0.3s ease forwards;
6558
- animation: inputFocus 0.3s ease forwards; }
6559
-
6560
- @-webkit-keyframes inputFocus {
6561
- 0% {
6562
- width: 0;
6563
- left: 50%; }
6564
- 100% {
6565
- left: 0;
6566
- width: 100%; } }
6388
+ animation: inputFocus 0.3s ease forwards; }
6567
6389
 
6568
6390
  @keyframes inputFocus {
6569
6391
  0% {
@@ -6573,14 +6395,6 @@ header.component-header {
6573
6395
  left: 0;
6574
6396
  width: 100%; } }
6575
6397
 
6576
- @-webkit-keyframes inputFocusReverse {
6577
- 0% {
6578
- left: 0;
6579
- width: 100%; }
6580
- 100% {
6581
- width: 0;
6582
- left: 50%; } }
6583
-
6584
6398
  @keyframes inputFocusReverse {
6585
6399
  0% {
6586
6400
  left: 0;
@@ -7671,8 +7485,7 @@ header.component-header {
7671
7485
  position: absolute;
7672
7486
  bottom: -2px;
7673
7487
  background-color: #33820d;
7674
- -webkit-animation: inputFocus 0.3s ease forwards;
7675
- animation: inputFocus 0.3s ease forwards; }
7488
+ animation: inputFocus 0.3s ease forwards; }
7676
7489
 
7677
7490
  .component-select-select-fake {
7678
7491
  width: 100%;
@@ -8065,14 +7878,11 @@ table.component-table {
8065
7878
  background-color: #f6f6f6 !important; }
8066
7879
 
8067
7880
  .component-table-item-dragging {
8068
- cursor: -webkit-grabbing;
8069
7881
  cursor: grabbing; }
8070
7882
 
8071
7883
  .grab-handle {
8072
- cursor: -webkit-grab;
8073
7884
  cursor: grab; }
8074
7885
  .grab-handle:active {
8075
- cursor: -webkit-grabbing;
8076
7886
  cursor: grabbing; }
8077
7887
 
8078
7888
  .component-table-upper-header {
@@ -8451,11 +8261,9 @@ tr:first-child th:last-child {
8451
8261
  -webkit-user-select: none;
8452
8262
  -moz-user-select: none;
8453
8263
  user-select: none;
8454
- cursor: -webkit-grab;
8455
8264
  cursor: grab; }
8456
8265
  .component-table-with-overflow .component-table-with-overflow-wrapper table:active th[data-draggable='true'],
8457
8266
  .component-table-with-overflow .component-table-with-overflow-wrapper table:active td[data-draggable='true'] {
8458
- cursor: -webkit-grabbing !important;
8459
8267
  cursor: grabbing !important; }
8460
8268
  .component-table-with-overflow .component-table-with-overflow-wrapper .absolute {
8461
8269
  position: absolute; }
@@ -8463,7 +8271,6 @@ tr:first-child th:last-child {
8463
8271
  left: 0;
8464
8272
  width: 8px;
8465
8273
  min-height: 44px;
8466
- height: -webkit-fit-content;
8467
8274
  height: -moz-fit-content;
8468
8275
  height: fit-content; }
8469
8276
  .component-table-with-overflow .component-table-with-overflow-wrapper .right-0 {
@@ -9138,11 +8945,9 @@ nav.component-tabs {
9138
8945
  padding: 24px;
9139
8946
  border-radius: 4px; }
9140
8947
  .component-toast:hover .component-toast-fill {
9141
- -webkit-animation-play-state: paused !important;
9142
- animation-play-state: paused !important; }
8948
+ animation-play-state: paused !important; }
9143
8949
  .component-toast:not(:hover) .component-toast-fill {
9144
- -webkit-animation-play-state: running;
9145
- animation-play-state: running; }
8950
+ animation-play-state: running; }
9146
8951
  .component-toast .component-toast-left-content {
9147
8952
  font-family: "Nunito", sans-serif;
9148
8953
  font-size: 14px;
@@ -9208,12 +9013,6 @@ nav.component-tabs {
9208
9013
  .component-toast-error .component-toast-close-button svg {
9209
9014
  color: #fefefe; }
9210
9015
 
9211
- @-webkit-keyframes fillToZero {
9212
- 0% {
9213
- width: 100%; }
9214
- 100% {
9215
- width: 0; } }
9216
-
9217
9016
  @keyframes fillToZero {
9218
9017
  0% {
9219
9018
  width: 100%; }
@@ -9263,7 +9062,6 @@ nav.component-tabs {
9263
9062
  flex-direction: column-reverse !important; }
9264
9063
  .comp-toast-manager-toasts .comp-toast-manager-toastzin {
9265
9064
  transition: all 0.3s ease;
9266
- width: -webkit-fit-content;
9267
9065
  width: -moz-fit-content;
9268
9066
  width: fit-content;
9269
9067
  overflow: hidden;
@@ -9707,7 +9505,7 @@ nav.component-tabs {
9707
9505
  -moz-user-select: none;
9708
9506
  user-select: none; }
9709
9507
  .calendar-header .calendar-header-day {
9710
- flex: 0 0 14.28571%;
9508
+ flex: 0 0 calc(100% / 7);
9711
9509
  display: flex;
9712
9510
  align-items: center;
9713
9511
  justify-content: center;
@@ -9931,7 +9729,7 @@ nav.component-tabs {
9931
9729
  .calendar-month-day {
9932
9730
  position: relative;
9933
9731
  transition: background-color 0.3s ease, color 0.3s ease;
9934
- flex: 0 0 14.28571%;
9732
+ flex: 0 0 calc(100% / 7);
9935
9733
  max-width: calc(100% / 7);
9936
9734
  background-color: #fefefe;
9937
9735
  -webkit-user-select: none;
@@ -10354,10 +10152,10 @@ nav.component-tabs {
10354
10152
  align-items: center;
10355
10153
  justify-content: space-between;
10356
10154
  border-radius: 200px;
10357
- border: 1px solid #3fa110;
10358
- color: #3fa110;
10359
- background-color: rgba(0, 0, 0, 0);
10360
- font-weight: 600; }
10155
+ border-width: 1px;
10156
+ border-style: solid;
10157
+ font-weight: 600;
10158
+ transition: all 0.3s ease; }
10361
10159
  .component-chip span {
10362
10160
  max-width: calc(100% - 24px);
10363
10161
  padding-left: 4px;
@@ -10381,3 +10179,15 @@ nav.component-tabs {
10381
10179
  .component-chip .component-chip-button svg {
10382
10180
  width: 20px;
10383
10181
  height: 20px; }
10182
+ .component-chip.primary-outline {
10183
+ color: #3fa110;
10184
+ background-color: rgba(0, 0, 0, 0);
10185
+ border: 1px solid #3fa110; }
10186
+ .component-chip.primary {
10187
+ color: #fefefe;
10188
+ background-color: #3fa110;
10189
+ border: 1px solid #3fa110; }
10190
+ .component-chip.danger {
10191
+ color: #fefefe;
10192
+ background-color: #e60000;
10193
+ border: 1px solid #e60000; }