colibri-ui 0.8.20 → 0.8.22

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 (3) hide show
  1. package/Button/Button.module.css +28 -28
  2. package/esm/Button/Button.module.css +28 -28
  3. package/package.json +1 -1
package/Button/Button.module.css CHANGED
@@ -67,150 +67,150 @@
67
67
  line-height: 42px;
68
68
  }
69
69
 
70
- .variant_primary {
70
+ button.variant_primary {
71
71
  background-color: var(--button-primary-bg);
72
72
  border-color: var(--button-primary-border-color);
73
73
  color: var(--button-primary-color);
74
74
  }
75
- .variant_primary:hover {
75
+ button.variant_primary:hover {
76
76
  background-color: var(--button-primary-bg-hovered);
77
77
  border-color: var(--button-primary-border-color-hovered);
78
78
  color: var(--button-primary-color-hovered);
79
79
  }
80
- .variant_primary:active {
80
+ button.variant_primary:active {
81
81
  background-color: var(--button-primary-bg-active);
82
82
  border-color: var(--button-primary-border-color-active);
83
83
  color: var(--button-primary-color-active);
84
84
  }
85
- .variant_primary_disabled {
85
+ button.variant_primary_disabled {
86
86
  background-color: var(--button-primary-bg-disabled);
87
87
  border-color: var(--button-primary-border-color-disabled);
88
88
  color: var(--button-primary-color-disabled);
89
89
  cursor: not-allowed;
90
90
  pointer-events: none;
91
91
  }
92
- .variant_secondary {
92
+ button.variant_secondary {
93
93
  background-color: var(--button-secondary-bg);
94
94
  border-color: var(--button-secondary-border-color);
95
95
  color: var(--button-secondary-color);
96
96
  }
97
- .variant_secondary:hover {
97
+ button.variant_secondary:hover {
98
98
  background-color: var(--button-secondary-bg-hovered);
99
99
  border-color: var(--button-secondary-border-color-hovered);
100
100
  color: var(--button-secondary-color-hovered);
101
101
  }
102
- .variant_secondary:active {
102
+ button.variant_secondary:active {
103
103
  background-color: var(--button-secondary-bg-active);
104
104
  border-color: var(--button-secondary-border-color-active);
105
105
  color: var(--button-secondary-color-active);
106
106
  }
107
- .variant_secondary_disabled {
107
+ button.variant_secondary_disabled {
108
108
  background-color: var(--button-secondary-bg-disabled);
109
109
  border-color: var(--button-secondary-border-color-disabled);
110
110
  color: var(--button-secondary-color-disabled);
111
111
  cursor: not-allowed;
112
112
  pointer-events: none;
113
113
  }
114
- .variant_pseudo {
114
+ button.variant_pseudo {
115
115
  background-color: var(--button-pseudo-bg);
116
116
  border-color: var(--button-pseudo-border-color);
117
117
  color: var(--button-pseudo-color);
118
118
  }
119
- .variant_pseudo:hover {
119
+ button.variant_pseudo:hover {
120
120
  background-color: var(--button-pseudo-bg-hovered);
121
121
  border-color: var(--button-pseudo-border-color-hovered);
122
122
  color: var(--button-pseudo-color-hovered);
123
123
  }
124
- .variant_pseudo:active {
124
+ button.variant_pseudo:active {
125
125
  background-color: var(--button-pseudo-bg-active);
126
126
  border-color: var(--button-pseudo-border-color-active);
127
127
  color: var(--button-pseudo-color-active);
128
128
  }
129
- .variant_pseudo_disabled {
129
+ button.variant_pseudo_disabled {
130
130
  background-color: var(--button-pseudo-bg-disabled);
131
131
  border-color: var(--button-pseudo-border-color-disabled);
132
132
  color: var(--button-pseudo-color-disabled);
133
133
  cursor: not-allowed;
134
134
  pointer-events: none;
135
135
  }
136
- .variant_outline {
136
+ button.variant_outline {
137
137
  background-color: var(--button-outline-bg);
138
138
  border-color: var(--button-outline-border-color);
139
139
  color: var(--button-outline-color);
140
140
  }
141
- .variant_outline:hover {
141
+ button.variant_outline:hover {
142
142
  background-color: var(--button-outline-bg-hovered);
143
143
  border-color: var(--button-outline-border-color-hovered);
144
144
  color: var(--button-outline-color-hovered);
145
145
  }
146
- .variant_outline:active {
146
+ button.variant_outline:active {
147
147
  background-color: var(--button-outline-bg-active);
148
148
  border-color: var(--button-outline-border-color-active);
149
149
  color: var(--button-outline-color-active);
150
150
  }
151
- .variant_outline_disabled {
151
+ button.variant_outline_disabled {
152
152
  background-color: var(--button-outline-bg-disabled);
153
153
  border-color: var(--button-outline-border-color-disabled);
154
154
  color: var(--button-outline-color-disabled);
155
155
  cursor: not-allowed;
156
156
  pointer-events: none;
157
157
  }
158
- .variant_clear {
158
+ button.variant_clear {
159
159
  background-color: transparent;
160
160
  border-color: transparent;
161
161
  color: var(--button-clear-color);
162
162
  }
163
- .variant_clear:hover {
163
+ button.variant_clear:hover {
164
164
  color: var(--button-clear-color-hovered);
165
165
  }
166
- .variant_clear:active {
166
+ button.variant_clear:active {
167
167
  color: var(--button-clear-color-active);
168
168
  }
169
- .variant_clear_disabled {
169
+ button.variant_clear_disabled {
170
170
  background-color: var(--button-clear-bg-disabled);
171
171
  border-color: var(--button-clear-border-color-disabled);
172
172
  color: var(--button-clear-color-disabled);
173
173
  cursor: not-allowed;
174
174
  pointer-events: none;
175
175
  }
176
- .variant_alert {
176
+ button.variant_alert {
177
177
  background-color: var(--button-alert-bg);
178
178
  border-color: var(--button-alert-border-color);
179
179
  color: var(--button-alert-color);
180
180
  }
181
- .variant_alert:hover {
181
+ button.variant_alert:hover {
182
182
  background-color: var(--button-alert-bg-hovered);
183
183
  border-color: var(--button-alert-border-color-hovered);
184
184
  color: var(--button-alert-color-hovered);
185
185
  }
186
- .variant_alert:active {
186
+ button.variant_alert:active {
187
187
  background-color: var(--button-alert-bg-active);
188
188
  border-color: var(--button-alert-border-color-active);
189
189
  color: var(--button-alert-color-active);
190
190
  }
191
- .variant_alert_disabled {
191
+ button.variant_alert_disabled {
192
192
  background-color: var(--button-alert-bg-disabled);
193
193
  border-color: var(--button-alert-border-color-disabled);
194
194
  color: var(--button-alert-color-disabled);
195
195
  cursor: not-allowed;
196
196
  pointer-events: none;
197
197
  }
198
- .variant_success {
198
+ button.variant_success {
199
199
  background-color: var(--button-success-bg);
200
200
  border-color: var(--button-success-border-color);
201
201
  color: var(--button-success-color);
202
202
  }
203
- .variant_success:hover {
203
+ button.variant_success:hover {
204
204
  background-color: var(--button-success-bg-hovered);
205
205
  border-color: var(--button-success-border-color-hovered);
206
206
  color: var(--button-success-color-hovered);
207
207
  }
208
- .variant_success:active {
208
+ button.variant_success:active {
209
209
  background-color: var(--button-success-bg-active);
210
210
  border-color: var(--button-success-border-color-active);
211
211
  color: var(--button-success-color-active);
212
212
  }
213
- .variant_success_disabled {
213
+ button.variant_success_disabled {
214
214
  background-color: var(--button-success-bg-disabled);
215
215
  border-color: var(--button-success-border-color-disabled);
216
216
  color: var(--button-success-color-disabled);
package/esm/Button/Button.module.css CHANGED
@@ -67,150 +67,150 @@
67
67
  line-height: 42px;
68
68
  }
69
69
 
70
- .variant_primary {
70
+ button.variant_primary {
71
71
  background-color: var(--button-primary-bg);
72
72
  border-color: var(--button-primary-border-color);
73
73
  color: var(--button-primary-color);
74
74
  }
75
- .variant_primary:hover {
75
+ button.variant_primary:hover {
76
76
  background-color: var(--button-primary-bg-hovered);
77
77
  border-color: var(--button-primary-border-color-hovered);
78
78
  color: var(--button-primary-color-hovered);
79
79
  }
80
- .variant_primary:active {
80
+ button.variant_primary:active {
81
81
  background-color: var(--button-primary-bg-active);
82
82
  border-color: var(--button-primary-border-color-active);
83
83
  color: var(--button-primary-color-active);
84
84
  }
85
- .variant_primary_disabled {
85
+ button.variant_primary_disabled {
86
86
  background-color: var(--button-primary-bg-disabled);
87
87
  border-color: var(--button-primary-border-color-disabled);
88
88
  color: var(--button-primary-color-disabled);
89
89
  cursor: not-allowed;
90
90
  pointer-events: none;
91
91
  }
92
- .variant_secondary {
92
+ button.variant_secondary {
93
93
  background-color: var(--button-secondary-bg);
94
94
  border-color: var(--button-secondary-border-color);
95
95
  color: var(--button-secondary-color);
96
96
  }
97
- .variant_secondary:hover {
97
+ button.variant_secondary:hover {
98
98
  background-color: var(--button-secondary-bg-hovered);
99
99
  border-color: var(--button-secondary-border-color-hovered);
100
100
  color: var(--button-secondary-color-hovered);
101
101
  }
102
- .variant_secondary:active {
102
+ button.variant_secondary:active {
103
103
  background-color: var(--button-secondary-bg-active);
104
104
  border-color: var(--button-secondary-border-color-active);
105
105
  color: var(--button-secondary-color-active);
106
106
  }
107
- .variant_secondary_disabled {
107
+ button.variant_secondary_disabled {
108
108
  background-color: var(--button-secondary-bg-disabled);
109
109
  border-color: var(--button-secondary-border-color-disabled);
110
110
  color: var(--button-secondary-color-disabled);
111
111
  cursor: not-allowed;
112
112
  pointer-events: none;
113
113
  }
114
- .variant_pseudo {
114
+ button.variant_pseudo {
115
115
  background-color: var(--button-pseudo-bg);
116
116
  border-color: var(--button-pseudo-border-color);
117
117
  color: var(--button-pseudo-color);
118
118
  }
119
- .variant_pseudo:hover {
119
+ button.variant_pseudo:hover {
120
120
  background-color: var(--button-pseudo-bg-hovered);
121
121
  border-color: var(--button-pseudo-border-color-hovered);
122
122
  color: var(--button-pseudo-color-hovered);
123
123
  }
124
- .variant_pseudo:active {
124
+ button.variant_pseudo:active {
125
125
  background-color: var(--button-pseudo-bg-active);
126
126
  border-color: var(--button-pseudo-border-color-active);
127
127
  color: var(--button-pseudo-color-active);
128
128
  }
129
- .variant_pseudo_disabled {
129
+ button.variant_pseudo_disabled {
130
130
  background-color: var(--button-pseudo-bg-disabled);
131
131
  border-color: var(--button-pseudo-border-color-disabled);
132
132
  color: var(--button-pseudo-color-disabled);
133
133
  cursor: not-allowed;
134
134
  pointer-events: none;
135
135
  }
136
- .variant_outline {
136
+ button.variant_outline {
137
137
  background-color: var(--button-outline-bg);
138
138
  border-color: var(--button-outline-border-color);
139
139
  color: var(--button-outline-color);
140
140
  }
141
- .variant_outline:hover {
141
+ button.variant_outline:hover {
142
142
  background-color: var(--button-outline-bg-hovered);
143
143
  border-color: var(--button-outline-border-color-hovered);
144
144
  color: var(--button-outline-color-hovered);
145
145
  }
146
- .variant_outline:active {
146
+ button.variant_outline:active {
147
147
  background-color: var(--button-outline-bg-active);
148
148
  border-color: var(--button-outline-border-color-active);
149
149
  color: var(--button-outline-color-active);
150
150
  }
151
- .variant_outline_disabled {
151
+ button.variant_outline_disabled {
152
152
  background-color: var(--button-outline-bg-disabled);
153
153
  border-color: var(--button-outline-border-color-disabled);
154
154
  color: var(--button-outline-color-disabled);
155
155
  cursor: not-allowed;
156
156
  pointer-events: none;
157
157
  }
158
- .variant_clear {
158
+ button.variant_clear {
159
159
  background-color: transparent;
160
160
  border-color: transparent;
161
161
  color: var(--button-clear-color);
162
162
  }
163
- .variant_clear:hover {
163
+ button.variant_clear:hover {
164
164
  color: var(--button-clear-color-hovered);
165
165
  }
166
- .variant_clear:active {
166
+ button.variant_clear:active {
167
167
  color: var(--button-clear-color-active);
168
168
  }
169
- .variant_clear_disabled {
169
+ button.variant_clear_disabled {
170
170
  background-color: var(--button-clear-bg-disabled);
171
171
  border-color: var(--button-clear-border-color-disabled);
172
172
  color: var(--button-clear-color-disabled);
173
173
  cursor: not-allowed;
174
174
  pointer-events: none;
175
175
  }
176
- .variant_alert {
176
+ button.variant_alert {
177
177
  background-color: var(--button-alert-bg);
178
178
  border-color: var(--button-alert-border-color);
179
179
  color: var(--button-alert-color);
180
180
  }
181
- .variant_alert:hover {
181
+ button.variant_alert:hover {
182
182
  background-color: var(--button-alert-bg-hovered);
183
183
  border-color: var(--button-alert-border-color-hovered);
184
184
  color: var(--button-alert-color-hovered);
185
185
  }
186
- .variant_alert:active {
186
+ button.variant_alert:active {
187
187
  background-color: var(--button-alert-bg-active);
188
188
  border-color: var(--button-alert-border-color-active);
189
189
  color: var(--button-alert-color-active);
190
190
  }
191
- .variant_alert_disabled {
191
+ button.variant_alert_disabled {
192
192
  background-color: var(--button-alert-bg-disabled);
193
193
  border-color: var(--button-alert-border-color-disabled);
194
194
  color: var(--button-alert-color-disabled);
195
195
  cursor: not-allowed;
196
196
  pointer-events: none;
197
197
  }
198
- .variant_success {
198
+ button.variant_success {
199
199
  background-color: var(--button-success-bg);
200
200
  border-color: var(--button-success-border-color);
201
201
  color: var(--button-success-color);
202
202
  }
203
- .variant_success:hover {
203
+ button.variant_success:hover {
204
204
  background-color: var(--button-success-bg-hovered);
205
205
  border-color: var(--button-success-border-color-hovered);
206
206
  color: var(--button-success-color-hovered);
207
207
  }
208
- .variant_success:active {
208
+ button.variant_success:active {
209
209
  background-color: var(--button-success-bg-active);
210
210
  border-color: var(--button-success-border-color-active);
211
211
  color: var(--button-success-color-active);
212
212
  }
213
- .variant_success_disabled {
213
+ button.variant_success_disabled {
214
214
  background-color: var(--button-success-bg-disabled);
215
215
  border-color: var(--button-success-border-color-disabled);
216
216
  color: var(--button-success-color-disabled);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "colibri-ui",
3
- "version": "0.8.20",
3
+ "version": "0.8.22",
4
4
  "description": "React UI components library",
5
5
  "main": "index.js",
6
6
  "scripts": {},