barbican-reset 2.14.0 → 2.15.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/helpers/mixins/_buttons.scss +10 -56
- package/package.json +1 -1
|
@@ -16,6 +16,7 @@
|
|
|
16
16
|
border-radius: $border-radius-lg;
|
|
17
17
|
padding: $padding-button-lg;
|
|
18
18
|
text-decoration: none;
|
|
19
|
+
display: inline-block;
|
|
19
20
|
text-align: center;
|
|
20
21
|
font-weight: 700;
|
|
21
22
|
transition: none;
|
|
@@ -57,16 +58,7 @@
|
|
|
57
58
|
}
|
|
58
59
|
}
|
|
59
60
|
|
|
60
|
-
@mixin solid-button(
|
|
61
|
-
$background: $c-brand-generic,
|
|
62
|
-
$color: white,
|
|
63
|
-
$border: 1px,
|
|
64
|
-
$padding: false,
|
|
65
|
-
$margin: false,
|
|
66
|
-
$line-height: false,
|
|
67
|
-
$display: false,
|
|
68
|
-
$font-size: false
|
|
69
|
-
) {
|
|
61
|
+
@mixin solid-button($background: $c-brand-generic, $color: white, $border: 1px, $padding: false, $margin: false, $line-height: false, $display: false, $font-size: false) {
|
|
70
62
|
border: $border solid $background;
|
|
71
63
|
background-color: $background;
|
|
72
64
|
color: $color;
|
|
@@ -108,16 +100,7 @@
|
|
|
108
100
|
}
|
|
109
101
|
}
|
|
110
102
|
|
|
111
|
-
@mixin outline-button(
|
|
112
|
-
$color: $c-brand-generic,
|
|
113
|
-
$background: white,
|
|
114
|
-
$border: 1px,
|
|
115
|
-
$padding: false,
|
|
116
|
-
$margin: false,
|
|
117
|
-
$line-height: false,
|
|
118
|
-
$display: false,
|
|
119
|
-
$font-size: false
|
|
120
|
-
) {
|
|
103
|
+
@mixin outline-button($color: $c-brand-generic, $background: white, $border: 1px, $padding: false, $margin: false, $line-height: false, $display: false, $font-size: false) {
|
|
121
104
|
background-color: $background;
|
|
122
105
|
border: $border solid $color;
|
|
123
106
|
color: $color;
|
|
@@ -144,7 +127,7 @@
|
|
|
144
127
|
}
|
|
145
128
|
|
|
146
129
|
path {
|
|
147
|
-
fill:
|
|
130
|
+
fill: currentColor;
|
|
148
131
|
}
|
|
149
132
|
|
|
150
133
|
@include focus {
|
|
@@ -160,12 +143,7 @@
|
|
|
160
143
|
}
|
|
161
144
|
}
|
|
162
145
|
|
|
163
|
-
@mixin link-button(
|
|
164
|
-
$color: inherit,
|
|
165
|
-
$background: transparent,
|
|
166
|
-
$padding: 0,
|
|
167
|
-
$line-height: false
|
|
168
|
-
) {
|
|
146
|
+
@mixin link-button($color: inherit, $background: transparent, $padding: 0, $line-height: false) {
|
|
169
147
|
background-color: $background;
|
|
170
148
|
text-decoration: underline;
|
|
171
149
|
vertical-align: baseline;
|
|
@@ -227,12 +205,7 @@
|
|
|
227
205
|
}
|
|
228
206
|
|
|
229
207
|
@mixin btn-outline-header {
|
|
230
|
-
@include outline-button(
|
|
231
|
-
$color: white,
|
|
232
|
-
$background: $c-brand-generic,
|
|
233
|
-
$border: 0.125rem,
|
|
234
|
-
$display: 'flex'
|
|
235
|
-
);
|
|
208
|
+
@include outline-button($color: white, $background: $c-brand-generic, $border: 0.125rem, $display: 'flex');
|
|
236
209
|
}
|
|
237
210
|
|
|
238
211
|
@mixin btn-input-edit {
|
|
@@ -261,11 +234,7 @@
|
|
|
261
234
|
}
|
|
262
235
|
|
|
263
236
|
@mixin btn-remove {
|
|
264
|
-
@include solid-button(
|
|
265
|
-
$background: $c-grey-l21,
|
|
266
|
-
$padding: 0.625em,
|
|
267
|
-
$line-height: 1.375
|
|
268
|
-
);
|
|
237
|
+
@include solid-button($background: $c-grey-l21, $padding: 0.625em, $line-height: 1.375);
|
|
269
238
|
}
|
|
270
239
|
|
|
271
240
|
@mixin btn-link {
|
|
@@ -294,10 +263,7 @@
|
|
|
294
263
|
}
|
|
295
264
|
|
|
296
265
|
@include focus {
|
|
297
|
-
@include single-box(
|
|
298
|
-
$c-grey-l21,
|
|
299
|
-
0.1875rem
|
|
300
|
-
); // @BUG: safari outline + border-radius
|
|
266
|
+
@include single-box($c-grey-l21, 0.1875rem); // @BUG: safari outline + border-radius
|
|
301
267
|
border-radius: 50%;
|
|
302
268
|
|
|
303
269
|
path.cross {
|
|
@@ -385,13 +351,7 @@
|
|
|
385
351
|
|
|
386
352
|
@mixin btn-menu {
|
|
387
353
|
@include display-button(flex, 0.75);
|
|
388
|
-
@include outline-button(
|
|
389
|
-
$color: white,
|
|
390
|
-
$background: $c-brand-generic,
|
|
391
|
-
$padding: 0 0.75rem,
|
|
392
|
-
$margin: 0.25rem,
|
|
393
|
-
$line-height: 2.375rem
|
|
394
|
-
);
|
|
354
|
+
@include outline-button($color: white, $background: $c-brand-generic, $padding: 0 0.75rem, $margin: 0.25rem, $line-height: 2.375rem);
|
|
395
355
|
vertical-align: middle;
|
|
396
356
|
min-height: 2.5rem;
|
|
397
357
|
|
|
@@ -406,13 +366,7 @@
|
|
|
406
366
|
|
|
407
367
|
@mixin btn-basket {
|
|
408
368
|
@include display-button(flex, 0.5);
|
|
409
|
-
@include solid-button(
|
|
410
|
-
$background: white,
|
|
411
|
-
$color: $c-brand-generic,
|
|
412
|
-
$padding: 0 0.75rem,
|
|
413
|
-
$margin: 0.25rem,
|
|
414
|
-
$line-height: 2.375rem
|
|
415
|
-
);
|
|
369
|
+
@include solid-button($background: white, $color: $c-brand-generic, $padding: 0 0.75rem, $margin: 0.25rem, $line-height: 2.375rem);
|
|
416
370
|
vertical-align: middle;
|
|
417
371
|
min-height: 2.5rem;
|
|
418
372
|
|
package/package.json
CHANGED