flint-gs 1.6.5 → 1.7.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.
- checksums.yaml +4 -4
- data/README.md +13 -13
- data/lib/flint.rb +64 -4
- data/stylesheets/flint/config/_config.scss +3 -3
- data/stylesheets/flint/functions/_functions.scss +1 -1
- data/stylesheets/flint/functions/helpers/_helpers.scss +32 -23
- data/stylesheets/flint/functions/lib/_calc-breakpoint.scss +11 -11
- data/stylesheets/flint/functions/lib/_calc-margin.scss +40 -12
- data/stylesheets/flint/functions/lib/_calc-width.scss +21 -12
- data/stylesheets/flint/functions/lib/_exists.scss +6 -6
- data/stylesheets/flint/functions/lib/_fluid-width.scss +2 -2
- data/stylesheets/flint/functions/lib/_get-index.scss +3 -3
- data/stylesheets/flint/functions/lib/_get-instance-value.scss +4 -4
- data/stylesheets/flint/functions/lib/_get-value.scss +3 -3
- data/stylesheets/flint/functions/lib/_has-family-instance.scss +74 -0
- data/stylesheets/flint/functions/lib/_instance.scss +17 -15
- data/stylesheets/flint/functions/lib/_last.scss +2 -2
- data/stylesheets/flint/functions/lib/_list-to-string.scss +4 -4
- data/stylesheets/flint/functions/lib/_map-fetch.scss +6 -9
- data/stylesheets/flint/functions/lib/_next-index.scss +3 -3
- data/stylesheets/flint/functions/lib/_purge.scss +2 -2
- data/stylesheets/flint/functions/lib/_remove.scss +4 -4
- data/stylesheets/flint/functions/lib/_replace-substring.scss +21 -15
- data/stylesheets/flint/functions/lib/_replace.scss +3 -3
- data/stylesheets/flint/functions/lib/_steal-key.scss +3 -3
- data/stylesheets/flint/functions/lib/_steal-values.scss +3 -3
- data/stylesheets/flint/functions/lib/_string-to-list.scss +63 -57
- data/stylesheets/flint/functions/lib/_string-to-number.scss +42 -38
- data/stylesheets/flint/functions/lib/_support-syntax-bem.scss +3 -3
- data/stylesheets/flint/functions/lib/_support-syntax.scss +4 -4
- data/stylesheets/flint/functions/lib/_types-in-list.scss +3 -3
- data/stylesheets/flint/functions/lib/_use-syntax.scss +3 -3
- data/stylesheets/flint/globals/_globals.scss +20 -4
- data/stylesheets/flint/mixins/lib/_calculate.scss +368 -563
- data/stylesheets/flint/mixins/lib/_clearfix.scss +7 -7
- data/stylesheets/flint/mixins/lib/_main.scss +244 -244
- data/stylesheets/flint/mixins/lib/_new-instance.scss +20 -20
- data/stylesheets/flint/mixins/lib/_print-instance.scss +14 -14
- metadata +3 -3
- data/stylesheets/flint/functions/lib/_get-family-instance.scss +0 -59
@@ -1,19 +1,19 @@
|
|
1
|
-
// Micro clearfix
|
1
|
+
// Micro flint-clearfix
|
2
2
|
// -------------------------------------------------------------------------------
|
3
3
|
// @documentation http://nicolasgallagher.com/micro-clearfix-hack/
|
4
4
|
// -------------------------------------------------------------------------------
|
5
5
|
|
6
|
-
@mixin clearfix {
|
6
|
+
@mixin flint-clearfix {
|
7
7
|
zoom: 1;
|
8
8
|
|
9
9
|
&:before, &:after {
|
10
|
-
content: "\0020";
|
11
|
-
display: block;
|
12
|
-
height: 0;
|
13
|
-
overflow: hidden;
|
10
|
+
content: "\0020";
|
11
|
+
display: block;
|
12
|
+
height: 0;
|
13
|
+
overflow: hidden;
|
14
14
|
}
|
15
15
|
|
16
16
|
&:after {
|
17
17
|
clear: both;
|
18
18
|
}
|
19
|
-
}
|
19
|
+
}
|
@@ -27,7 +27,7 @@
|
|
27
27
|
@if $key == "foundation" {
|
28
28
|
|
29
29
|
// Apply global border-box-sizing if set to true
|
30
|
-
@if get-value("settings", "border-box-sizing") {
|
30
|
+
@if flint-get-value("settings", "border-box-sizing") {
|
31
31
|
$flint__foundation: "existant" !global;
|
32
32
|
}
|
33
33
|
|
@@ -42,47 +42,47 @@
|
|
42
42
|
}
|
43
43
|
}
|
44
44
|
|
45
|
-
//
|
45
|
+
// flint-clearfix
|
46
46
|
// ----
|
47
47
|
} @else if $key == "clear" {
|
48
48
|
|
49
|
-
@include clearfix();
|
49
|
+
@include flint-clearfix();
|
50
50
|
|
51
51
|
// Instance
|
52
52
|
// ----
|
53
53
|
} @else {
|
54
54
|
|
55
55
|
@if $key == "container"
|
56
|
-
or exists($flint, $key) and $span != null
|
57
|
-
or types-in-list($span, "number") or type-of($span) == "number"
|
58
|
-
or types-in-list($key, "number") or type-of($key) == "number"
|
56
|
+
or flint-exists($flint, $key) and $span != null
|
57
|
+
or flint-types-in-list($span, "number") or type-of($span) == "number"
|
58
|
+
or flint-types-in-list($key, "number") or type-of($key) == "number"
|
59
59
|
{
|
60
60
|
|
61
61
|
// Only apply display rule if the key is either default or container
|
62
|
-
@if is-default($key) or $key == "container" {
|
62
|
+
@if flint-is-default($key) or $key == "container" {
|
63
63
|
|
64
64
|
display: block;
|
65
65
|
|
66
66
|
// Only apply display rule to default breakpoint
|
67
|
-
} @else if length($key) > 1 or is-not-string($key) {
|
67
|
+
} @else if length($key) > 1 or flint-is-not-string($key) {
|
68
68
|
// Loop over all keys, set to default
|
69
69
|
@for $i from 1 through length($flint__all__keys) {
|
70
|
-
$
|
70
|
+
$calc-key: flint-steal-key($i);
|
71
71
|
|
72
|
-
@if is-default($
|
72
|
+
@if flint-is-default($calc-key) {
|
73
73
|
display: block;
|
74
74
|
}
|
75
75
|
}
|
76
76
|
}
|
77
77
|
|
78
78
|
// Apply individually if foundation is not set globally, but is set to true in config
|
79
|
-
@if get-value("settings", "border-box-sizing") and $flint__foundation == "nonexistant" {
|
79
|
+
@if flint-get-value("settings", "border-box-sizing") and $flint__foundation == "nonexistant" {
|
80
80
|
-moz-box-sizing: border-box;
|
81
81
|
-webkit-box-sizing: border-box;
|
82
82
|
box-sizing: border-box;
|
83
83
|
|
84
84
|
// Warn to either set a global foundation, or turn border-box-sizing off
|
85
|
-
@if global-variable-exists(global-foundation-is-set) == false {
|
85
|
+
@if global-variable-exists("global-foundation-is-set") == false {
|
86
86
|
@warn "Global foundation is #{$flint__foundation}. To avoid repeated box-sizing incidents, set a global _(foundation) rule, or turn border-box-sizing to false in your config file.";
|
87
87
|
|
88
88
|
// Declare global variable so only a single warning prints out
|
@@ -101,35 +101,35 @@
|
|
101
101
|
|
102
102
|
// Fixed grid? Output container for each breakpoint
|
103
103
|
// ----
|
104
|
-
@if get-value("settings", "grid") == "fixed" {
|
104
|
+
@if flint-get-value("settings", "grid") == "fixed" {
|
105
105
|
|
106
106
|
@for $i from 1 through length($flint__all__keys) {
|
107
107
|
|
108
108
|
// Set up variables
|
109
|
-
$
|
109
|
+
$calc-key: flint-steal-key($i);
|
110
110
|
$calcContainer: $key;
|
111
111
|
|
112
112
|
// Key is default, no media queries
|
113
|
-
@if is-default($
|
113
|
+
@if flint-is-default($calc-key) {
|
114
114
|
|
115
|
-
width: calc-width($
|
115
|
+
width: flint-calc-width($calc-key, $calcContainer);
|
116
116
|
@content;
|
117
117
|
|
118
118
|
// Not default, wrap in media queries
|
119
119
|
} @else {
|
120
120
|
|
121
121
|
// Highest breakpoint? No max-width
|
122
|
-
@if is-highest-breakpoint($
|
122
|
+
@if flint-is-highest-breakpoint($calc-key) {
|
123
123
|
|
124
|
-
@media only screen and ( min-width: calc-breakpoint("alias", $
|
125
|
-
width: calc-width($
|
124
|
+
@media only screen and ( min-width: flint-calc-breakpoint("alias", $calc-key, $i) ) {
|
125
|
+
width: flint-calc-width($calc-key, $calcContainer);
|
126
126
|
@content;
|
127
127
|
}
|
128
128
|
|
129
129
|
} @else {
|
130
130
|
|
131
|
-
@media only screen and ( min-width: calc-breakpoint("alias", $
|
132
|
-
width: calc-width($
|
131
|
+
@media only screen and ( min-width: flint-calc-breakpoint("alias", $calc-key, $i) ) and ( max-width: (flint-calc-breakpoint("prev", $calc-key, $i) - if(flint-get-config-unit() == "em", flint-to-em(1px), 1)) ) {
|
132
|
+
width: flint-calc-width($calc-key, $calcContainer);
|
133
133
|
@content;
|
134
134
|
}
|
135
135
|
|
@@ -140,21 +140,21 @@
|
|
140
140
|
|
141
141
|
// Check if max-width is set
|
142
142
|
// ----
|
143
|
-
@if get-value("settings", "max-width") {
|
143
|
+
@if flint-get-value("settings", "max-width") {
|
144
144
|
|
145
145
|
// Check if it's an number
|
146
|
-
@if is-number(get-value("settings", "max-width")) {
|
147
|
-
max-width: get-value("settings", "max-width");
|
146
|
+
@if flint-is-number(flint-get-value("settings", "max-width")) {
|
147
|
+
max-width: flint-get-value("settings", "max-width");
|
148
148
|
// Then use highest breakpoint
|
149
149
|
} @else {
|
150
|
-
max-width: max(get-all-breakpoints()...);
|
150
|
+
max-width: max(flint-get-all-breakpoints()...);
|
151
151
|
}
|
152
152
|
|
153
153
|
}
|
154
154
|
|
155
155
|
// Center container is set to true?
|
156
156
|
// ----
|
157
|
-
@if get-value("settings", "center-container") {
|
157
|
+
@if flint-get-value("settings", "center-container") {
|
158
158
|
margin-right: auto;
|
159
159
|
margin-left: auto;
|
160
160
|
} @else {
|
@@ -167,17 +167,17 @@
|
|
167
167
|
} @else {
|
168
168
|
|
169
169
|
// Make sure it's the default, output float
|
170
|
-
@if is-default($key) {
|
170
|
+
@if flint-is-default($key) {
|
171
171
|
|
172
|
-
float: unquote(get-value("settings", "float-style"));
|
172
|
+
float: unquote(flint-get-value("settings", "float-style"));
|
173
173
|
|
174
|
-
} @else if is-list($key) or is-not-string($key) {
|
174
|
+
} @else if flint-is-list($key) or flint-is-not-string($key) {
|
175
175
|
|
176
176
|
@for $i from 1 through length($flint__all__keys) {
|
177
|
-
$
|
177
|
+
$calc-key: flint-steal-key($i);
|
178
178
|
|
179
|
-
@if is-default($
|
180
|
-
float: unquote(get-value("settings", "float-style"));
|
179
|
+
@if flint-is-default($calc-key) {
|
180
|
+
float: unquote(flint-get-value("settings", "float-style"));
|
181
181
|
}
|
182
182
|
}
|
183
183
|
}
|
@@ -191,60 +191,60 @@
|
|
191
191
|
// -------------------------------------------------------------------------------
|
192
192
|
// @output calculated styles
|
193
193
|
|
194
|
-
@if is-number($key) and length($key) == 1 {
|
194
|
+
@if flint-is-number($key) and length($key) == 1 {
|
195
195
|
|
196
196
|
@if $span == null {
|
197
197
|
|
198
198
|
@for $i from 1 through length($flint__all__keys) {
|
199
199
|
|
200
|
-
$
|
201
|
-
$
|
202
|
-
$
|
203
|
-
$
|
204
|
-
$
|
200
|
+
$calc-key: flint-steal-key($i);
|
201
|
+
$calc-span: $key;
|
202
|
+
$calc-context: $span;
|
203
|
+
$calc-gutter: $gutter;
|
204
|
+
$calc-shift: $shift;
|
205
205
|
|
206
|
-
@if is-default($
|
206
|
+
@if flint-is-default($calc-key) {
|
207
207
|
|
208
|
-
@include
|
208
|
+
@include flint-calculate($calc-key, $calc-span, $calc-context, $calc-gutter, $calc-shift, $i) {
|
209
209
|
@content;
|
210
210
|
}
|
211
211
|
|
212
212
|
} @else {
|
213
213
|
|
214
|
-
@if get-value("settings", "grid") == "fluid" {
|
214
|
+
@if flint-get-value("settings", "grid") == "fluid" {
|
215
215
|
|
216
|
-
@if is-highest-breakpoint($
|
216
|
+
@if flint-is-highest-breakpoint($calc-key) {
|
217
217
|
|
218
|
-
@media only screen and ( min-width: (calc-breakpoint("next", $
|
219
|
-
@include
|
218
|
+
@media only screen and ( min-width: (flint-calc-breakpoint("next", $calc-key, $i) + if(flint-get-config-unit() == "em", flint-to-em(1px), 1)) ) {
|
219
|
+
@include flint-calculate($calc-key, $calc-span, $calc-context, $calc-gutter, $calc-shift, $i) {
|
220
220
|
@content;
|
221
221
|
}
|
222
222
|
}
|
223
223
|
|
224
224
|
} @else {
|
225
225
|
|
226
|
-
@media only screen and ( min-width: (calc-breakpoint("next", $
|
227
|
-
@include
|
226
|
+
@media only screen and ( min-width: (flint-calc-breakpoint("next", $calc-key, $i) + if(flint-is-lowest-breakpoint($calc-key), 0, if(flint-get-config-unit() == "em", flint-to-em(1px), 1))) ) and ( max-width: flint-calc-breakpoint("alias", $calc-key, $i) ) {
|
227
|
+
@include flint-calculate($calc-key, $calc-span, $calc-context, $calc-gutter, $calc-shift, $i) {
|
228
228
|
@content;
|
229
229
|
}
|
230
230
|
}
|
231
231
|
|
232
232
|
}
|
233
233
|
|
234
|
-
} @else if get-value("settings", "grid") == "fixed" {
|
234
|
+
} @else if flint-get-value("settings", "grid") == "fixed" {
|
235
235
|
|
236
|
-
@if is-highest-breakpoint($
|
236
|
+
@if flint-is-highest-breakpoint($calc-key) {
|
237
237
|
|
238
|
-
@media only screen and ( min-width: calc-breakpoint("alias", $
|
239
|
-
@include
|
238
|
+
@media only screen and ( min-width: flint-calc-breakpoint("alias", $calc-key, $i) ) {
|
239
|
+
@include flint-calculate($calc-key, $calc-span, $calc-context, $calc-gutter, $calc-shift, $i) {
|
240
240
|
@content;
|
241
241
|
}
|
242
242
|
}
|
243
243
|
|
244
244
|
} @else {
|
245
245
|
|
246
|
-
@media only screen and ( min-width: calc-breakpoint("alias", $
|
247
|
-
@include
|
246
|
+
@media only screen and ( min-width: flint-calc-breakpoint("alias", $calc-key, $i) ) and ( max-width: (flint-calc-breakpoint("prev", $calc-key, $i) - if(flint-get-config-unit() == "em", flint-to-em(1px), 1)) ) {
|
247
|
+
@include flint-calculate($calc-key, $calc-span, $calc-context, $calc-gutter, $calc-shift, $i) {
|
248
248
|
@content;
|
249
249
|
}
|
250
250
|
}
|
@@ -252,7 +252,7 @@
|
|
252
252
|
}
|
253
253
|
|
254
254
|
} @else {
|
255
|
-
@warn "Invalid gutter settings in config map: #{get-value('settings', 'grid')}. Valid arguments: fluid | fixed";
|
255
|
+
@warn "Invalid gutter settings in config map: #{flint-get-value('settings', 'grid')}. Valid arguments: fluid | fixed";
|
256
256
|
}
|
257
257
|
}
|
258
258
|
}
|
@@ -264,58 +264,58 @@
|
|
264
264
|
// -------------------------------------------------------------------------------
|
265
265
|
// @output calculated styles
|
266
266
|
|
267
|
-
} @else if length($span) == 1 and is-number($span) or $span == "auto" {
|
267
|
+
} @else if length($span) == 1 and flint-is-number($span) or $span == "auto" {
|
268
268
|
|
269
269
|
@for $i from 1 through length($flint__all__keys) {
|
270
270
|
|
271
|
-
$
|
272
|
-
$
|
273
|
-
$
|
274
|
-
$
|
275
|
-
$
|
271
|
+
$calc-key: flint-steal-key($i);
|
272
|
+
$calc-span: $key;
|
273
|
+
$calc-context: $span;
|
274
|
+
$calc-gutter: $gutter;
|
275
|
+
$calc-shift: $shift;
|
276
276
|
|
277
|
-
@if is-default($
|
277
|
+
@if flint-is-default($calc-key) {
|
278
278
|
|
279
|
-
@include
|
279
|
+
@include flint-calculate ($calc-key, $calc-span, $calc-context, $calc-gutter, $calc-shift, $i) {
|
280
280
|
@content;
|
281
281
|
}
|
282
282
|
|
283
283
|
} @else {
|
284
284
|
|
285
|
-
@if get-value("settings", "grid") == "fluid" {
|
285
|
+
@if flint-get-value("settings", "grid") == "fluid" {
|
286
286
|
|
287
|
-
@if is-highest-breakpoint($
|
287
|
+
@if flint-is-highest-breakpoint($calc-key) {
|
288
288
|
|
289
|
-
@media only screen and ( min-width: (calc-breakpoint("next", $
|
290
|
-
@include
|
289
|
+
@media only screen and ( min-width: (flint-calc-breakpoint("next", $calc-key, $i) + if(flint-get-config-unit() == "em", flint-to-em(1px), 1)) ) {
|
290
|
+
@include flint-calculate($calc-key, $calc-span, $calc-context, $calc-gutter, $calc-shift, $i) {
|
291
291
|
@content;
|
292
292
|
}
|
293
293
|
}
|
294
294
|
|
295
295
|
} @else {
|
296
296
|
|
297
|
-
@media only screen and ( min-width: (calc-breakpoint("next", $
|
298
|
-
@include
|
297
|
+
@media only screen and ( min-width: (flint-calc-breakpoint("next", $calc-key, $i) + if(flint-is-lowest-breakpoint($calc-key), 0, if(flint-get-config-unit() == "em", flint-to-em(1px), 1))) ) and ( max-width: flint-calc-breakpoint("alias", $calc-key, $i) ) {
|
298
|
+
@include flint-calculate($calc-key, $calc-span, $calc-context, $calc-gutter, $calc-shift, $i) {
|
299
299
|
@content;
|
300
300
|
}
|
301
301
|
}
|
302
302
|
|
303
303
|
}
|
304
304
|
|
305
|
-
} @else if get-value("settings", "grid") == "fixed" {
|
305
|
+
} @else if flint-get-value("settings", "grid") == "fixed" {
|
306
306
|
|
307
|
-
@if is-highest-breakpoint($
|
307
|
+
@if flint-is-highest-breakpoint($calc-key) {
|
308
308
|
|
309
|
-
@media only screen and ( min-width: calc-breakpoint("alias", $
|
310
|
-
@include
|
309
|
+
@media only screen and ( min-width: flint-calc-breakpoint("alias", $calc-key, $i) ) {
|
310
|
+
@include flint-calculate($calc-key, $calc-span, $calc-context, $calc-gutter, $calc-shift, $i) {
|
311
311
|
@content;
|
312
312
|
}
|
313
313
|
}
|
314
314
|
|
315
315
|
} @else {
|
316
316
|
|
317
|
-
@media only screen and ( min-width: calc-breakpoint("alias", $
|
318
|
-
@include
|
317
|
+
@media only screen and ( min-width: flint-calc-breakpoint("alias", $calc-key, $i) ) and ( max-width: (flint-calc-breakpoint("prev", $calc-key, $i) - if(flint-get-config-unit() == "em", flint-to-em(1px), 1)) ) {
|
318
|
+
@include flint-calculate($calc-key, $calc-span, $calc-context, $calc-gutter, $calc-shift, $i) {
|
319
319
|
@content;
|
320
320
|
}
|
321
321
|
}
|
@@ -323,7 +323,7 @@
|
|
323
323
|
}
|
324
324
|
|
325
325
|
} @else {
|
326
|
-
@warn "Invalid gutter settings in config map: #{get-value('settings', 'grid')}. Valid arguments: fluid | fixed";
|
326
|
+
@warn "Invalid gutter settings in config map: #{flint-get-value('settings', 'grid')}. Valid arguments: fluid | fixed";
|
327
327
|
}
|
328
328
|
}
|
329
329
|
}
|
@@ -337,7 +337,7 @@
|
|
337
337
|
// -------------------------------------------------------------------------------
|
338
338
|
// @output calculated styles
|
339
339
|
|
340
|
-
} @else if types-in-list($span, "number") or $span == "auto" {
|
340
|
+
} @else if flint-types-in-list($span, "number") or $span == "auto" {
|
341
341
|
|
342
342
|
@if length($span) != length($flint__all__keys) and $span != "auto" {
|
343
343
|
@warn "Invalid argument length for context: #{length($span)} of #{length($flint__all__keys)}. Please provide an argument for each breakpoint in your config. Your argument was: #{$span}";
|
@@ -345,54 +345,54 @@
|
|
345
345
|
|
346
346
|
@for $i from 1 through length($flint__all__keys) {
|
347
347
|
|
348
|
-
$
|
349
|
-
$
|
350
|
-
$
|
351
|
-
$
|
352
|
-
$
|
348
|
+
$calc-key: flint-steal-key($i);
|
349
|
+
$calc-span: $key;
|
350
|
+
$calc-context: $span;
|
351
|
+
$calc-gutter: $gutter;
|
352
|
+
$calc-shift: $shift;
|
353
353
|
|
354
|
-
@if is-default($
|
354
|
+
@if flint-is-default($calc-key) {
|
355
355
|
|
356
|
-
@include
|
356
|
+
@include flint-calculate ($calc-key, $calc-span, $calc-context, $calc-gutter, $calc-shift, $i) {
|
357
357
|
@content;
|
358
358
|
}
|
359
359
|
|
360
360
|
} @else {
|
361
361
|
|
362
|
-
@if get-value("settings", "grid") == "fluid" {
|
362
|
+
@if flint-get-value("settings", "grid") == "fluid" {
|
363
363
|
|
364
|
-
@if is-highest-breakpoint($
|
364
|
+
@if flint-is-highest-breakpoint($calc-key) {
|
365
365
|
|
366
|
-
@media only screen and ( min-width: (calc-breakpoint("next", $
|
367
|
-
@include
|
366
|
+
@media only screen and ( min-width: (flint-calc-breakpoint("next", $calc-key, $i) + if(flint-get-config-unit() == "em", flint-to-em(1px), 1)) ) {
|
367
|
+
@include flint-calculate($calc-key, $calc-span, $calc-context, $calc-gutter, $calc-shift, $i) {
|
368
368
|
@content;
|
369
369
|
}
|
370
370
|
}
|
371
371
|
|
372
372
|
} @else {
|
373
373
|
|
374
|
-
@media only screen and ( min-width: (calc-breakpoint("next", $
|
375
|
-
@include
|
374
|
+
@media only screen and ( min-width: (flint-calc-breakpoint("next", $calc-key, $i) + if(flint-is-lowest-breakpoint($calc-key), 0, if(flint-get-config-unit() == "em", flint-to-em(1px), 1))) ) and ( max-width: flint-calc-breakpoint("alias", $calc-key, $i) ) {
|
375
|
+
@include flint-calculate($calc-key, $calc-span, $calc-context, $calc-gutter, $calc-shift, $i) {
|
376
376
|
@content;
|
377
377
|
}
|
378
378
|
}
|
379
379
|
|
380
380
|
}
|
381
381
|
|
382
|
-
} @else if get-value("settings", "grid") == "fixed" {
|
382
|
+
} @else if flint-get-value("settings", "grid") == "fixed" {
|
383
383
|
|
384
|
-
@if is-highest-breakpoint($
|
384
|
+
@if flint-is-highest-breakpoint($calc-key) {
|
385
385
|
|
386
|
-
@media only screen and ( min-width: calc-breakpoint("alias", $
|
387
|
-
@include
|
386
|
+
@media only screen and ( min-width: flint-calc-breakpoint("alias", $calc-key, $i) ) {
|
387
|
+
@include flint-calculate($calc-key, $calc-span, $calc-context, $calc-gutter, $calc-shift, $i) {
|
388
388
|
@content;
|
389
389
|
}
|
390
390
|
}
|
391
391
|
|
392
392
|
} @else {
|
393
393
|
|
394
|
-
@media only screen and ( min-width: calc-breakpoint("alias", $
|
395
|
-
@include
|
394
|
+
@media only screen and ( min-width: flint-calc-breakpoint("alias", $calc-key, $i) ) and ( max-width: (flint-calc-breakpoint("prev", $calc-key, $i) - if(flint-get-config-unit() == "em", flint-to-em(1px), 1)) ) {
|
395
|
+
@include flint-calculate($calc-key, $calc-span, $calc-context, $calc-gutter, $calc-shift, $i) {
|
396
396
|
@content;
|
397
397
|
}
|
398
398
|
}
|
@@ -400,7 +400,7 @@
|
|
400
400
|
}
|
401
401
|
|
402
402
|
} @else {
|
403
|
-
@warn "Invalid gutter settings in config map: #{get-value('settings', 'grid')}. Valid arguments: fluid | fixed";
|
403
|
+
@warn "Invalid gutter settings in config map: #{flint-get-value('settings', 'grid')}. Valid arguments: fluid | fixed";
|
404
404
|
}
|
405
405
|
}
|
406
406
|
}
|
@@ -416,7 +416,7 @@
|
|
416
416
|
// -------------------------------------------------------------------------------
|
417
417
|
// @output calculated styles
|
418
418
|
|
419
|
-
} @else if types-in-list($key, "number") and $span == null {
|
419
|
+
} @else if flint-types-in-list($key, "number") and $span == null {
|
420
420
|
|
421
421
|
@if length($key) != length($flint__all__keys) {
|
422
422
|
@warn "Invalid argument length for column: #{length($key)} of #{length($flint__all__keys)}. Please provide an argument for each breakpoint in your config. Your argument was: #{$key}";
|
@@ -424,54 +424,54 @@
|
|
424
424
|
|
425
425
|
@for $i from 1 through length($flint__all__keys) {
|
426
426
|
|
427
|
-
$
|
428
|
-
$
|
429
|
-
$
|
430
|
-
$
|
431
|
-
$
|
427
|
+
$calc-key: flint-steal-key($i);
|
428
|
+
$calc-span: $key;
|
429
|
+
$calc-context: $context;
|
430
|
+
$calc-gutter: $gutter;
|
431
|
+
$calc-shift: $shift;
|
432
432
|
|
433
|
-
@if is-default($
|
433
|
+
@if flint-is-default($calc-key) {
|
434
434
|
|
435
|
-
@include
|
435
|
+
@include flint-calculate ($calc-key, $calc-span, $calc-context, $calc-gutter, $calc-shift, $i) {
|
436
436
|
@content;
|
437
437
|
}
|
438
438
|
|
439
439
|
} @else {
|
440
440
|
|
441
|
-
@if get-value("settings", "grid") == "fluid" {
|
441
|
+
@if flint-get-value("settings", "grid") == "fluid" {
|
442
442
|
|
443
|
-
@if is-highest-breakpoint($
|
443
|
+
@if flint-is-highest-breakpoint($calc-key) {
|
444
444
|
|
445
|
-
@media only screen and ( min-width: (calc-breakpoint("next", $
|
446
|
-
@include
|
445
|
+
@media only screen and ( min-width: (flint-calc-breakpoint("next", $calc-key, $i) + if(flint-get-config-unit() == "em", flint-to-em(1px), 1)) ) {
|
446
|
+
@include flint-calculate($calc-key, $calc-span, $calc-context, $calc-gutter, $calc-shift, $i) {
|
447
447
|
@content;
|
448
448
|
}
|
449
449
|
}
|
450
450
|
|
451
451
|
} @else {
|
452
452
|
|
453
|
-
@media only screen and ( min-width: (calc-breakpoint("next", $
|
454
|
-
@include
|
453
|
+
@media only screen and ( min-width: (flint-calc-breakpoint("next", $calc-key, $i) + if(flint-is-lowest-breakpoint($calc-key), 0, if(flint-get-config-unit() == "em", flint-to-em(1px), 1))) ) and ( max-width: flint-calc-breakpoint("alias", $calc-key, $i) ) {
|
454
|
+
@include flint-calculate($calc-key, $calc-span, $calc-context, $calc-gutter, $calc-shift, $i) {
|
455
455
|
@content;
|
456
456
|
}
|
457
457
|
}
|
458
458
|
|
459
459
|
}
|
460
460
|
|
461
|
-
} @else if get-value("settings", "grid") == "fixed" {
|
461
|
+
} @else if flint-get-value("settings", "grid") == "fixed" {
|
462
462
|
|
463
|
-
@if is-highest-breakpoint($
|
463
|
+
@if flint-is-highest-breakpoint($calc-key) {
|
464
464
|
|
465
|
-
@media only screen and ( min-width: calc-breakpoint("alias", $
|
466
|
-
@include
|
465
|
+
@media only screen and ( min-width: flint-calc-breakpoint("alias", $calc-key, $i) ) {
|
466
|
+
@include flint-calculate($calc-key, $calc-span, $calc-context, $calc-gutter, $calc-shift, $i) {
|
467
467
|
@content;
|
468
468
|
}
|
469
469
|
}
|
470
470
|
|
471
471
|
} @else {
|
472
472
|
|
473
|
-
@media only screen and ( min-width: calc-breakpoint("alias", $
|
474
|
-
@include
|
473
|
+
@media only screen and ( min-width: flint-calc-breakpoint("alias", $calc-key, $i) ) and ( max-width: (flint-calc-breakpoint("prev", $calc-key, $i) - if(flint-get-config-unit() == "em", flint-to-em(1px), 1)) ) {
|
474
|
+
@include flint-calculate($calc-key, $calc-span, $calc-context, $calc-gutter, $calc-shift, $i) {
|
475
475
|
@content;
|
476
476
|
}
|
477
477
|
}
|
@@ -479,7 +479,7 @@
|
|
479
479
|
}
|
480
480
|
|
481
481
|
} @else {
|
482
|
-
@warn "Invalid gutter settings in config map: #{get-value('settings', 'grid')}. Valid arguments: fluid | fixed";
|
482
|
+
@warn "Invalid gutter settings in config map: #{flint-get-value('settings', 'grid')}. Valid arguments: fluid | fixed";
|
483
483
|
}
|
484
484
|
}
|
485
485
|
}
|
@@ -494,7 +494,7 @@
|
|
494
494
|
// -------------------------------------------------------------------------------
|
495
495
|
// @output calculated styles
|
496
496
|
|
497
|
-
} @else if types-in-list($key, "number") and types-in-list($span, "number") or $span == "auto" {
|
497
|
+
} @else if flint-types-in-list($key, "number") and flint-types-in-list($span, "number") or $span == "auto" {
|
498
498
|
|
499
499
|
@if length($key) != length($flint__all__keys) {
|
500
500
|
@warn "Invalid argument length for column: #{length($key)} of #{length($flint__all__keys)}. Please provide an argument for each breakpoint in your config. Your argument was: #{$key}";
|
@@ -504,54 +504,54 @@
|
|
504
504
|
|
505
505
|
@for $i from 1 through length($flint__all__keys) {
|
506
506
|
|
507
|
-
$
|
508
|
-
$
|
509
|
-
$
|
510
|
-
$
|
511
|
-
$
|
507
|
+
$calc-key: flint-steal-key($i);
|
508
|
+
$calc-span: $key;
|
509
|
+
$calc-context: $span;
|
510
|
+
$calc-gutter: $gutter;
|
511
|
+
$calc-shift: $shift;
|
512
512
|
|
513
|
-
@if is-default($
|
513
|
+
@if flint-is-default($calc-key) {
|
514
514
|
|
515
|
-
@include
|
515
|
+
@include flint-calculate ($calc-key, $calc-span, $calc-context, $calc-gutter, $calc-shift, $i) {
|
516
516
|
@content;
|
517
517
|
}
|
518
518
|
|
519
519
|
} @else {
|
520
520
|
|
521
|
-
@if get-value("settings", "grid") == "fluid" {
|
521
|
+
@if flint-get-value("settings", "grid") == "fluid" {
|
522
522
|
|
523
|
-
@if is-highest-breakpoint($
|
523
|
+
@if flint-is-highest-breakpoint($calc-key) {
|
524
524
|
|
525
|
-
@media only screen and ( min-width: (calc-breakpoint("next", $
|
526
|
-
@include
|
525
|
+
@media only screen and ( min-width: (flint-calc-breakpoint("next", $calc-key, $i) + if(flint-get-config-unit() == "em", flint-to-em(1px), 1)) ) {
|
526
|
+
@include flint-calculate($calc-key, $calc-span, $calc-context, $calc-gutter, $calc-shift, $i) {
|
527
527
|
@content;
|
528
528
|
}
|
529
529
|
}
|
530
530
|
|
531
531
|
} @else {
|
532
532
|
|
533
|
-
@media only screen and ( min-width: (calc-breakpoint("next", $
|
534
|
-
@include
|
533
|
+
@media only screen and ( min-width: (flint-calc-breakpoint("next", $calc-key, $i) + if(flint-is-lowest-breakpoint($calc-key), 0, if(flint-get-config-unit() == "em", flint-to-em(1px), 1))) ) and ( max-width: flint-calc-breakpoint("alias", $calc-key, $i) ) {
|
534
|
+
@include flint-calculate($calc-key, $calc-span, $calc-context, $calc-gutter, $calc-shift, $i) {
|
535
535
|
@content;
|
536
536
|
}
|
537
537
|
}
|
538
538
|
|
539
539
|
}
|
540
540
|
|
541
|
-
} @else if get-value("settings", "grid") == "fixed" {
|
541
|
+
} @else if flint-get-value("settings", "grid") == "fixed" {
|
542
542
|
|
543
|
-
@if is-highest-breakpoint($
|
543
|
+
@if flint-is-highest-breakpoint($calc-key) {
|
544
544
|
|
545
|
-
@media only screen and ( min-width: calc-breakpoint("alias", $
|
546
|
-
@include
|
545
|
+
@media only screen and ( min-width: flint-calc-breakpoint("alias", $calc-key, $i) ) {
|
546
|
+
@include flint-calculate($calc-key, $calc-span, $calc-context, $calc-gutter, $calc-shift, $i) {
|
547
547
|
@content;
|
548
548
|
}
|
549
549
|
}
|
550
550
|
|
551
551
|
} @else {
|
552
552
|
|
553
|
-
@media only screen and ( min-width: calc-breakpoint("alias", $
|
554
|
-
@include
|
553
|
+
@media only screen and ( min-width: flint-calc-breakpoint("alias", $calc-key, $i) ) and ( max-width: (flint-calc-breakpoint("prev", $calc-key, $i) - if(flint-get-config-unit() == "em", flint-to-em(1px), 1)) ) {
|
554
|
+
@include flint-calculate($calc-key, $calc-span, $calc-context, $calc-gutter, $calc-shift, $i) {
|
555
555
|
@content;
|
556
556
|
}
|
557
557
|
}
|
@@ -559,7 +559,7 @@
|
|
559
559
|
}
|
560
560
|
|
561
561
|
} @else {
|
562
|
-
@warn "Invalid gutter settings in config map: #{get-value('settings', 'grid')}. Valid arguments: fluid | fixed";
|
562
|
+
@warn "Invalid gutter settings in config map: #{flint-get-value('settings', 'grid')}. Valid arguments: fluid | fixed";
|
563
563
|
}
|
564
564
|
}
|
565
565
|
}
|
@@ -572,56 +572,56 @@
|
|
572
572
|
// -------------------------------------------------------------------------------
|
573
573
|
// @output calculated styles
|
574
574
|
|
575
|
-
} @else if exists($flint, $key) and is-number($span) and $context == null {
|
575
|
+
} @else if flint-exists($flint, $key) and flint-is-number($span) and $context == null {
|
576
576
|
|
577
|
-
$
|
578
|
-
$
|
579
|
-
$
|
580
|
-
$
|
581
|
-
$
|
577
|
+
$calc-key: $key;
|
578
|
+
$calc-span: $span;
|
579
|
+
$calc-context: $context;
|
580
|
+
$calc-gutter: $gutter;
|
581
|
+
$calc-shift: $shift;
|
582
582
|
|
583
|
-
@if is-default($
|
583
|
+
@if flint-is-default($calc-key) {
|
584
584
|
|
585
|
-
@include
|
585
|
+
@include flint-calculate ($calc-key, $calc-span, $calc-context, $calc-gutter, $calc-shift) {
|
586
586
|
@content;
|
587
587
|
}
|
588
588
|
|
589
589
|
} @else {
|
590
590
|
|
591
|
-
@if get-value("settings", "grid") == "fluid" {
|
591
|
+
@if flint-get-value("settings", "grid") == "fluid" {
|
592
592
|
|
593
|
-
@if is-highest-breakpoint($
|
593
|
+
@if flint-is-highest-breakpoint($calc-key) {
|
594
594
|
|
595
|
-
@media only screen and ( min-width: (calc-breakpoint("next", $
|
596
|
-
@include
|
595
|
+
@media only screen and ( min-width: (flint-calc-breakpoint("next", $calc-key, flint-get-index($calc-key)) + if(flint-get-config-unit() == "em", flint-to-em(1px), 1)) ) {
|
596
|
+
@include flint-calculate($calc-key, $calc-span, $calc-context, $calc-gutter, $calc-shift) {
|
597
597
|
@content;
|
598
598
|
}
|
599
599
|
}
|
600
600
|
|
601
601
|
} @else {
|
602
602
|
|
603
|
-
@media only screen and ( min-width: (calc-breakpoint("next", $
|
604
|
-
@include
|
603
|
+
@media only screen and ( min-width: (flint-calc-breakpoint("next", $calc-key, flint-get-index($calc-key)) + if(flint-is-lowest-breakpoint($calc-key), 0, if(flint-get-config-unit() == "em", flint-to-em(1px), 1))) ) and ( max-width: flint-calc-breakpoint("alias", $calc-key, flint-get-index($calc-key)) ) {
|
604
|
+
@include flint-calculate($calc-key, $calc-span, $calc-context, $calc-gutter, $calc-shift) {
|
605
605
|
@content;
|
606
606
|
}
|
607
607
|
}
|
608
608
|
|
609
609
|
}
|
610
610
|
|
611
|
-
} @else if get-value("settings", "grid") == "fixed" {
|
611
|
+
} @else if flint-get-value("settings", "grid") == "fixed" {
|
612
612
|
|
613
|
-
@if is-highest-breakpoint($
|
613
|
+
@if flint-is-highest-breakpoint($calc-key) {
|
614
614
|
|
615
|
-
@media only screen and ( min-width: calc-breakpoint("alias", $
|
616
|
-
@include
|
615
|
+
@media only screen and ( min-width: flint-calc-breakpoint("alias", $calc-key, flint-get-index($calc-key)) ) {
|
616
|
+
@include flint-calculate($calc-key, $calc-span, $calc-context, $calc-gutter, $calc-shift) {
|
617
617
|
@content;
|
618
618
|
}
|
619
619
|
}
|
620
620
|
|
621
621
|
} @else {
|
622
622
|
|
623
|
-
@media only screen and ( min-width: calc-breakpoint("alias", $
|
624
|
-
@include
|
623
|
+
@media only screen and ( min-width: flint-calc-breakpoint("alias", $calc-key, flint-get-index($calc-key)) ) and ( max-width: (flint-calc-breakpoint("prev", $calc-key, flint-get-index($calc-key)) - if(flint-get-config-unit() == "em", flint-to-em(1px), 1)) ) {
|
624
|
+
@include flint-calculate($calc-key, $calc-span, $calc-context, $calc-gutter, $calc-shift) {
|
625
625
|
@content;
|
626
626
|
}
|
627
627
|
}
|
@@ -629,7 +629,7 @@
|
|
629
629
|
}
|
630
630
|
|
631
631
|
} @else {
|
632
|
-
@warn "Invalid gutter settings in config map: #{get-value('settings', 'grid')}. Valid arguments: fluid | fixed";
|
632
|
+
@warn "Invalid gutter settings in config map: #{flint-get-value('settings', 'grid')}. Valid arguments: fluid | fixed";
|
633
633
|
}
|
634
634
|
}
|
635
635
|
|
@@ -641,56 +641,56 @@
|
|
641
641
|
// -------------------------------------------------------------------------------
|
642
642
|
// @output calculated styles
|
643
643
|
|
644
|
-
} @else if exists($flint, $key) and is-number($span) and is-number($context) or $context == "auto" {
|
644
|
+
} @else if flint-exists($flint, $key) and flint-is-number($span) and flint-is-number($context) or $context == "auto" {
|
645
645
|
|
646
|
-
$
|
647
|
-
$
|
648
|
-
$
|
649
|
-
$
|
650
|
-
$
|
646
|
+
$calc-key: $key;
|
647
|
+
$calc-span: $span;
|
648
|
+
$calc-context: $context;
|
649
|
+
$calc-gutter: $gutter;
|
650
|
+
$calc-shift: $shift;
|
651
651
|
|
652
|
-
@if is-default($
|
652
|
+
@if flint-is-default($calc-key) {
|
653
653
|
|
654
|
-
@include
|
654
|
+
@include flint-calculate ($calc-key, $calc-span, $calc-context, $calc-gutter, $calc-shift) {
|
655
655
|
@content;
|
656
656
|
}
|
657
657
|
|
658
658
|
} @else {
|
659
659
|
|
660
|
-
@if get-value("settings", "grid") == "fluid" {
|
660
|
+
@if flint-get-value("settings", "grid") == "fluid" {
|
661
661
|
|
662
|
-
@if is-highest-breakpoint($
|
662
|
+
@if flint-is-highest-breakpoint($calc-key) {
|
663
663
|
|
664
|
-
@media only screen and ( min-width: (calc-breakpoint("next", $
|
665
|
-
@include
|
664
|
+
@media only screen and ( min-width: (flint-calc-breakpoint("next", $calc-key, flint-get-index($calc-key)) + if(flint-get-config-unit() == "em", flint-to-em(1px), 1)) ) {
|
665
|
+
@include flint-calculate($calc-key, $calc-span, $calc-context, $calc-gutter, $calc-shift) {
|
666
666
|
@content;
|
667
667
|
}
|
668
668
|
}
|
669
669
|
|
670
670
|
} @else {
|
671
671
|
|
672
|
-
@media only screen and ( min-width: (calc-breakpoint("next", $
|
673
|
-
@include
|
672
|
+
@media only screen and ( min-width: (flint-calc-breakpoint("next", $calc-key, flint-get-index($calc-key)) + if(flint-is-lowest-breakpoint($calc-key), 0, if(flint-get-config-unit() == "em", flint-to-em(1px), 1))) ) and ( max-width: flint-calc-breakpoint("alias", $calc-key, flint-get-index($calc-key)) ) {
|
673
|
+
@include flint-calculate($calc-key, $calc-span, $calc-context, $calc-gutter, $calc-shift) {
|
674
674
|
@content;
|
675
675
|
}
|
676
676
|
}
|
677
677
|
|
678
678
|
}
|
679
679
|
|
680
|
-
} @else if get-value("settings", "grid") == "fixed" {
|
680
|
+
} @else if flint-get-value("settings", "grid") == "fixed" {
|
681
681
|
|
682
|
-
@if is-highest-breakpoint($
|
682
|
+
@if flint-is-highest-breakpoint($calc-key) {
|
683
683
|
|
684
|
-
@media only screen and ( min-width: calc-breakpoint("alias", $
|
685
|
-
@include
|
684
|
+
@media only screen and ( min-width: flint-calc-breakpoint("alias", $calc-key, flint-get-index($calc-key)) ) {
|
685
|
+
@include flint-calculate($calc-key, $calc-span, $calc-context, $calc-gutter, $calc-shift) {
|
686
686
|
@content;
|
687
687
|
}
|
688
688
|
}
|
689
689
|
|
690
690
|
} @else {
|
691
691
|
|
692
|
-
@media only screen and ( min-width: calc-breakpoint("alias", $
|
693
|
-
@include
|
692
|
+
@media only screen and ( min-width: flint-calc-breakpoint("alias", $calc-key, flint-get-index($calc-key)) ) and ( max-width: (flint-calc-breakpoint("prev", $calc-key, flint-get-index($calc-key)) - if(flint-get-config-unit() == "em", flint-to-em(1px), 1)) ) {
|
693
|
+
@include flint-calculate($calc-key, $calc-span, $calc-context, $calc-gutter, $calc-shift) {
|
694
694
|
@content;
|
695
695
|
}
|
696
696
|
}
|
@@ -698,7 +698,7 @@
|
|
698
698
|
}
|
699
699
|
|
700
700
|
} @else {
|
701
|
-
@warn "Invalid gutter settings in config map: #{get-value('settings', 'grid')}. Valid arguments: fluid | fixed";
|
701
|
+
@warn "Invalid gutter settings in config map: #{flint-get-value('settings', 'grid')}. Valid arguments: fluid | fixed";
|
702
702
|
}
|
703
703
|
}
|
704
704
|
|
@@ -708,7 +708,7 @@
|
|
708
708
|
// -------------------------------------------------------------------------------
|
709
709
|
// @output styles wrapped in media query
|
710
710
|
|
711
|
-
} @else if exists($flint, $key) or is-list($key) and $span == null and $context == null {
|
711
|
+
} @else if flint-exists($flint, $key) or flint-is-list($key) and $span == null and $context == null {
|
712
712
|
|
713
713
|
// Call $key breakpoint by alias
|
714
714
|
// -------------------------------------------------------------------------------
|
@@ -717,28 +717,28 @@
|
|
717
717
|
|
718
718
|
@if length($key) == 1 {
|
719
719
|
|
720
|
-
@if get-value("settings", "grid") == "fluid" {
|
721
|
-
@if is-highest-breakpoint($key) {
|
722
|
-
@media only screen and ( min-width: (calc-breakpoint("next", $key, get-index($key)) + if(get-config-unit() == "em", em(1px), 1)) ) {
|
720
|
+
@if flint-get-value("settings", "grid") == "fluid" {
|
721
|
+
@if flint-is-highest-breakpoint($key) {
|
722
|
+
@media only screen and ( min-width: (flint-calc-breakpoint("next", $key, flint-get-index($key)) + if(flint-get-config-unit() == "em", flint-to-em(1px), 1)) ) {
|
723
723
|
@content;
|
724
724
|
}
|
725
725
|
} @else {
|
726
|
-
@media only screen and ( min-width: (calc-breakpoint("next", $key, get-index($key)) + if(is-lowest-breakpoint($key), 0, if(get-config-unit() == "em", em(1px), 1))) ) and ( max-width: calc-breakpoint("alias", $key, get-index($key)) ) {
|
726
|
+
@media only screen and ( min-width: (flint-calc-breakpoint("next", $key, flint-get-index($key)) + if(flint-is-lowest-breakpoint($key), 0, if(flint-get-config-unit() == "em", flint-to-em(1px), 1))) ) and ( max-width: flint-calc-breakpoint("alias", $key, flint-get-index($key)) ) {
|
727
727
|
@content;
|
728
728
|
}
|
729
729
|
}
|
730
|
-
} @else if get-value("settings", "grid") == "fixed" {
|
731
|
-
@if is-highest-breakpoint($key) {
|
732
|
-
@media only screen and ( min-width: calc-breakpoint("alias", $key, get-index($key)) ) {
|
730
|
+
} @else if flint-get-value("settings", "grid") == "fixed" {
|
731
|
+
@if flint-is-highest-breakpoint($key) {
|
732
|
+
@media only screen and ( min-width: flint-calc-breakpoint("alias", $key, flint-get-index($key)) ) {
|
733
733
|
@content;
|
734
734
|
}
|
735
735
|
} @else {
|
736
|
-
@media only screen and ( min-width: calc-breakpoint("alias", $key, get-index($key)) ) and ( max-width: (calc-breakpoint("prev", $key, get-index($key)) - 1) ) {
|
736
|
+
@media only screen and ( min-width: flint-calc-breakpoint("alias", $key, flint-get-index($key)) ) and ( max-width: (flint-calc-breakpoint("prev", $key, flint-get-index($key)) - 1) ) {
|
737
737
|
@content;
|
738
738
|
}
|
739
739
|
}
|
740
740
|
} @else {
|
741
|
-
@warn "Invalid gutter settings in config map: #{get-value('settings', 'grid')}. Valid arguments: fluid | fixed";
|
741
|
+
@warn "Invalid gutter settings in config map: #{flint-get-value('settings', 'grid')}. Valid arguments: fluid | fixed";
|
742
742
|
}
|
743
743
|
|
744
744
|
// From $key breakpoint to infinity
|
@@ -746,18 +746,18 @@
|
|
746
746
|
// @param $key [from key to infinity] : min-width from $key breakpoint
|
747
747
|
// -------------------------------------------------------------------------------
|
748
748
|
|
749
|
-
} @else if types-in-list($key, "string", 4) and nth($key, 1) == "from" and nth($key, 3) == "to" and nth($key, 4) == "infinity" {
|
749
|
+
} @else if flint-types-in-list($key, "string", 4) and nth($key, 1) == "from" and nth($key, 3) == "to" and nth($key, 4) == "infinity" {
|
750
750
|
|
751
|
-
@if get-value("settings", "grid") == "fluid" {
|
752
|
-
@media only screen and ( min-width: (calc-breakpoint("next", nth($key, 2), get-index(nth($key, 2))) + if(is-lowest-breakpoint(nth($key, 2)), 0, if(get-config-unit() == "em", em(1px), 1))) ) {
|
751
|
+
@if flint-get-value("settings", "grid") == "fluid" {
|
752
|
+
@media only screen and ( min-width: (flint-calc-breakpoint("next", nth($key, 2), flint-get-index(nth($key, 2))) + if(flint-is-lowest-breakpoint(nth($key, 2)), 0, if(flint-get-config-unit() == "em", flint-to-em(1px), 1))) ) {
|
753
753
|
@content;
|
754
754
|
}
|
755
|
-
} @else if get-value("settings", "grid") == "fixed" {
|
756
|
-
@media only screen and ( min-width: calc-breakpoint("alias", nth($key, 2), get-index(nth($key, 2))) ) {
|
755
|
+
} @else if flint-get-value("settings", "grid") == "fixed" {
|
756
|
+
@media only screen and ( min-width: flint-calc-breakpoint("alias", nth($key, 2), flint-get-index(nth($key, 2))) ) {
|
757
757
|
@content;
|
758
758
|
}
|
759
759
|
} @else {
|
760
|
-
@warn "Invalid gutter settings in config map: #{get-value('settings', 'grid')}. Valid arguments: fluid | fixed";
|
760
|
+
@warn "Invalid gutter settings in config map: #{flint-get-value('settings', 'grid')}. Valid arguments: fluid | fixed";
|
761
761
|
}
|
762
762
|
|
763
763
|
// From $key-x breakpoint to $key-y breakpoint
|
@@ -765,18 +765,18 @@
|
|
765
765
|
// @param $key [from key-x to key-y] : from $key-x breakpoint to $key-y
|
766
766
|
// -------------------------------------------------------------------------------
|
767
767
|
|
768
|
-
} @else if types-in-list($key, "string", 4) and nth($key, 1) == "from" and nth($key, 3) == "to" {
|
768
|
+
} @else if flint-types-in-list($key, "string", 4) and nth($key, 1) == "from" and nth($key, 3) == "to" {
|
769
769
|
|
770
|
-
@if get-value("settings", "grid") == "fluid" {
|
771
|
-
@media only screen and ( min-width: (calc-breakpoint("next", nth($key, 2), get-index(nth($key, 2))) + if(is-lowest-breakpoint(nth($key, 2)), 0, if(get-config-unit() == "em", em(1px), 1))) ) and ( max-width: calc-breakpoint("alias", nth($key, 4), get-index(nth($key, 4))) ) {
|
770
|
+
@if flint-get-value("settings", "grid") == "fluid" {
|
771
|
+
@media only screen and ( min-width: (flint-calc-breakpoint("next", nth($key, 2), flint-get-index(nth($key, 2))) + if(flint-is-lowest-breakpoint(nth($key, 2)), 0, if(flint-get-config-unit() == "em", flint-to-em(1px), 1))) ) and ( max-width: flint-calc-breakpoint("alias", nth($key, 4), flint-get-index(nth($key, 4))) ) {
|
772
772
|
@content;
|
773
773
|
}
|
774
|
-
} @else if get-value("settings", "grid") == "fixed" {
|
775
|
-
@media only screen and ( min-width: calc-breakpoint("alias", nth($key, 2), get-index(nth($key, 2))) ) and ( max-width: (calc-breakpoint("prev", nth($key, 4), get-index(nth($key, 4))) - if(is-highest-breakpoint(nth($key, 4)), 0, if(get-config-unit() == "em", em(1px), 1))) ) {
|
774
|
+
} @else if flint-get-value("settings", "grid") == "fixed" {
|
775
|
+
@media only screen and ( min-width: flint-calc-breakpoint("alias", nth($key, 2), flint-get-index(nth($key, 2))) ) and ( max-width: (flint-calc-breakpoint("prev", nth($key, 4), flint-get-index(nth($key, 4))) - if(flint-is-highest-breakpoint(nth($key, 4)), 0, if(flint-get-config-unit() == "em", flint-to-em(1px), 1))) ) {
|
776
776
|
@content;
|
777
777
|
}
|
778
778
|
} @else {
|
779
|
-
@warn "Invalid gutter settings in config map: #{get-value('settings', 'grid')}. Valid arguments: fluid | fixed";
|
779
|
+
@warn "Invalid gutter settings in config map: #{flint-get-value('settings', 'grid')}. Valid arguments: fluid | fixed";
|
780
780
|
}
|
781
781
|
|
782
782
|
// From $num-x to $num-y
|
@@ -784,15 +784,15 @@
|
|
784
784
|
// @param $key [from number to number] : arbitrary media query
|
785
785
|
// -------------------------------------------------------------------------------
|
786
786
|
|
787
|
-
} @else if types-in-list($key, "string" "number" "string" "number", 4) and nth($key, 1) == "from" and nth($key, 3) == "to" {
|
787
|
+
} @else if flint-types-in-list($key, "string" "number" "string" "number", 4) and nth($key, 1) == "from" and nth($key, 3) == "to" {
|
788
788
|
// Make sure passed units match units used in config
|
789
|
-
@if get-config-unit() == unit(nth($key, 2)) and get-config-unit() == unit(nth($key, 4)) {
|
789
|
+
@if flint-get-config-unit() == unit(nth($key, 2)) and flint-get-config-unit() == unit(nth($key, 4)) {
|
790
790
|
@media only screen and ( min-width: nth($key, 2) ) and ( max-width: nth($key, 4) ) {
|
791
791
|
@content;
|
792
792
|
}
|
793
793
|
// Throw error
|
794
794
|
} @else {
|
795
|
-
@warn "Passed units [#{unit(nth($key, 2))}, #{unit(nth($key, 4))}] do not match the unit used in your config map: #{get-config-unit()}";
|
795
|
+
@warn "Passed units [#{unit(nth($key, 2))}, #{unit(nth($key, 4))}] do not match the unit used in your config map: #{flint-get-config-unit()}";
|
796
796
|
}
|
797
797
|
|
798
798
|
// Greater than $key breakpoint
|
@@ -800,18 +800,18 @@
|
|
800
800
|
// @param $key [greater than key] : anything above $key breakpoint
|
801
801
|
// -------------------------------------------------------------------------------
|
802
802
|
|
803
|
-
} @else if types-in-list($key, "string", 3) and nth($key, 1) == "greater" and nth($key, 2) == "than" {
|
803
|
+
} @else if flint-types-in-list($key, "string", 3) and nth($key, 1) == "greater" and nth($key, 2) == "than" {
|
804
804
|
|
805
|
-
@if get-value("settings", "grid") == "fluid" {
|
806
|
-
@media only screen and ( min-width: (calc-breakpoint("alias", nth($key, 3), get-index(nth($key, 3))) + if(get-config-unit() == "em", em(1px), 1)) ) {
|
805
|
+
@if flint-get-value("settings", "grid") == "fluid" {
|
806
|
+
@media only screen and ( min-width: (flint-calc-breakpoint("alias", nth($key, 3), flint-get-index(nth($key, 3))) + if(flint-get-config-unit() == "em", flint-to-em(1px), 1)) ) {
|
807
807
|
@content;
|
808
808
|
}
|
809
|
-
} @else if get-value("settings", "grid") == "fixed" {
|
810
|
-
@media only screen and ( min-width: calc-breakpoint("prev", nth($key, 3), get-index(nth($key, 3))) ) {
|
809
|
+
} @else if flint-get-value("settings", "grid") == "fixed" {
|
810
|
+
@media only screen and ( min-width: flint-calc-breakpoint("prev", nth($key, 3), flint-get-index(nth($key, 3))) ) {
|
811
811
|
@content;
|
812
812
|
}
|
813
813
|
} @else {
|
814
|
-
@warn "Invalid gutter settings in config map: #{get-value('settings', 'grid')}. Valid arguments: fluid | fixed";
|
814
|
+
@warn "Invalid gutter settings in config map: #{flint-get-value('settings', 'grid')}. Valid arguments: fluid | fixed";
|
815
815
|
}
|
816
816
|
|
817
817
|
// Greater than number
|
@@ -819,14 +819,14 @@
|
|
819
819
|
// @param $key [greater than number] : anything above number
|
820
820
|
// -------------------------------------------------------------------------------
|
821
821
|
|
822
|
-
} @else if types-in-list($key, "string" "string" "number", 3) and nth($key, 1) == "greater" and nth($key, 2) == "than" {
|
822
|
+
} @else if flint-types-in-list($key, "string" "string" "number", 3) and nth($key, 1) == "greater" and nth($key, 2) == "than" {
|
823
823
|
|
824
|
-
@if get-config-unit() == unit(nth($key, 3)) {
|
825
|
-
@media only screen and ( min-width: nth($key, 3) + if(get-config-unit() == "em", em(1px), 1) ) {
|
824
|
+
@if flint-get-config-unit() == unit(nth($key, 3)) {
|
825
|
+
@media only screen and ( min-width: nth($key, 3) + if(flint-get-config-unit() == "em", flint-to-em(1px), 1) ) {
|
826
826
|
@content;
|
827
827
|
}
|
828
828
|
} @else {
|
829
|
-
@warn "Passed units [#{unit(nth($key, 3))}] do not match the unit used in your config map: #{get-config-unit()}";
|
829
|
+
@warn "Passed units [#{unit(nth($key, 3))}] do not match the unit used in your config map: #{flint-get-config-unit()}";
|
830
830
|
}
|
831
831
|
|
832
832
|
// Number greater than $key breakpoint
|
@@ -834,14 +834,14 @@
|
|
834
834
|
// @param $key [number greater than key] : unit value greater than $key breakpoint
|
835
835
|
// -------------------------------------------------------------------------------
|
836
836
|
|
837
|
-
} @else if types-in-list($key, "number" "string" "string" "string", 4) and nth($key, 2) == "greater" and nth($key, 3) == "than" {
|
837
|
+
} @else if flint-types-in-list($key, "number" "string" "string" "string", 4) and nth($key, 2) == "greater" and nth($key, 3) == "than" {
|
838
838
|
|
839
|
-
@if get-config-unit() == unit(nth($key, 1)) {
|
840
|
-
@media only screen and ( min-width: (calc-breakpoint("alias", nth($key, 4), get-index(nth($key, 4))) + nth($key, 1)) ) {
|
839
|
+
@if flint-get-config-unit() == unit(nth($key, 1)) {
|
840
|
+
@media only screen and ( min-width: (flint-calc-breakpoint("alias", nth($key, 4), flint-get-index(nth($key, 4))) + nth($key, 1)) ) {
|
841
841
|
@content;
|
842
842
|
}
|
843
843
|
} @else {
|
844
|
-
@warn "Passed units [#{unit(nth($key, 1))}] do not match the unit used in your config map: #{get-config-unit()}";
|
844
|
+
@warn "Passed units [#{unit(nth($key, 1))}] do not match the unit used in your config map: #{flint-get-config-unit()}";
|
845
845
|
}
|
846
846
|
|
847
847
|
// Less than $key breakpoint
|
@@ -849,18 +849,18 @@
|
|
849
849
|
// @param $key [less than key] : anything below $key breakpoint
|
850
850
|
// -------------------------------------------------------------------------------
|
851
851
|
|
852
|
-
} @else if types-in-list($key, "string", 3) and nth($key, 1) == "less" and nth($key, 2) == "than" {
|
852
|
+
} @else if flint-types-in-list($key, "string", 3) and nth($key, 1) == "less" and nth($key, 2) == "than" {
|
853
853
|
|
854
|
-
@if get-value("settings", "grid") == "fluid" {
|
855
|
-
@media only screen and ( max-width: calc-breakpoint("next", nth($key, 3), get-index(nth($key, 3))) ) {
|
854
|
+
@if flint-get-value("settings", "grid") == "fluid" {
|
855
|
+
@media only screen and ( max-width: flint-calc-breakpoint("next", nth($key, 3), flint-get-index(nth($key, 3))) ) {
|
856
856
|
@content;
|
857
857
|
}
|
858
|
-
} @else if get-value("settings", "grid") == "fixed" {
|
859
|
-
@media only screen and ( max-width: (calc-breakpoint("alias", nth($key, 3), get-index(nth($key, 3))) - if(get-config-unit() == "em", em(1px), 1)) ) {
|
858
|
+
} @else if flint-get-value("settings", "grid") == "fixed" {
|
859
|
+
@media only screen and ( max-width: (flint-calc-breakpoint("alias", nth($key, 3), flint-get-index(nth($key, 3))) - if(flint-get-config-unit() == "em", flint-to-em(1px), 1)) ) {
|
860
860
|
@content;
|
861
861
|
}
|
862
862
|
} @else {
|
863
|
-
@warn "Invalid gutter settings in config map: #{get-value('settings', 'grid')}. Valid arguments: fluid | fixed";
|
863
|
+
@warn "Invalid gutter settings in config map: #{flint-get-value('settings', 'grid')}. Valid arguments: fluid | fixed";
|
864
864
|
}
|
865
865
|
|
866
866
|
// Less than number
|
@@ -868,14 +868,14 @@
|
|
868
868
|
// @param $key [less than number] : anything below number
|
869
869
|
// -------------------------------------------------------------------------------
|
870
870
|
|
871
|
-
} @else if types-in-list($key, "string" "string" "number", 3) and nth($key, 1) == "less" and nth($key, 2) == "than" {
|
871
|
+
} @else if flint-types-in-list($key, "string" "string" "number", 3) and nth($key, 1) == "less" and nth($key, 2) == "than" {
|
872
872
|
|
873
|
-
@if get-config-unit() == unit(nth($key, 3)) {
|
874
|
-
@media only screen and ( max-width: nth($key, 3) - if(get-config-unit() == "em", em(1px), 1) ) {
|
873
|
+
@if flint-get-config-unit() == unit(nth($key, 3)) {
|
874
|
+
@media only screen and ( max-width: nth($key, 3) - if(flint-get-config-unit() == "em", flint-to-em(1px), 1) ) {
|
875
875
|
@content;
|
876
876
|
}
|
877
877
|
} @else {
|
878
|
-
@warn "Passed units [#{unit(nth($key, 3))}] do not match the unit used in your config map: #{get-config-unit()}";
|
878
|
+
@warn "Passed units [#{unit(nth($key, 3))}] do not match the unit used in your config map: #{flint-get-config-unit()}";
|
879
879
|
}
|
880
880
|
|
881
881
|
// Number less than $key breakpoint
|
@@ -883,14 +883,14 @@
|
|
883
883
|
// @param $key [number less than key] : unit value less than $key breakpoint
|
884
884
|
// -------------------------------------------------------------------------------
|
885
885
|
|
886
|
-
} @else if types-in-list($key, "number" "string" "string" "string", 4) and nth($key, 2) == "less" and nth($key, 3) == "than" {
|
886
|
+
} @else if flint-types-in-list($key, "number" "string" "string" "string", 4) and nth($key, 2) == "less" and nth($key, 3) == "than" {
|
887
887
|
|
888
|
-
@if get-config-unit() == unit(nth($key, 1)) {
|
889
|
-
@media only screen and ( max-width: (calc-breakpoint("alias", nth($key, 4), get-index(nth($key, 4))) - nth($key, 1)) ) {
|
888
|
+
@if flint-get-config-unit() == unit(nth($key, 1)) {
|
889
|
+
@media only screen and ( max-width: (flint-calc-breakpoint("alias", nth($key, 4), flint-get-index(nth($key, 4))) - nth($key, 1)) ) {
|
890
890
|
@content;
|
891
891
|
}
|
892
892
|
} @else {
|
893
|
-
@warn "Passed units [#{unit(nth($key, 1))}] do not match the unit used in your config map: #{get-config-unit()}";
|
893
|
+
@warn "Passed units [#{unit(nth($key, 1))}] do not match the unit used in your config map: #{flint-get-config-unit()}";
|
894
894
|
}
|
895
895
|
|
896
896
|
// For $key-x $key-y $key-z
|
@@ -898,34 +898,34 @@
|
|
898
898
|
// @param $key [for list of strings] : will duplicate styles for each passed $key breakpoint
|
899
899
|
// -------------------------------------------------------------------------------
|
900
900
|
|
901
|
-
} @else if types-in-list($key, "string") and nth($key, 1) == "for" {
|
901
|
+
} @else if flint-types-in-list($key, "string") and nth($key, 1) == "for" {
|
902
902
|
|
903
903
|
@for $i from 1 through length($key) {
|
904
|
-
$
|
904
|
+
$calc-key: nth($key, $i);
|
905
905
|
|
906
|
-
@if exists($flint, $
|
907
|
-
@if get-value("settings", "grid") == "fluid" {
|
908
|
-
@if is-highest-breakpoint($
|
909
|
-
@media only screen and ( min-width: (calc-breakpoint("next", $
|
906
|
+
@if flint-exists($flint, $calc-key) {
|
907
|
+
@if flint-get-value("settings", "grid") == "fluid" {
|
908
|
+
@if flint-is-highest-breakpoint($calc-key) {
|
909
|
+
@media only screen and ( min-width: (flint-calc-breakpoint("next", $calc-key, flint-get-index($calc-key)) + if(flint-get-config-unit() == "em", flint-to-em(1px), 1)) ) {
|
910
910
|
@content;
|
911
911
|
}
|
912
912
|
} @else {
|
913
|
-
@media only screen and ( min-width: (calc-breakpoint("next", $
|
913
|
+
@media only screen and ( min-width: (flint-calc-breakpoint("next", $calc-key, flint-get-index($calc-key)) + if(flint-is-lowest-breakpoint($calc-key), 0, if(flint-get-config-unit() == "em", flint-to-em(1px), 1))) ) and ( max-width: flint-calc-breakpoint("alias", $calc-key, flint-get-index($calc-key)) ) {
|
914
914
|
@content;
|
915
915
|
}
|
916
916
|
}
|
917
|
-
} @else if get-value("settings", "grid") == "fixed" {
|
918
|
-
@if is-highest-breakpoint($
|
919
|
-
@media only screen and ( min-width: calc-breakpoint("alias", $
|
917
|
+
} @else if flint-get-value("settings", "grid") == "fixed" {
|
918
|
+
@if flint-is-highest-breakpoint($calc-key) {
|
919
|
+
@media only screen and ( min-width: flint-calc-breakpoint("alias", $calc-key, flint-get-index($calc-key)) ) {
|
920
920
|
@content;
|
921
921
|
}
|
922
922
|
} @else {
|
923
|
-
@media only screen and ( min-width: calc-breakpoint("alias", $
|
923
|
+
@media only screen and ( min-width: flint-calc-breakpoint("alias", $calc-key, flint-get-index($calc-key)) ) and ( max-width: (flint-calc-breakpoint("prev", $calc-key, flint-get-index($calc-key)) - if(flint-get-config-unit() == "em", flint-to-em(1px), 1)) ) {
|
924
924
|
@content;
|
925
925
|
}
|
926
926
|
}
|
927
927
|
} @else {
|
928
|
-
@warn "Invalid gutter settings in config map: #{get-value('settings', 'grid')}. Valid arguments: fluid | fixed";
|
928
|
+
@warn "Invalid gutter settings in config map: #{flint-get-value('settings', 'grid')}. Valid arguments: fluid | fixed";
|
929
929
|
}
|
930
930
|
}
|
931
931
|
}
|