@nuvoui/core 1.2.1 → 1.2.2
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/README.md +96 -73
- package/dist/nuvoui.css +3924 -545
- package/dist/nuvoui.css.map +1 -1
- package/dist/nuvoui.min.css +1 -1
- package/dist/nuvoui.min.css.map +1 -1
- package/package.json +1 -1
- package/src/styles/abstracts/_config.scss +18 -36
- package/src/styles/layouts/_flex.scss +65 -51
- package/src/styles/layouts/_grid.scss +10 -10
- package/src/styles/mixins-map.scss +1 -1
- package/src/styles/themes/_theme.scss +5 -5
- package/src/styles/utilities/_alignment.scss +4 -4
- package/src/styles/utilities/_animations.scss +58 -1
- package/src/styles/utilities/_borders.scss +73 -48
- package/src/styles/utilities/_colors.scss +3 -3
- package/src/styles/utilities/_position.scss +45 -0
- package/src/styles/utilities/_spacing.scss +85 -23
- package/src/styles/utilities/_transforms.scss +221 -0
- package/src/styles/utilities/_transitions.scss +5 -3
- package/src/styles/utilities/_typography.scss +125 -48
|
@@ -2,6 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
@use "sass:map";
|
|
4
4
|
@use "../abstracts/functions" as *;
|
|
5
|
+
@use "../abstracts" as VAR;
|
|
5
6
|
|
|
6
7
|
$generated-keyframes: ();
|
|
7
8
|
|
|
@@ -77,8 +78,64 @@ $generated-keyframes: ();
|
|
|
77
78
|
|
|
78
79
|
@mixin hover-ready {
|
|
79
80
|
& {
|
|
80
|
-
transition-property:
|
|
81
|
+
transition-property: all;
|
|
81
82
|
transition-duration: 0.2s;
|
|
82
83
|
transition-timing-function: ease-in-out;
|
|
83
84
|
}
|
|
84
85
|
}
|
|
86
|
+
|
|
87
|
+
@if VAR.$generate-utility-classes {
|
|
88
|
+
.anim__bounce {
|
|
89
|
+
@include animate-bounce((
|
|
90
|
+
vertical: 50%,
|
|
91
|
+
horizontal: 50%,
|
|
92
|
+
duration: 1s,
|
|
93
|
+
timing: ease-in-out,
|
|
94
|
+
iteration: infinite,
|
|
95
|
+
));
|
|
96
|
+
}
|
|
97
|
+
|
|
98
|
+
.anim__bounce-sm {
|
|
99
|
+
@include animate-bounce((
|
|
100
|
+
vertical: 25%,
|
|
101
|
+
horizontal: 25%,
|
|
102
|
+
duration: 1s,
|
|
103
|
+
timing: ease-in-out,
|
|
104
|
+
iteration: infinite,
|
|
105
|
+
));
|
|
106
|
+
}
|
|
107
|
+
|
|
108
|
+
.anim__bounce-md {
|
|
109
|
+
@include animate-bounce((
|
|
110
|
+
vertical: 50%,
|
|
111
|
+
horizontal: 50%,
|
|
112
|
+
duration: 1s,
|
|
113
|
+
timing: ease-in-out,
|
|
114
|
+
iteration: infinite,
|
|
115
|
+
));
|
|
116
|
+
}
|
|
117
|
+
|
|
118
|
+
.anim__bounce-lg {
|
|
119
|
+
@include animate-bounce((
|
|
120
|
+
vertical: 75%,
|
|
121
|
+
horizontal: 75%,
|
|
122
|
+
duration: 1s,
|
|
123
|
+
timing: ease-in-out,
|
|
124
|
+
iteration: infinite,
|
|
125
|
+
));
|
|
126
|
+
}
|
|
127
|
+
|
|
128
|
+
.anim__bounce-xl {
|
|
129
|
+
@include animate-bounce((
|
|
130
|
+
vertical: 100%,
|
|
131
|
+
horizontal: 100%,
|
|
132
|
+
duration: 1s,
|
|
133
|
+
timing: ease-in-out,
|
|
134
|
+
iteration: infinite,
|
|
135
|
+
));
|
|
136
|
+
}
|
|
137
|
+
|
|
138
|
+
.hover-ready{
|
|
139
|
+
@include hover-ready;
|
|
140
|
+
}
|
|
141
|
+
}
|
|
@@ -5,100 +5,128 @@
|
|
|
5
5
|
@use 'sass:map';
|
|
6
6
|
@use '../abstracts' as *;
|
|
7
7
|
|
|
8
|
+
|
|
9
|
+
|
|
10
|
+
// Common border styles
|
|
11
|
+
$border-styles: (solid, dashed, dotted, double, none);
|
|
12
|
+
|
|
8
13
|
// -----------------------------------------------
|
|
9
14
|
// MIXINS
|
|
10
15
|
// -----------------------------------------------
|
|
11
16
|
|
|
12
17
|
// Core Border Mixins - improved to include style and color by default
|
|
13
|
-
|
|
18
|
+
// SKIP Documentation
|
|
19
|
+
@mixin border($val, $style: solid, $color: var(--border)) {
|
|
14
20
|
$val: if($val == 0, $val, $val + px);
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
21
|
+
|
|
22
|
+
& {
|
|
23
|
+
border-width: $val;
|
|
24
|
+
@if $val != 0 {
|
|
25
|
+
border-style: $style;
|
|
26
|
+
border-color: $color;
|
|
27
|
+
}
|
|
20
28
|
}
|
|
21
29
|
}
|
|
22
30
|
|
|
23
31
|
@mixin border-top($val) {
|
|
24
32
|
$val: if($val == 0, $val, $val + px);
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
33
|
+
|
|
34
|
+
& {
|
|
35
|
+
border-top-width: $val;
|
|
36
|
+
@if $val != 0 {
|
|
37
|
+
border-top-style: solid;
|
|
38
|
+
border-top-color: var(--border, var(--border));
|
|
39
|
+
}
|
|
30
40
|
}
|
|
31
41
|
}
|
|
32
42
|
|
|
33
43
|
@mixin border-right($val) {
|
|
34
44
|
$val: if($val == 0, $val, $val + px);
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
45
|
+
|
|
46
|
+
& {
|
|
47
|
+
border-right-width: $val;
|
|
48
|
+
@if $val != 0 {
|
|
49
|
+
border-right-style: solid;
|
|
50
|
+
border-right-color: var(--border, var(--border));
|
|
51
|
+
}
|
|
40
52
|
}
|
|
41
53
|
}
|
|
42
54
|
|
|
43
55
|
@mixin border-bottom($val) {
|
|
44
56
|
$val: if($val == 0, $val, $val + px);
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
57
|
+
|
|
58
|
+
& {
|
|
59
|
+
border-bottom-width: $val;
|
|
60
|
+
@if $val != 0 {
|
|
61
|
+
border-bottom-style: solid;
|
|
62
|
+
border-bottom-color: var(--border, var(--border));
|
|
63
|
+
}
|
|
50
64
|
}
|
|
51
65
|
}
|
|
52
66
|
|
|
53
67
|
@mixin border-left($val) {
|
|
54
68
|
$val: if($val == 0, $val, $val + px);
|
|
55
69
|
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
70
|
+
& {
|
|
71
|
+
border-left-width: $val;
|
|
72
|
+
@if $val != 0 {
|
|
73
|
+
border-left-style: solid;
|
|
74
|
+
border-left-color: var(--border, var(--border));
|
|
75
|
+
}
|
|
60
76
|
}
|
|
61
77
|
}
|
|
62
|
-
|
|
78
|
+
|
|
63
79
|
// Border Radius Mixins
|
|
64
80
|
@mixin rounded($val: map.get($border-radii, 'md')) {
|
|
65
|
-
border-radius: $val;
|
|
81
|
+
& {border-radius: $val; }
|
|
66
82
|
}
|
|
67
83
|
|
|
68
84
|
@mixin rounded-t($val) {
|
|
69
|
-
|
|
70
|
-
|
|
85
|
+
& {
|
|
86
|
+
border-top-left-radius: $val;
|
|
87
|
+
border-top-right-radius: $val;
|
|
88
|
+
}
|
|
71
89
|
}
|
|
72
90
|
|
|
73
91
|
@mixin rounded-r($val) {
|
|
74
|
-
|
|
75
|
-
|
|
92
|
+
& {
|
|
93
|
+
border-top-right-radius: $val;
|
|
94
|
+
border-bottom-right-radius: $val;
|
|
95
|
+
}
|
|
76
96
|
}
|
|
77
97
|
|
|
78
98
|
@mixin rounded-b($val) {
|
|
79
|
-
|
|
80
|
-
|
|
99
|
+
& {
|
|
100
|
+
border-bottom-left-radius: $val;
|
|
101
|
+
border-bottom-right-radius: $val;
|
|
102
|
+
}
|
|
81
103
|
}
|
|
82
104
|
|
|
83
105
|
@mixin rounded-l($val) {
|
|
84
|
-
|
|
85
|
-
|
|
106
|
+
& {
|
|
107
|
+
border-top-left-radius: $val;
|
|
108
|
+
border-bottom-left-radius: $val;
|
|
109
|
+
}
|
|
86
110
|
}
|
|
87
111
|
|
|
88
|
-
@mixin rounded-tl($val) { border-top-left-radius: $val; }
|
|
89
|
-
@mixin rounded-tr($val) { border-top-right-radius: $val; }
|
|
90
|
-
@mixin rounded-br($val) { border-bottom-right-radius: $val; }
|
|
91
|
-
@mixin rounded-bl($val) { border-bottom-left-radius: $val; }
|
|
112
|
+
@mixin rounded-tl($val) { & {border-top-left-radius: $val; }}
|
|
113
|
+
@mixin rounded-tr($val) { & {border-top-right-radius: $val; }}
|
|
114
|
+
@mixin rounded-br($val) { & {border-bottom-right-radius: $val; }}
|
|
115
|
+
@mixin rounded-bl($val) { & {border-bottom-left-radius: $val; }}
|
|
92
116
|
|
|
93
117
|
// Border Style and Color
|
|
94
|
-
@mixin border-style($style) { border-style: $style; }
|
|
95
|
-
@mixin border-color($color) { border-color: $color; }
|
|
118
|
+
@mixin border-style($style) { & {border-style: $style; }}
|
|
119
|
+
@mixin border-color($color) { & {border-color: $color; }}
|
|
96
120
|
|
|
97
121
|
// Combined border properties
|
|
98
122
|
@mixin border-all($width, $style, $color) {
|
|
99
|
-
border
|
|
100
|
-
|
|
101
|
-
|
|
123
|
+
@debug "border: #{$width} #{$style} #{$color}";
|
|
124
|
+
|
|
125
|
+
& {
|
|
126
|
+
border-width: $width;
|
|
127
|
+
border-style: $style;
|
|
128
|
+
border-color: $color;
|
|
129
|
+
}
|
|
102
130
|
}
|
|
103
131
|
|
|
104
132
|
// -----------------------------------------------
|
|
@@ -120,9 +148,6 @@ $border-radii: (
|
|
|
120
148
|
'none': 0
|
|
121
149
|
);
|
|
122
150
|
|
|
123
|
-
// Common border styles
|
|
124
|
-
$border-styles: (solid, dashed, dotted, double, none);
|
|
125
|
-
|
|
126
151
|
// -----------------------------------------------
|
|
127
152
|
// UTILITY CLASSES
|
|
128
153
|
// -----------------------------------------------
|
|
@@ -291,4 +316,4 @@ $border-styles: (solid, dashed, dotted, double, none);
|
|
|
291
316
|
.pill\@#{$breakpoint} { @include rounded(9999px); }
|
|
292
317
|
}
|
|
293
318
|
}
|
|
294
|
-
}
|
|
319
|
+
}
|
|
@@ -110,14 +110,14 @@ $colors-primitives: ();
|
|
|
110
110
|
}
|
|
111
111
|
}
|
|
112
112
|
@mixin gradient($direction, $colors...) {
|
|
113
|
-
background-image: linear-gradient($direction, $colors);
|
|
113
|
+
& { background-image: linear-gradient($direction, $colors); }
|
|
114
114
|
}
|
|
115
115
|
|
|
116
116
|
// Filter Mixins
|
|
117
117
|
@mixin backdrop-filter($value) {
|
|
118
|
-
backdrop-filter: $value;
|
|
118
|
+
& { backdrop-filter: $value; }
|
|
119
119
|
}
|
|
120
120
|
|
|
121
121
|
@mixin filter($value) {
|
|
122
|
-
filter: $value;
|
|
122
|
+
& { filter: $value; }
|
|
123
123
|
}
|
|
@@ -171,6 +171,33 @@
|
|
|
171
171
|
|
|
172
172
|
|
|
173
173
|
|
|
174
|
+
// todo: Documentation
|
|
175
|
+
@mixin absolute-center {
|
|
176
|
+
& {
|
|
177
|
+
position: absolute;
|
|
178
|
+
left: 50%;
|
|
179
|
+
top: 50%;
|
|
180
|
+
|
|
181
|
+
--translate-x: -50%;
|
|
182
|
+
--translate-y: -50%;
|
|
183
|
+
|
|
184
|
+
transform: translateX(var(--translate-x)) translateY(var(--translate-y)) translateZ(var(--translate-z, 0)) rotate(var(--rotate, 0)) skewX(var(--skew-x, 0)) skewY(var(--skew-y, 0)) scaleX(var(--scale-x, 1)) scaleY(var(--scale-y, 1));
|
|
185
|
+
}
|
|
186
|
+
}
|
|
187
|
+
|
|
188
|
+
// todo: Documentation
|
|
189
|
+
// Fractional and percentage placements
|
|
190
|
+
$position-fractions: (
|
|
191
|
+
'25p': 25%,
|
|
192
|
+
'33p': 33.333%,
|
|
193
|
+
'50p': 50%,
|
|
194
|
+
'66p': 66.667%,
|
|
195
|
+
'75p': 75%,
|
|
196
|
+
"100p": 100%
|
|
197
|
+
);
|
|
198
|
+
|
|
199
|
+
|
|
200
|
+
|
|
174
201
|
// -----------------------------------------------
|
|
175
202
|
// UTILITY CLASSES
|
|
176
203
|
// -----------------------------------------------
|
|
@@ -181,6 +208,14 @@
|
|
|
181
208
|
.absolute { @include absolute; }
|
|
182
209
|
.fixed { @include fixed; }
|
|
183
210
|
.sticky { @include sticky; }
|
|
211
|
+
.absolute-center { @include absolute-center; }
|
|
212
|
+
|
|
213
|
+
@each $key, $value in $position-fractions {
|
|
214
|
+
.top-#{$key} { @include top($value); }
|
|
215
|
+
.right-#{$key} { @include right($value); }
|
|
216
|
+
.bottom-#{$key} { @include bottom($value); }
|
|
217
|
+
.left-#{$key} { @include left($value); }
|
|
218
|
+
}
|
|
184
219
|
|
|
185
220
|
// Placement Classes
|
|
186
221
|
@each $key, $value in $spacings {
|
|
@@ -202,6 +237,16 @@
|
|
|
202
237
|
.absolute\@#{$breakpoint} {@include absolute;}
|
|
203
238
|
.fixed\@#{$breakpoint} {@include fixed;}
|
|
204
239
|
.sticky\@#{$breakpoint} {@include sticky;}
|
|
240
|
+
.absolute-center\@#{$breakpoint} { @include absolute-center; }
|
|
241
|
+
|
|
242
|
+
// Fractional responsive placements
|
|
243
|
+
@each $key, $value in $position-fractions {
|
|
244
|
+
.top-#{$key}\@#{$breakpoint} { @include top($value); }
|
|
245
|
+
.right-#{$key}\@#{$breakpoint} { @include right($value); }
|
|
246
|
+
.bottom-#{$key}\@#{$breakpoint} { @include bottom($value); }
|
|
247
|
+
.left-#{$key}\@#{$breakpoint} { @include left($value); }
|
|
248
|
+
}
|
|
249
|
+
|
|
205
250
|
@each $key, $value in $spacings {
|
|
206
251
|
.top-#{$key}\@#{$breakpoint} {@include top($value);}
|
|
207
252
|
.right-#{$key}\@#{$breakpoint} {@include right($value);}
|
|
@@ -126,9 +126,11 @@
|
|
|
126
126
|
*/
|
|
127
127
|
@mixin px($val) {
|
|
128
128
|
$val: format-unit-value($val);
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
129
|
+
|
|
130
|
+
& {
|
|
131
|
+
padding-left: $val;
|
|
132
|
+
padding-right: $val;
|
|
133
|
+
}
|
|
132
134
|
}
|
|
133
135
|
|
|
134
136
|
/**
|
|
@@ -138,38 +140,64 @@
|
|
|
138
140
|
*/
|
|
139
141
|
@mixin py($val) {
|
|
140
142
|
$val: format-unit-value($val);
|
|
141
|
-
|
|
142
|
-
padding-top: $val;
|
|
143
|
-
padding-bottom: $val;
|
|
144
|
-
}
|
|
145
143
|
|
|
144
|
+
& {
|
|
145
|
+
padding-top: $val;
|
|
146
|
+
padding-bottom: $val;
|
|
147
|
+
}
|
|
148
|
+
}
|
|
149
|
+
|
|
146
150
|
/**
|
|
147
151
|
* @mixin pt
|
|
148
152
|
* @description Sets padding-top
|
|
149
153
|
* @param {Number|String} $val - Padding value
|
|
150
154
|
*/
|
|
151
|
-
@mixin pt($val) {
|
|
155
|
+
@mixin pt($val) {
|
|
156
|
+
& {
|
|
157
|
+
$val: format-unit-value($val);
|
|
158
|
+
|
|
159
|
+
padding-top: $val;
|
|
160
|
+
}
|
|
161
|
+
}
|
|
152
162
|
|
|
153
163
|
/**
|
|
154
164
|
* @mixin pr
|
|
155
165
|
* @description Sets padding-right
|
|
156
166
|
* @param {Number|String} $val - Padding value
|
|
157
167
|
*/
|
|
158
|
-
@mixin pr($val) {
|
|
168
|
+
@mixin pr($val) {
|
|
169
|
+
& {
|
|
170
|
+
$val: format-unit-value($val);
|
|
171
|
+
|
|
172
|
+
padding-right: $val;
|
|
173
|
+
}
|
|
174
|
+
}
|
|
159
175
|
|
|
160
176
|
/**
|
|
161
177
|
* @mixin pb
|
|
162
178
|
* @description Sets padding-bottom
|
|
163
179
|
* @param {Number|String} $val - Padding value
|
|
164
180
|
*/
|
|
165
|
-
@mixin pb($val) {
|
|
181
|
+
@mixin pb($val) {
|
|
182
|
+
& {
|
|
183
|
+
$val: format-unit-value($val);
|
|
184
|
+
|
|
185
|
+
padding-bottom: $val;
|
|
186
|
+
}
|
|
187
|
+
}
|
|
166
188
|
|
|
167
189
|
/**
|
|
168
190
|
* @mixin pl
|
|
169
191
|
* @description Sets padding-left
|
|
170
192
|
* @param {Number|String} $val - Padding value
|
|
171
193
|
*/
|
|
172
|
-
@mixin pl($val) {
|
|
194
|
+
@mixin pl($val) {
|
|
195
|
+
& {
|
|
196
|
+
$val: format-unit-value($val);
|
|
197
|
+
|
|
198
|
+
padding-left: $val;
|
|
199
|
+
}
|
|
200
|
+
}
|
|
173
201
|
|
|
174
202
|
// -----------------------------------------------
|
|
175
203
|
// MARGIN MIXINS
|
|
@@ -180,7 +208,13 @@
|
|
|
180
208
|
* @description Sets margin on all sides
|
|
181
209
|
* @param {Number|String} $val - Margin value
|
|
182
210
|
*/
|
|
183
|
-
@mixin m($val) {
|
|
211
|
+
@mixin m($val) {
|
|
212
|
+
& {
|
|
213
|
+
$val: format-unit-value($val);
|
|
214
|
+
|
|
215
|
+
margin: $val;
|
|
216
|
+
}
|
|
217
|
+
}
|
|
184
218
|
|
|
185
219
|
/**
|
|
186
220
|
* @mixin mx
|
|
@@ -189,9 +223,11 @@
|
|
|
189
223
|
*/
|
|
190
224
|
@mixin mx($val) {
|
|
191
225
|
$val: format-unit-value($val);
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
226
|
+
|
|
227
|
+
& {
|
|
228
|
+
margin-left: $val;
|
|
229
|
+
margin-right: $val;
|
|
230
|
+
}
|
|
195
231
|
}
|
|
196
232
|
|
|
197
233
|
/**
|
|
@@ -202,8 +238,10 @@
|
|
|
202
238
|
@mixin my($val) {
|
|
203
239
|
$val: format-unit-value($val);
|
|
204
240
|
|
|
205
|
-
|
|
206
|
-
|
|
241
|
+
&{
|
|
242
|
+
margin-top: $val;
|
|
243
|
+
margin-bottom: $val;
|
|
244
|
+
}
|
|
207
245
|
}
|
|
208
246
|
|
|
209
247
|
/**
|
|
@@ -211,40 +249,64 @@
|
|
|
211
249
|
* @description Sets margin-top
|
|
212
250
|
* @param {Number|String} $val - Margin value
|
|
213
251
|
*/
|
|
214
|
-
@mixin mt($val) {
|
|
252
|
+
@mixin mt($val) {
|
|
253
|
+
& {
|
|
254
|
+
$val: format-unit-value($val);
|
|
255
|
+
|
|
256
|
+
margin-top: $val;
|
|
257
|
+
}
|
|
258
|
+
}
|
|
215
259
|
|
|
216
260
|
/**
|
|
217
261
|
* @mixin mr
|
|
218
262
|
* @description Sets margin-right
|
|
219
263
|
* @param {Number|String} $val - Margin value
|
|
220
264
|
*/
|
|
221
|
-
@mixin mr($val) {
|
|
265
|
+
@mixin mr($val) {
|
|
266
|
+
& {
|
|
267
|
+
$val: format-unit-value($val);
|
|
268
|
+
|
|
269
|
+
margin-right: $val;
|
|
270
|
+
}
|
|
271
|
+
}
|
|
222
272
|
|
|
223
273
|
/**
|
|
224
274
|
* @mixin mb
|
|
225
275
|
* @description Sets margin-bottom
|
|
226
276
|
* @param {Number|String} $val - Margin value
|
|
227
277
|
*/
|
|
228
|
-
@mixin mb($val) {
|
|
278
|
+
@mixin mb($val) {
|
|
279
|
+
& {
|
|
280
|
+
$val: format-unit-value($val);
|
|
281
|
+
|
|
282
|
+
margin-bottom: $val;
|
|
283
|
+
}
|
|
284
|
+
}
|
|
229
285
|
|
|
230
286
|
/**
|
|
231
287
|
* @mixin ml
|
|
232
288
|
* @description Sets margin-left
|
|
233
289
|
* @param {Number|String} $val - Margin value
|
|
234
290
|
*/
|
|
235
|
-
@mixin ml($val) {
|
|
291
|
+
@mixin ml($val) {
|
|
292
|
+
& {
|
|
293
|
+
$val: format-unit-value($val);
|
|
294
|
+
|
|
295
|
+
margin-left: $val;
|
|
296
|
+
}
|
|
297
|
+
}
|
|
236
298
|
|
|
237
299
|
/**
|
|
238
300
|
* @mixin ml-auto
|
|
239
301
|
* @description Sets margin-left to auto
|
|
240
302
|
*/
|
|
241
|
-
@mixin ml-auto { margin-left: auto; }
|
|
303
|
+
@mixin ml-auto { & { margin-left: auto; } }
|
|
242
304
|
|
|
243
305
|
/**
|
|
244
306
|
* @mixin mr-auto
|
|
245
307
|
* @description Sets margin-right to auto
|
|
246
308
|
*/
|
|
247
|
-
@mixin mr-auto { margin-right: auto; }
|
|
309
|
+
@mixin mr-auto { & { margin-right: auto; } }
|
|
248
310
|
|
|
249
311
|
/**
|
|
250
312
|
* @mixin mx-auto
|