@entur/button 3.0.12 → 3.1.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.
- package/dist/styles.css +65 -51
- package/package.json +3 -3
package/dist/styles.css
CHANGED
|
@@ -3,15 +3,6 @@
|
|
|
3
3
|
}
|
|
4
4
|
/* DO NOT CHANGE!*/
|
|
5
5
|
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
6
|
-
.eds-button-group .eds-button {
|
|
7
|
-
margin-right: 0.75rem;
|
|
8
|
-
margin-bottom: 0.75rem;
|
|
9
|
-
}
|
|
10
|
-
.eds-button-group .eds-button:only-child {
|
|
11
|
-
margin: 0;
|
|
12
|
-
}
|
|
13
|
-
/* DO NOT CHANGE!*/
|
|
14
|
-
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
15
6
|
a.eds-button {
|
|
16
7
|
padding: 0.5rem 1rem;
|
|
17
8
|
}
|
|
@@ -99,18 +90,17 @@ a.eds-button--size-large {
|
|
|
99
90
|
}
|
|
100
91
|
.eds-button--variant-secondary {
|
|
101
92
|
background-color: transparent;
|
|
102
|
-
border: 0.125rem solid #
|
|
93
|
+
border: 0.125rem solid #54568c;
|
|
103
94
|
color: #181c56;
|
|
104
95
|
}
|
|
105
96
|
.eds-button--variant-secondary > .eds-button__loading-dots .eds-loading-dots__dot {
|
|
106
97
|
background: #181c56;
|
|
107
98
|
}
|
|
108
99
|
.eds-button--variant-secondary:hover {
|
|
109
|
-
background-color: #
|
|
100
|
+
background-color: #ced4ee;
|
|
110
101
|
}
|
|
111
102
|
.eds-button--variant-secondary:active {
|
|
112
|
-
background-color: #
|
|
113
|
-
border-color: #9da5cb;
|
|
103
|
+
background-color: #aeb7e2;
|
|
114
104
|
}
|
|
115
105
|
.eds-contrast .eds-button--variant-secondary {
|
|
116
106
|
background-color: transparent;
|
|
@@ -121,7 +111,7 @@ a.eds-button--size-large {
|
|
|
121
111
|
background: #ffffff;
|
|
122
112
|
}
|
|
123
113
|
.eds-contrast .eds-button--variant-secondary:hover {
|
|
124
|
-
background-color: rgba(
|
|
114
|
+
background-color: rgba(174, 183, 226, 0.2);
|
|
125
115
|
}
|
|
126
116
|
.eds-contrast .eds-button--variant-secondary:active {
|
|
127
117
|
background: #aeb7e2;
|
|
@@ -133,15 +123,26 @@ a.eds-button--size-large {
|
|
|
133
123
|
.eds-button--variant-success {
|
|
134
124
|
background-color: #5ac39a;
|
|
135
125
|
color: #181c56;
|
|
126
|
+
border: 0.125rem solid #54568c;
|
|
127
|
+
border-radius: 0.25rem;
|
|
136
128
|
}
|
|
137
129
|
.eds-button--variant-success > .eds-button__loading-dots .eds-loading-dots__dot {
|
|
138
130
|
background: #181c56;
|
|
139
131
|
}
|
|
140
132
|
.eds-button--variant-success:hover {
|
|
141
|
-
background
|
|
133
|
+
background: rgba(107, 201, 164, 0.4);
|
|
142
134
|
}
|
|
143
135
|
.eds-button--variant-success:active {
|
|
144
|
-
background-color: #
|
|
136
|
+
background-color: #51b08b;
|
|
137
|
+
}
|
|
138
|
+
.eds-contrast .eds-button--variant-success {
|
|
139
|
+
border: none;
|
|
140
|
+
}
|
|
141
|
+
.eds-contrast .eds-button--variant-success:hover {
|
|
142
|
+
background: #6bc9a4;
|
|
143
|
+
}
|
|
144
|
+
.eds-contrast .eds-button--variant-success:active {
|
|
145
|
+
background-color: #51b08b;
|
|
145
146
|
}
|
|
146
147
|
.eds-button--variant-negative {
|
|
147
148
|
background: transparent;
|
|
@@ -152,7 +153,7 @@ a.eds-button--size-large {
|
|
|
152
153
|
background: #d31b1b;
|
|
153
154
|
}
|
|
154
155
|
.eds-button--variant-negative:hover {
|
|
155
|
-
background-color: rgba(
|
|
156
|
+
background-color: rgba(211, 27, 27, 0.2);
|
|
156
157
|
}
|
|
157
158
|
.eds-button--variant-negative:active {
|
|
158
159
|
background-color: #d31b1b;
|
|
@@ -169,7 +170,7 @@ a.eds-button--size-large {
|
|
|
169
170
|
background: #ffffff;
|
|
170
171
|
}
|
|
171
172
|
.eds-contrast .eds-button--variant-negative:hover {
|
|
172
|
-
background-color:
|
|
173
|
+
background-color: rgba(255, 148, 148, 0.2);
|
|
173
174
|
}
|
|
174
175
|
.eds-contrast .eds-button--variant-negative:active {
|
|
175
176
|
background-color: #ff9494;
|
|
@@ -177,20 +178,19 @@ a.eds-button--size-large {
|
|
|
177
178
|
}
|
|
178
179
|
.eds-button--variant-tertiary {
|
|
179
180
|
font-size: 0.875rem;
|
|
180
|
-
border: 0.0625rem solid #
|
|
181
|
+
border: 0.0625rem solid #54568c;
|
|
181
182
|
border-radius: 0.25rem;
|
|
182
|
-
background: transparent;
|
|
183
|
+
background-color: transparent;
|
|
183
184
|
color: #181c56;
|
|
184
185
|
height: 2rem;
|
|
185
186
|
padding: 0 0.75rem;
|
|
186
187
|
min-width: 6rem;
|
|
187
188
|
}
|
|
188
189
|
.eds-button--variant-tertiary:hover {
|
|
189
|
-
background-color: #
|
|
190
|
+
background-color: #ced4ee;
|
|
190
191
|
}
|
|
191
192
|
.eds-button--variant-tertiary:active {
|
|
192
|
-
color: #
|
|
193
|
-
background-color: #181c56;
|
|
193
|
+
background-color: #aeb7e2;
|
|
194
194
|
}
|
|
195
195
|
.eds-button--variant-tertiary.eds-button--leading-icon .eds-icon {
|
|
196
196
|
margin-right: 0.5rem;
|
|
@@ -199,19 +199,23 @@ a.eds-button--size-large {
|
|
|
199
199
|
margin-left: 0.5rem;
|
|
200
200
|
}
|
|
201
201
|
.eds-contrast .eds-button--variant-tertiary {
|
|
202
|
+
background-color: transparent;
|
|
202
203
|
color: #ffffff;
|
|
203
|
-
border-color: #
|
|
204
|
+
border-color: #aeb7e2;
|
|
204
205
|
}
|
|
205
206
|
.eds-contrast .eds-button--variant-tertiary > .eds-button__loading-dots .eds-loading-dots__dot {
|
|
206
207
|
background: #ffffff;
|
|
207
208
|
}
|
|
208
209
|
.eds-contrast .eds-button--variant-tertiary:hover {
|
|
209
|
-
background-color:
|
|
210
|
+
background-color: rgba(174, 183, 226, 0.2);
|
|
210
211
|
}
|
|
211
212
|
.eds-contrast .eds-button--variant-tertiary:active {
|
|
212
|
-
background
|
|
213
|
+
background: #aeb7e2;
|
|
213
214
|
color: #181c56;
|
|
214
215
|
}
|
|
216
|
+
.eds-contrast .eds-button--variant-tertiary:active > .eds-button__loading-dots .eds-loading-dots__dot {
|
|
217
|
+
background: #181c56;
|
|
218
|
+
}
|
|
215
219
|
.eds-button[disabled].eds-button--loading {
|
|
216
220
|
pointer-events: none;
|
|
217
221
|
}
|
|
@@ -228,6 +232,15 @@ a.eds-button--size-large {
|
|
|
228
232
|
}
|
|
229
233
|
/* DO NOT CHANGE!*/
|
|
230
234
|
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
235
|
+
.eds-button-group .eds-button {
|
|
236
|
+
margin-right: 0.75rem;
|
|
237
|
+
margin-bottom: 0.75rem;
|
|
238
|
+
}
|
|
239
|
+
.eds-button-group .eds-button:only-child {
|
|
240
|
+
margin: 0;
|
|
241
|
+
}
|
|
242
|
+
/* DO NOT CHANGE!*/
|
|
243
|
+
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
231
244
|
.eds-floating-button {
|
|
232
245
|
align-items: center;
|
|
233
246
|
-webkit-appearance: none;
|
|
@@ -358,7 +371,7 @@ a.eds-button--size-large {
|
|
|
358
371
|
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
359
372
|
.eds-square-button {
|
|
360
373
|
--icon-color: var(--primary-text-color);
|
|
361
|
-
--
|
|
374
|
+
--button-background: transparent;
|
|
362
375
|
--border-color: transparent;
|
|
363
376
|
align-items: center;
|
|
364
377
|
-webkit-appearance: none;
|
|
@@ -397,7 +410,7 @@ a.eds-button--size-large {
|
|
|
397
410
|
|
|
398
411
|
.eds-square-button__icon {
|
|
399
412
|
align-items: center;
|
|
400
|
-
background-color: var(--
|
|
413
|
+
background-color: var(--button-background);
|
|
401
414
|
border: 0.125rem solid var(--border-color);
|
|
402
415
|
border-radius: 0.25rem;
|
|
403
416
|
color: var(--icon-color);
|
|
@@ -414,21 +427,23 @@ a.eds-button--size-large {
|
|
|
414
427
|
}
|
|
415
428
|
|
|
416
429
|
.eds-square-button--secondary {
|
|
417
|
-
--
|
|
418
|
-
--border-color: #
|
|
430
|
+
--button-background: transparent;
|
|
431
|
+
--border-color: #54568c;
|
|
419
432
|
}
|
|
420
433
|
.eds-square-button--secondary:hover {
|
|
421
|
-
--
|
|
434
|
+
--button-background: rgba(174, 183, 226, 0.4);
|
|
422
435
|
}
|
|
423
436
|
.eds-square-button--secondary:active {
|
|
424
|
-
--
|
|
425
|
-
|
|
437
|
+
--button-background: #aeb7e2;
|
|
438
|
+
}
|
|
439
|
+
.eds-contrast .eds-square-button--secondary {
|
|
440
|
+
--border-color: #aeb7e2;
|
|
426
441
|
}
|
|
427
442
|
.eds-contrast .eds-square-button--secondary:hover {
|
|
428
|
-
--
|
|
443
|
+
--button-background: rgba(174, 183, 226, 0.2);
|
|
429
444
|
}
|
|
430
445
|
.eds-contrast .eds-square-button--secondary:active {
|
|
431
|
-
--
|
|
446
|
+
--button-background: #aeb7e2;
|
|
432
447
|
--icon-color: #181c56;
|
|
433
448
|
}
|
|
434
449
|
.eds-contrast .eds-square-button--secondary .eds-square-button__loading-dots .eds-loading-dots__dot {
|
|
@@ -439,17 +454,22 @@ a.eds-button--size-large {
|
|
|
439
454
|
}
|
|
440
455
|
|
|
441
456
|
.eds-square-button--success {
|
|
442
|
-
--
|
|
457
|
+
--button-background: #5ac39a;
|
|
458
|
+
--border-color: #54568c;
|
|
443
459
|
}
|
|
444
460
|
.eds-square-button--success:hover {
|
|
445
|
-
--
|
|
461
|
+
--button-background: #6bc9a4;
|
|
446
462
|
}
|
|
447
463
|
.eds-square-button--success:active {
|
|
448
|
-
--
|
|
464
|
+
--button-background: #51b08b;
|
|
449
465
|
}
|
|
450
466
|
.eds-square-button--success .eds-square-button__loading-dots .eds-loading-dots__dot {
|
|
451
467
|
background: #181c56;
|
|
452
468
|
}
|
|
469
|
+
.eds-contrast .eds-square-button--success {
|
|
470
|
+
--border-color: transparent;
|
|
471
|
+
--icon-color: #181c56;
|
|
472
|
+
}
|
|
453
473
|
|
|
454
474
|
.eds-square-button__label {
|
|
455
475
|
color: var(--primary-text-color);
|
|
@@ -461,33 +481,27 @@ a.eds-button--size-large {
|
|
|
461
481
|
}
|
|
462
482
|
|
|
463
483
|
.eds-square-button--tertiary {
|
|
464
|
-
--
|
|
465
|
-
--border-color: #
|
|
484
|
+
--button-background: transparent;
|
|
485
|
+
--border-color: #54568c;
|
|
466
486
|
font-size: 0.875rem;
|
|
467
487
|
}
|
|
468
488
|
.eds-square-button--tertiary:hover {
|
|
469
|
-
--
|
|
489
|
+
--button-background: rgba(174, 183, 226, 0.4);
|
|
470
490
|
}
|
|
471
491
|
.eds-square-button--tertiary:active {
|
|
472
|
-
--
|
|
473
|
-
--icon-color: #ffffff;
|
|
474
|
-
}
|
|
475
|
-
.eds-square-button--tertiary:active .eds-square-button__loading-dots .eds-loading-dots__dot {
|
|
476
|
-
background: #ffffff;
|
|
492
|
+
--button-background: #aeb7e2;
|
|
477
493
|
}
|
|
478
494
|
.eds-contrast .eds-square-button--tertiary {
|
|
479
495
|
--border-color: #ffffff;
|
|
496
|
+
--border-color: #aeb7e2;
|
|
480
497
|
}
|
|
481
498
|
.eds-contrast .eds-square-button--tertiary:hover {
|
|
482
|
-
--
|
|
499
|
+
--button-background: rgba(174, 183, 226, 0.2);
|
|
483
500
|
}
|
|
484
501
|
.eds-contrast .eds-square-button--tertiary:active {
|
|
485
|
-
--
|
|
502
|
+
--button-background: #aeb7e2;
|
|
486
503
|
--icon-color: #181c56;
|
|
487
504
|
}
|
|
488
|
-
.eds-contrast .eds-square-button--tertiary:active .eds-square-button__loading-dots .eds-loading-dots__dot {
|
|
489
|
-
background: #181c56;
|
|
490
|
-
}
|
|
491
505
|
.eds-contrast .eds-square-button--tertiary .eds-square-button__loading-dots .eds-loading-dots__dot {
|
|
492
506
|
background: #ffffff;
|
|
493
507
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@entur/button",
|
|
3
|
-
"version": "3.0
|
|
3
|
+
"version": "3.1.0",
|
|
4
4
|
"license": "EUPL-1.2",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"module": "dist/button.esm.js",
|
|
@@ -27,10 +27,10 @@
|
|
|
27
27
|
"react-dom": ">=16.8.0"
|
|
28
28
|
},
|
|
29
29
|
"dependencies": {
|
|
30
|
-
"@entur/loader": "^0.4.
|
|
30
|
+
"@entur/loader": "^0.4.37",
|
|
31
31
|
"@entur/tokens": "^3.10.0",
|
|
32
32
|
"@entur/utils": "^0.9.3",
|
|
33
33
|
"classnames": "^2.3.1"
|
|
34
34
|
},
|
|
35
|
-
"gitHead": "
|
|
35
|
+
"gitHead": "5fcad4b449082b80b796ab52e68f178977f2eba7"
|
|
36
36
|
}
|