colibri-ui 0.7.62 → 0.7.63

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 (27) hide show
  1. package/Button/Button.module.css +35 -7
  2. package/Button/index.js +2 -3
  3. package/Theme/colors/index.d.ts +2 -0
  4. package/Theme/colors/theme_buenos_aires.d.ts +4 -0
  5. package/Theme/colors/theme_buenos_aires.js +20 -18
  6. package/Theme/index.d.ts +82 -0
  7. package/Theme/themes/buenos_aires.d.ts +76 -0
  8. package/Theme/themes/buenos_aires.js +77 -1
  9. package/Theme/themes/default.d.ts +6 -0
  10. package/Theme/themes/default.js +22 -16
  11. package/base/InputRoot/InputRoot.module.css +5 -5
  12. package/esm/Button/Button.module.css +35 -7
  13. package/esm/Button/index.js +2 -3
  14. package/esm/Theme/colors/index.d.ts +2 -0
  15. package/esm/Theme/colors/theme_buenos_aires.d.ts +4 -0
  16. package/esm/Theme/colors/theme_buenos_aires.js +20 -18
  17. package/esm/Theme/index.d.ts +82 -0
  18. package/esm/Theme/themes/buenos_aires.d.ts +76 -0
  19. package/esm/Theme/themes/buenos_aires.js +77 -1
  20. package/esm/Theme/themes/default.d.ts +6 -0
  21. package/esm/Theme/themes/default.js +22 -16
  22. package/esm/base/InputRoot/InputRoot.module.css +5 -5
  23. package/esm/theme_ba_variables.css +89 -13
  24. package/esm/theme_default_variables.css +22 -16
  25. package/package.json +1 -1
  26. package/theme_ba_variables.css +89 -13
  27. package/theme_default_variables.css +22 -16
package/theme_ba_variables.css CHANGED
@@ -6,18 +6,94 @@
6
6
  --palette-bg-3: #dbdbdb;
7
7
  --palette-bg-4: #b3b3b3;
8
8
  --palette-bg-5: #999;
9
- --palette-brand-default-1: #B54141;
10
- --palette-brand-default-2: #fffbe9;
11
- --palette-brand-default-3: #D5D500;
12
- --palette-primary-1: rgba(38, 49, 129, .07);
13
- --palette-primary-2: rgba(38, 49, 129, .3);
14
- --palette-primary-3: rgba(38, 49, 129, .4);
15
- --palette-primary-4: rgba(38, 49, 129, .6);
16
- --palette-primary-5: rgba(38, 49, 129, .8);
17
- --palette-tretiary-1: #EDF1F5;
18
- --palette-tretiary-2: #d3dbe3;
19
- --palette-tretiary-3: #c5cfda;
20
- --palette-tretiary-4: #b1bcc8;
21
- --palette-tretiary-5: #87929d;
9
+ --palette-brand-default-1: #fcdfe2;
10
+ --palette-brand-default-2: #facdd2;
11
+ --palette-brand-default-3: #F59fa7;
12
+ --palette-primary-1: #ffe695;
13
+ --palette-primary-2: #ffe07b;
14
+ --palette-primary-3: #ffd85a;
15
+ --palette-primary-4: #ffce31;
16
+ --palette-primary-5: #ffc818;
17
+ --palette-tretiary-1: #DFE7FA;
18
+ --palette-tretiary-2: #C0CFF8;
19
+ --palette-tretiary-3: #AFC3F5;
20
+ --palette-tretiary-4: #80A0ED;
21
+ --palette-tretiary-5: #6088ea;
22
22
  --palette-alert: #ff564e;
23
+ --button-border-radius: 18px;
24
+ --button-primary-color: #000;
25
+ --button-primary-background-color: #ffce31;
26
+ --button-primary-border-color: #ffce31;
27
+ --button-primary-color-hovered: #000;
28
+ --button-primary-background-color-hovered: #ffce31;
29
+ --button-primary-border-color-hovered: #ffce31;
30
+ --button-primary-color-active: #000;
31
+ --button-primary-background-color-active: #ffc818;
32
+ --button-primary-border-color-active: #ffc818;
33
+ --button-primary-color-disabled: #b3b3b3;
34
+ --button-primary-background-color-disabled: #ffe695;
35
+ --button-primary-border-color-disabled: #ffe695;
36
+ --button-secondary-color: #fff;
37
+ --button-secondary-background-color: #1f1f1f;
38
+ --button-secondary-border-color: #1f1f1f;
39
+ --button-secondary-color-hovered: #fff;
40
+ --button-secondary-background-color-hovered: #1f1f1f;
41
+ --button-secondary-border-color-hovered: #1f1f1f;
42
+ --button-secondary-color-active: #fff;
43
+ --button-secondary-background-color-active: #000;
44
+ --button-secondary-border-color-active: #000;
45
+ --button-secondary-color-disabled: #b3b3b3;
46
+ --button-secondary-background-color-disabled: #f2f2f2;
47
+ --button-secondary-border-color-disabled: #f2f2f2;
48
+ --button-outline-color: #000;
49
+ --button-outline-background-color: #fff;
50
+ --button-outline-border-color: #1f1f1f;
51
+ --button-outline-color-hovered: #000;
52
+ --button-outline-background-color-hovered: #f2f2f2;
53
+ --button-outline-border-color-hovered: #1f1f1f;
54
+ --button-outline-color-active: #000;
55
+ --button-outline-background-color-active: #e6e6e6;
56
+ --button-outline-border-color-active: #1f1f1f;
57
+ --button-outline-color-disabled: #b3b3b3;
58
+ --button-outline-background-color-disabled: #fff;
59
+ --button-outline-border-color-disabled: #e6e6e6;
60
+ --button-pseudo-color: #000;
61
+ --button-pseudo-background-color: #DFE7FA;
62
+ --button-pseudo-border-color: #DFE7FA;
63
+ --button-pseudo-color-hovered: #000;
64
+ --button-pseudo-background-color-hovered: #DFE7FA;
65
+ --button-pseudo-border-color-hovered: #DFE7FA;
66
+ --button-pseudo-color-active: #000;
67
+ --button-pseudo-background-color-active: #C0CFF8;
68
+ --button-pseudo-border-color-active: #C0CFF8;
69
+ --button-pseudo-color-disabled: #b3b3b3;
70
+ --button-pseudo-background-color-disabled: #DFE7FA;
71
+ --button-pseudo-border-color-disabled: #DFE7FA;
72
+ --button-clear-color: #1f1f1f;
73
+ --button-clear-color-hovered: #1f1f1f;
74
+ --button-clear-color-active: #000;
75
+ --button-clear-color-disabled: #b3b3b3;
76
+ --button-clear-background-color-disabled: #fff;
77
+ --button-clear-border-color-disabled: #fff;
78
+ --input-primary-border-color: #dbdbdb;
79
+ --input-primary-plaseholder-color: #e6e6e6;
80
+ --input-primary-border-color-error: #ff564e;
81
+ --input-primary-background-color-error: #FFEAE2;
82
+ --input-primary-box-shadow-color-error: #FFEAE2;
83
+ --checkbox-primary-background-color-checked: #ffce31;
84
+ --checkbox-primary-background-color-hovered: #ffce31;
85
+ --checkbox-primary-box-shadow-focused: #ffe695;
86
+ --checkbox-primary-background-color-active: #ffce31;
87
+ --checkbox-primary-border-color-active: #ffce31;
88
+ --checkbox-primary-box-shadow-active: #ffce31;
89
+ --checkbox-primary-background-color-disabled: #ffe695;
90
+ --inputradio-primary-background-color-checked: #ffce31;
91
+ --inputradio-primary-background-color-hovered: #ffce31;
92
+ --inputradio-primary-box-shadow-focused: #ffe695;
93
+ --inputradio-primary-background-color-focused: #ffe695;
94
+ --inputradio-primary-border-color-focused: #ffe695;
95
+ --switch-primary-background-color: #e6e6e6;
96
+ --switch-primary-border-color: #e6e6e6;
97
+ --switch-primary-background-color-checked: #ffc818;
98
+ --switch-primary-border-color-checked: #ffc818;
23
99
  }
package/theme_default_variables.css CHANGED
@@ -23,7 +23,7 @@
23
23
  --typography-alert: #ff564e;
24
24
  --typography-success: #28bc00;
25
25
  --typography-secondary: #dbdbdb;
26
- --button-border-radius: 26px;
26
+ --button-border-radius: 18px;
27
27
  --button-primary-color: #fff;
28
28
  --button-primary-background-color: #067AFF;
29
29
  --button-primary-border-color: #067AFF;
@@ -33,7 +33,7 @@
33
33
  --button-primary-color-active: #fff;
34
34
  --button-primary-background-color-active: #0066DC;
35
35
  --button-primary-border-color-active: #0066DC;
36
- --button-primary-color-disabled: #B8D2FF;
36
+ --button-primary-color-disabled: #b3b3b3;
37
37
  --button-primary-background-color-disabled: #E8F0FE;
38
38
  --button-primary-border-color-disabled: #E8F0FE;
39
39
  --button-secondary-color: #fff;
@@ -45,21 +45,21 @@
45
45
  --button-secondary-color-active: #fff;
46
46
  --button-secondary-background-color-active: #ffab0f;
47
47
  --button-secondary-border-color-active: #ffab0f;
48
- --button-secondary-color-disabled: #ffdaa3;
48
+ --button-secondary-color-disabled: #b3b3b3;
49
49
  --button-secondary-background-color-disabled: #fff1db;
50
50
  --button-secondary-border-color-disabled: #fff1db;
51
- --button-pseudo-color: #fc5200;
52
- --button-pseudo-background-color: #fff;
53
- --button-pseudo-border-color: #fff;
54
- --button-pseudo-color-hovered: #fc5200;
55
- --button-pseudo-background-color-hovered: #FFEAE2;
56
- --button-pseudo-border-color-hovered: #FFEAE2;
57
- --button-pseudo-color-active: #fc5200;
51
+ --button-pseudo-color: #000;
52
+ --button-pseudo-background-color: #FFF5F0;
53
+ --button-pseudo-border-color: #FFF5F0;
54
+ --button-pseudo-color-hovered: #000;
55
+ --button-pseudo-background-color-hovered: #FFF5F0;
56
+ --button-pseudo-border-color-hovered: #FFF5F0;
57
+ --button-pseudo-color-active: #000;
58
58
  --button-pseudo-background-color-active: #FFEAE2;
59
59
  --button-pseudo-border-color-active: #FFEAE2;
60
- --button-pseudo-color-disabled: #ffdaa3;
61
- --button-pseudo-background-color-disabled: #fff1db;
62
- --button-pseudo-border-color-disabled: #fff1db;
60
+ --button-pseudo-color-disabled: #b3b3b3;
61
+ --button-pseudo-background-color-disabled: #FFF5F0;
62
+ --button-pseudo-border-color-disabled: #FFF5F0;
63
63
  --button-outline-color: #000;
64
64
  --button-outline-background-color: #fff;
65
65
  --button-outline-border-color: #dbdbdb;
@@ -69,14 +69,20 @@
69
69
  --button-outline-color-active: #000;
70
70
  --button-outline-background-color-active: #e6e6e6;
71
71
  --button-outline-border-color-active: #dbdbdb;
72
- --button-outline-color-disabled: #ffdaa3;
73
- --button-outline-background-color-disabled: #fff1db;
72
+ --button-outline-color-disabled: #b3b3b3;
73
+ --button-outline-background-color-disabled: #fff;
74
74
  --button-outline-border-color-disabled: #e6e6e6;
75
75
  --button-clear-color: #067AFF;
76
- --button-clear-color-hovered: #0066DC;
76
+ --button-clear-color-hovered: #067AFF;
77
77
  --button-clear-color-active: #0066DC;
78
+ --button-clear-color-disabled: #b3b3b3;
79
+ --button-clear-background-color-disabled: #fff;
80
+ --button-clear-border-color-disabled: #fff;
78
81
  --input-primary-border-color: #dbdbdb;
79
82
  --input-primary-plaseholder-color: #e6e6e6;
83
+ --input-primary-border-color-error: #ff564e;
84
+ --input-primary-background-color-error: #FFEAE2;
85
+ --input-primary-box-shadow-color-error: #FFEAE2;
80
86
  --checkbox-primary-background-color-checked: #067AFF;
81
87
  --checkbox-primary-background-color-hovered: #067AFF;
82
88
  --checkbox-primary-box-shadow-focused: #E8F0FE;