bulma-clean-theme 1.0.3 → 1.0.4

Sign up to get free protection for your applications and to get access to all the features.
Files changed (45) hide show
  1. checksums.yaml +4 -4
  2. data/_includes/cookie-banner.html +3 -3
  3. data/_includes/tiktok.html +6 -0
  4. data/_layouts/product-category.html +5 -1
  5. data/node_modules/.package-lock.json +3 -3
  6. data/node_modules/bulma/README.md +3 -1
  7. data/node_modules/bulma/bulma.scss +1 -1
  8. data/node_modules/bulma/css/bulma.css +1897 -2791
  9. data/node_modules/bulma/css/bulma.css.map +1 -1
  10. data/node_modules/bulma/css/bulma.min.css +2 -2
  11. data/node_modules/bulma/css/versions/bulma-no-dark-mode.css +1887 -2781
  12. data/node_modules/bulma/css/versions/bulma-no-dark-mode.css.map +1 -1
  13. data/node_modules/bulma/css/versions/bulma-no-dark-mode.min.css +2 -2
  14. data/node_modules/bulma/css/versions/bulma-no-helpers-prefixed.css +612 -96
  15. data/node_modules/bulma/css/versions/bulma-no-helpers-prefixed.css.map +1 -1
  16. data/node_modules/bulma/css/versions/bulma-no-helpers-prefixed.min.css +2 -2
  17. data/node_modules/bulma/css/versions/bulma-no-helpers.css +612 -96
  18. data/node_modules/bulma/css/versions/bulma-no-helpers.css.map +1 -1
  19. data/node_modules/bulma/css/versions/bulma-no-helpers.min.css +2 -2
  20. data/node_modules/bulma/css/versions/bulma-prefixed.min.css +1897 -2791
  21. data/node_modules/bulma/css/versions/bulma-prefixed.min.css.map +1 -1
  22. data/node_modules/bulma/css/versions/bulma-prefixed.min.min.css +2 -2
  23. data/node_modules/bulma/package.json +6 -5
  24. data/node_modules/bulma/sass/components/navbar.scss +41 -30
  25. data/node_modules/bulma/sass/components/panel.scss +2 -2
  26. data/node_modules/bulma/sass/elements/content.scss +8 -2
  27. data/node_modules/bulma/sass/form/checkbox-radio.scss +7 -3
  28. data/node_modules/bulma/sass/form/input-textarea.scss +0 -10
  29. data/node_modules/bulma/sass/form/shared.scss +4 -0
  30. data/node_modules/bulma/sass/form/tools.scss +23 -12
  31. data/node_modules/bulma/sass/grid/columns.scss +109 -25
  32. data/node_modules/bulma/sass/grid/grid.scss +1 -1
  33. data/node_modules/bulma/sass/helpers/color.scss +166 -186
  34. data/node_modules/bulma/sass/layout/container.scss +16 -8
  35. data/node_modules/bulma/sass/layout/section.scss +4 -0
  36. data/node_modules/bulma/sass/utilities/css-variables.scss +3 -2
  37. data/node_modules/bulma/sass/utilities/functions.scss +2 -2
  38. data/node_modules/bulma/sass/utilities/initial-variables.scss +4 -4
  39. data/node_modules/bulma/versions/bulma-no-dark-mode.scss +1 -1
  40. data/node_modules/bulma/versions/bulma-no-helpers-prefixed.scss +1 -1
  41. data/node_modules/bulma/versions/bulma-no-helpers.scss +1 -1
  42. data/node_modules/bulma/versions/bulma-prefixed.scss +1 -1
  43. data/package-lock.json +6 -6
  44. metadata +3 -3
  45. data/node_modules/bulma/sass/grid/columns-v2.scss +0 -957
@@ -1,957 +0,0 @@
1
- @use "sass:math";
2
- @use "../utilities/css-variables" as cv;
3
- @use "../utilities/derived-variables" as dv;
4
- @use "../utilities/initial-variables" as iv;
5
- @use "../utilities/extends";
6
- @use "../utilities/mixins" as mx;
7
-
8
- $column-gap: 1.5rem !default;
9
-
10
- :root {
11
- @include cv.register-vars(
12
- (
13
- "column-gap": #{$column-gap},
14
- )
15
- );
16
- }
17
-
18
- .#{iv.$class-prefix}column {
19
- display: block;
20
- flex-basis: 0;
21
- flex-grow: 1;
22
- flex-shrink: 1;
23
-
24
- .#{iv.$class-prefix}columns.#{iv.$class-prefix}is-mobile
25
- > &.#{iv.$class-prefix}is-narrow {
26
- flex: none;
27
- width: unset;
28
- }
29
-
30
- .#{iv.$class-prefix}columns.#{iv.$class-prefix}is-mobile
31
- > &.#{iv.$class-prefix}is-full {
32
- flex: none;
33
- width: 100%;
34
- }
35
-
36
- .#{iv.$class-prefix}columns.#{iv.$class-prefix}is-mobile
37
- > &.#{iv.$class-prefix}is-three-quarters {
38
- flex: none;
39
- width: calc(75% - calc(#{cv.getVar("column-gap")} / 2));
40
- }
41
-
42
- .#{iv.$class-prefix}columns.#{iv.$class-prefix}is-mobile
43
- > &.#{iv.$class-prefix}is-two-thirds {
44
- flex: none;
45
- width: calc(66.6666% - calc(#{cv.getVar("column-gap")} / 2));
46
- }
47
-
48
- .#{iv.$class-prefix}columns.#{iv.$class-prefix}is-mobile
49
- > &.#{iv.$class-prefix}is-half {
50
- flex: none;
51
- width: calc(50% - calc(#{cv.getVar("column-gap")} / 2));
52
- }
53
-
54
- .#{iv.$class-prefix}columns.#{iv.$class-prefix}is-mobile
55
- > &.#{iv.$class-prefix}is-one-third {
56
- flex: none;
57
- width: calc(33.3333% - calc(#{cv.getVar("column-gap")} / 2));
58
- }
59
-
60
- .#{iv.$class-prefix}columns.#{iv.$class-prefix}is-mobile
61
- > &.#{iv.$class-prefix}is-one-quarter {
62
- flex: none;
63
- width: calc(25% - calc(#{cv.getVar("column-gap")} / 2));
64
- }
65
-
66
- .#{iv.$class-prefix}columns.#{iv.$class-prefix}is-mobile
67
- > &.#{iv.$class-prefix}is-one-fifth {
68
- flex: none;
69
- width: calc(20% - calc(#{cv.getVar("column-gap")} / 2));
70
- }
71
-
72
- .#{iv.$class-prefix}columns.#{iv.$class-prefix}is-mobile
73
- > &.#{iv.$class-prefix}is-two-fifths {
74
- flex: none;
75
- width: calc(40% - calc(#{cv.getVar("column-gap")} / 2));
76
- }
77
-
78
- .#{iv.$class-prefix}columns.#{iv.$class-prefix}is-mobile
79
- > &.#{iv.$class-prefix}is-three-fifths {
80
- flex: none;
81
- width: calc(60% - calc(#{cv.getVar("column-gap")} / 2));
82
- }
83
-
84
- .#{iv.$class-prefix}columns.#{iv.$class-prefix}is-mobile
85
- > &.#{iv.$class-prefix}is-four-fifths {
86
- flex: none;
87
- width: calc(80% - calc(#{cv.getVar("column-gap")} / 2));
88
- }
89
-
90
- .#{iv.$class-prefix}columns.#{iv.$class-prefix}is-mobile
91
- > &.#{iv.$class-prefix}is-offset-three-quarters {
92
- margin-inline-start: 75%;
93
- }
94
-
95
- .#{iv.$class-prefix}columns.#{iv.$class-prefix}is-mobile
96
- > &.#{iv.$class-prefix}is-offset-two-thirds {
97
- margin-inline-start: 66.6666%;
98
- }
99
-
100
- .#{iv.$class-prefix}columns.#{iv.$class-prefix}is-mobile
101
- > &.#{iv.$class-prefix}is-offset-half {
102
- margin-inline-start: 50%;
103
- }
104
-
105
- .#{iv.$class-prefix}columns.#{iv.$class-prefix}is-mobile
106
- > &.#{iv.$class-prefix}is-offset-one-third {
107
- margin-inline-start: 33.3333%;
108
- }
109
-
110
- .#{iv.$class-prefix}columns.#{iv.$class-prefix}is-mobile
111
- > &.#{iv.$class-prefix}is-offset-one-quarter {
112
- margin-inline-start: 25%;
113
- }
114
-
115
- .#{iv.$class-prefix}columns.#{iv.$class-prefix}is-mobile
116
- > &.#{iv.$class-prefix}is-offset-one-fifth {
117
- margin-inline-start: 20%;
118
- }
119
-
120
- .#{iv.$class-prefix}columns.#{iv.$class-prefix}is-mobile
121
- > &.#{iv.$class-prefix}is-offset-two-fifths {
122
- margin-inline-start: 40%;
123
- }
124
-
125
- .#{iv.$class-prefix}columns.#{iv.$class-prefix}is-mobile
126
- > &.#{iv.$class-prefix}is-offset-three-fifths {
127
- margin-inline-start: 60%;
128
- }
129
-
130
- .#{iv.$class-prefix}columns.#{iv.$class-prefix}is-mobile
131
- > &.#{iv.$class-prefix}is-offset-four-fifths {
132
- margin-inline-start: 80%;
133
- }
134
-
135
- @for $i from 0 through 12 {
136
- .#{iv.$class-prefix}columns.#{iv.$class-prefix}is-mobile
137
- > &.#{iv.$class-prefix}is-#{$i} {
138
- flex: none;
139
- width: calc(
140
- math.percentage(math.div($i, 12)) - calc(#{cv.getVar("column-gap")} / 2)
141
- );
142
- }
143
-
144
- .#{iv.$class-prefix}columns.#{iv.$class-prefix}is-mobile
145
- > &.#{iv.$class-prefix}is-offset-#{$i} {
146
- margin-inline-start: math.percentage(math.div($i, 12));
147
- }
148
- }
149
-
150
- @include mx.mobile {
151
- &.#{iv.$class-prefix}is-narrow-mobile {
152
- flex: none;
153
- width: unset;
154
- }
155
-
156
- &.#{iv.$class-prefix}is-full-mobile {
157
- flex: none;
158
- width: 100%;
159
- }
160
-
161
- &.#{iv.$class-prefix}is-three-quarters-mobile {
162
- flex: none;
163
- width: calc(75% - calc(#{cv.getVar("column-gap")} / 2));
164
- }
165
-
166
- &.#{iv.$class-prefix}is-two-thirds-mobile {
167
- flex: none;
168
- width: calc(66.6666% - calc(#{cv.getVar("column-gap")} / 2));
169
- }
170
-
171
- &.#{iv.$class-prefix}is-half-mobile {
172
- flex: none;
173
- width: calc(50% - calc(#{cv.getVar("column-gap")} / 2));
174
- }
175
-
176
- &.#{iv.$class-prefix}is-one-third-mobile {
177
- flex: none;
178
- width: calc(33.3333% - calc(#{cv.getVar("column-gap")} / 2));
179
- }
180
-
181
- &.#{iv.$class-prefix}is-one-quarter-mobile {
182
- flex: none;
183
- width: calc(25% - calc(#{cv.getVar("column-gap")} / 2));
184
- }
185
-
186
- &.#{iv.$class-prefix}is-one-fifth-mobile {
187
- flex: none;
188
- width: calc(20% - calc(#{cv.getVar("column-gap")} / 2));
189
- }
190
-
191
- &.#{iv.$class-prefix}is-two-fifths-mobile {
192
- flex: none;
193
- width: calc(40% - calc(#{cv.getVar("column-gap")} / 2));
194
- }
195
-
196
- &.#{iv.$class-prefix}is-three-fifths-mobile {
197
- flex: none;
198
- width: calc(60% - calc(#{cv.getVar("column-gap")} / 2));
199
- }
200
-
201
- &.#{iv.$class-prefix}is-four-fifths-mobile {
202
- flex: none;
203
- width: calc(80% - calc(#{cv.getVar("column-gap")} / 2));
204
- }
205
-
206
- &.#{iv.$class-prefix}is-offset-three-quarters-mobile {
207
- margin-inline-start: 75%;
208
- }
209
-
210
- &.#{iv.$class-prefix}is-offset-two-thirds-mobile {
211
- margin-inline-start: 66.6666%;
212
- }
213
-
214
- &.#{iv.$class-prefix}is-offset-half-mobile {
215
- margin-inline-start: 50%;
216
- }
217
-
218
- &.#{iv.$class-prefix}is-offset-one-third-mobile {
219
- margin-inline-start: 33.3333%;
220
- }
221
-
222
- &.#{iv.$class-prefix}is-offset-one-quarter-mobile {
223
- margin-inline-start: 25%;
224
- }
225
-
226
- &.#{iv.$class-prefix}is-offset-one-fifth-mobile {
227
- margin-inline-start: 20%;
228
- }
229
-
230
- &.#{iv.$class-prefix}is-offset-two-fifths-mobile {
231
- margin-inline-start: 40%;
232
- }
233
-
234
- &.#{iv.$class-prefix}is-offset-three-fifths-mobile {
235
- margin-inline-start: 60%;
236
- }
237
-
238
- &.#{iv.$class-prefix}is-offset-four-fifths-mobile {
239
- margin-inline-start: 80%;
240
- }
241
-
242
- @for $i from 0 through 12 {
243
- &.#{iv.$class-prefix}is-#{$i}-mobile {
244
- flex: none;
245
- width: calc(
246
- math.percentage(math.div($i, 12)) - calc(
247
- #{cv.getVar("column-gap")} / 2
248
- )
249
- );
250
- }
251
-
252
- &.#{iv.$class-prefix}is-offset-#{$i}-mobile {
253
- margin-inline-start: math.percentage(math.div($i, 12));
254
- }
255
- }
256
- }
257
-
258
- @include mx.tablet {
259
- &.#{iv.$class-prefix}is-narrow,
260
- &.#{iv.$class-prefix}is-narrow-tablet {
261
- flex: none;
262
- width: unset;
263
- }
264
-
265
- &.#{iv.$class-prefix}is-full,
266
- &.#{iv.$class-prefix}is-full-tablet {
267
- flex: none;
268
- width: 100%;
269
- }
270
-
271
- &.#{iv.$class-prefix}is-three-quarters,
272
- &.#{iv.$class-prefix}is-three-quarters-tablet {
273
- flex: none;
274
- width: calc(75% - calc(#{cv.getVar("column-gap")} / 2));
275
- }
276
-
277
- &.#{iv.$class-prefix}is-two-thirds,
278
- &.#{iv.$class-prefix}is-two-thirds-tablet {
279
- flex: none;
280
- width: calc(66.6666% - calc(#{cv.getVar("column-gap")} / 2));
281
- }
282
-
283
- &.#{iv.$class-prefix}is-half,
284
- &.#{iv.$class-prefix}is-half-tablet {
285
- flex: none;
286
- width: calc(50% - calc(#{cv.getVar("column-gap")} / 2));
287
- }
288
-
289
- &.#{iv.$class-prefix}is-one-third,
290
- &.#{iv.$class-prefix}is-one-third-tablet {
291
- flex: none;
292
- width: calc(33.3333% - calc(#{cv.getVar("column-gap")} / 2));
293
- }
294
-
295
- &.#{iv.$class-prefix}is-one-quarter,
296
- &.#{iv.$class-prefix}is-one-quarter-tablet {
297
- flex: none;
298
- width: calc(25% - calc(#{cv.getVar("column-gap")} / 2));
299
- }
300
-
301
- &.#{iv.$class-prefix}is-one-fifth,
302
- &.#{iv.$class-prefix}is-one-fifth-tablet {
303
- flex: none;
304
- width: calc(20% - calc(#{cv.getVar("column-gap")} / 2));
305
- }
306
-
307
- &.#{iv.$class-prefix}is-two-fifths,
308
- &.#{iv.$class-prefix}is-two-fifths-tablet {
309
- flex: none;
310
- width: calc(40% - calc(#{cv.getVar("column-gap")} / 2));
311
- }
312
-
313
- &.#{iv.$class-prefix}is-three-fifths,
314
- &.#{iv.$class-prefix}is-three-fifths-tablet {
315
- flex: none;
316
- width: calc(60% - calc(#{cv.getVar("column-gap")} / 2));
317
- }
318
-
319
- &.#{iv.$class-prefix}is-four-fifths,
320
- &.#{iv.$class-prefix}is-four-fifths-tablet {
321
- flex: none;
322
- width: calc(80% - calc(#{cv.getVar("column-gap")} / 2));
323
- }
324
-
325
- &.#{iv.$class-prefix}is-offset-three-quarters,
326
- &.#{iv.$class-prefix}is-offset-three-quarters-tablet {
327
- margin-inline-start: 75%;
328
- }
329
-
330
- &.#{iv.$class-prefix}is-offset-two-thirds,
331
- &.#{iv.$class-prefix}is-offset-two-thirds-tablet {
332
- margin-inline-start: 66.6666%;
333
- }
334
-
335
- &.#{iv.$class-prefix}is-offset-half,
336
- &.#{iv.$class-prefix}is-offset-half-tablet {
337
- margin-inline-start: 50%;
338
- }
339
-
340
- &.#{iv.$class-prefix}is-offset-one-third,
341
- &.#{iv.$class-prefix}is-offset-one-third-tablet {
342
- margin-inline-start: 33.3333%;
343
- }
344
-
345
- &.#{iv.$class-prefix}is-offset-one-quarter,
346
- &.#{iv.$class-prefix}is-offset-one-quarter-tablet {
347
- margin-inline-start: 25%;
348
- }
349
-
350
- &.#{iv.$class-prefix}is-offset-one-fifth,
351
- &.#{iv.$class-prefix}is-offset-one-fifth-tablet {
352
- margin-inline-start: 20%;
353
- }
354
-
355
- &.#{iv.$class-prefix}is-offset-two-fifths,
356
- &.#{iv.$class-prefix}is-offset-two-fifths-tablet {
357
- margin-inline-start: 40%;
358
- }
359
-
360
- &.#{iv.$class-prefix}is-offset-three-fifths,
361
- &.#{iv.$class-prefix}is-offset-three-fifths-tablet {
362
- margin-inline-start: 60%;
363
- }
364
-
365
- &.#{iv.$class-prefix}is-offset-four-fifths,
366
- &.#{iv.$class-prefix}is-offset-four-fifths-tablet {
367
- margin-inline-start: 80%;
368
- }
369
-
370
- @for $i from 0 through 12 {
371
- &.#{iv.$class-prefix}is-#{$i},
372
- &.#{iv.$class-prefix}is-#{$i}-tablet {
373
- flex: none;
374
- width: calc(
375
- math.percentage(math.div($i, 12)) - calc(
376
- #{cv.getVar("column-gap")} / 2
377
- )
378
- );
379
- }
380
-
381
- &.#{iv.$class-prefix}is-offset-#{$i},
382
- &.#{iv.$class-prefix}is-offset-#{$i}-tablet {
383
- margin-inline-start: math.percentage(math.div($i, 12));
384
- }
385
- }
386
- }
387
-
388
- @include mx.touch {
389
- &.#{iv.$class-prefix}is-narrow-touch {
390
- flex: none;
391
- width: unset;
392
- }
393
-
394
- &.#{iv.$class-prefix}is-full-touch {
395
- flex: none;
396
- width: 100%;
397
- }
398
-
399
- &.#{iv.$class-prefix}is-three-quarters-touch {
400
- flex: none;
401
- width: calc(75% - calc(#{cv.getVar("column-gap")} / 2));
402
- }
403
-
404
- &.#{iv.$class-prefix}is-two-thirds-touch {
405
- flex: none;
406
- width: calc(66.6666% - calc(#{cv.getVar("column-gap")} / 2));
407
- }
408
-
409
- &.#{iv.$class-prefix}is-half-touch {
410
- flex: none;
411
- width: calc(50% - calc(#{cv.getVar("column-gap")} / 2));
412
- }
413
-
414
- &.#{iv.$class-prefix}is-one-third-touch {
415
- flex: none;
416
- width: calc(33.3333% - calc(#{cv.getVar("column-gap")} / 2));
417
- }
418
-
419
- &.#{iv.$class-prefix}is-one-quarter-touch {
420
- flex: none;
421
- width: calc(25% - calc(#{cv.getVar("column-gap")} / 2));
422
- }
423
-
424
- &.#{iv.$class-prefix}is-one-fifth-touch {
425
- flex: none;
426
- width: calc(20% - calc(#{cv.getVar("column-gap")} / 2));
427
- }
428
-
429
- &.#{iv.$class-prefix}is-two-fifths-touch {
430
- flex: none;
431
- width: calc(40% - calc(#{cv.getVar("column-gap")} / 2));
432
- }
433
-
434
- &.#{iv.$class-prefix}is-three-fifths-touch {
435
- flex: none;
436
- width: calc(60% - calc(#{cv.getVar("column-gap")} / 2));
437
- }
438
-
439
- &.#{iv.$class-prefix}is-four-fifths-touch {
440
- flex: none;
441
- width: calc(80% - calc(#{cv.getVar("column-gap")} / 2));
442
- }
443
-
444
- &.#{iv.$class-prefix}is-offset-three-quarters-touch {
445
- margin-inline-start: 75%;
446
- }
447
-
448
- &.#{iv.$class-prefix}is-offset-two-thirds-touch {
449
- margin-inline-start: 66.6666%;
450
- }
451
-
452
- &.#{iv.$class-prefix}is-offset-half-touch {
453
- margin-inline-start: 50%;
454
- }
455
-
456
- &.#{iv.$class-prefix}is-offset-one-third-touch {
457
- margin-inline-start: 33.3333%;
458
- }
459
-
460
- &.#{iv.$class-prefix}is-offset-one-quarter-touch {
461
- margin-inline-start: 25%;
462
- }
463
-
464
- &.#{iv.$class-prefix}is-offset-one-fifth-touch {
465
- margin-inline-start: 20%;
466
- }
467
-
468
- &.#{iv.$class-prefix}is-offset-two-fifths-touch {
469
- margin-inline-start: 40%;
470
- }
471
-
472
- &.#{iv.$class-prefix}is-offset-three-fifths-touch {
473
- margin-inline-start: 60%;
474
- }
475
-
476
- &.#{iv.$class-prefix}is-offset-four-fifths-touch {
477
- margin-inline-start: 80%;
478
- }
479
-
480
- @for $i from 0 through 12 {
481
- &.#{iv.$class-prefix}is-#{$i}-touch {
482
- flex: none;
483
- width: math.percentage(math.div($i, 12));
484
- }
485
-
486
- &.#{iv.$class-prefix}is-offset-#{$i}-touch {
487
- margin-inline-start: math.percentage(math.div($i, 12));
488
- }
489
- }
490
- }
491
-
492
- @include mx.desktop {
493
- &.#{iv.$class-prefix}is-narrow-desktop {
494
- flex: none;
495
- width: unset;
496
- }
497
-
498
- &.#{iv.$class-prefix}is-full-desktop {
499
- flex: none;
500
- width: 100%;
501
- }
502
-
503
- &.#{iv.$class-prefix}is-three-quarters-desktop {
504
- flex: none;
505
- width: calc(75% - calc(#{cv.getVar("column-gap")} / 2));
506
- }
507
-
508
- &.#{iv.$class-prefix}is-two-thirds-desktop {
509
- flex: none;
510
- width: calc(66.6666% - calc(#{cv.getVar("column-gap")} / 2));
511
- }
512
-
513
- &.#{iv.$class-prefix}is-half-desktop {
514
- flex: none;
515
- width: calc(50% - calc(#{cv.getVar("column-gap")} / 2));
516
- }
517
-
518
- &.#{iv.$class-prefix}is-one-third-desktop {
519
- flex: none;
520
- width: calc(33.3333% - calc(#{cv.getVar("column-gap")} / 2));
521
- }
522
-
523
- &.#{iv.$class-prefix}is-one-quarter-desktop {
524
- flex: none;
525
- width: calc(25% - calc(#{cv.getVar("column-gap")} / 2));
526
- }
527
-
528
- &.#{iv.$class-prefix}is-one-fifth-desktop {
529
- flex: none;
530
- width: calc(20% - calc(#{cv.getVar("column-gap")} / 2));
531
- }
532
-
533
- &.#{iv.$class-prefix}is-two-fifths-desktop {
534
- flex: none;
535
- width: calc(40% - calc(#{cv.getVar("column-gap")} / 2));
536
- }
537
-
538
- &.#{iv.$class-prefix}is-three-fifths-desktop {
539
- flex: none;
540
- width: calc(60% - calc(#{cv.getVar("column-gap")} / 2));
541
- }
542
-
543
- &.#{iv.$class-prefix}is-four-fifths-desktop {
544
- flex: none;
545
- width: calc(80% - calc(#{cv.getVar("column-gap")} / 2));
546
- }
547
-
548
- &.#{iv.$class-prefix}is-offset-three-quarters-desktop {
549
- margin-inline-start: 75%;
550
- }
551
-
552
- &.#{iv.$class-prefix}is-offset-two-thirds-desktop {
553
- margin-inline-start: 66.6666%;
554
- }
555
-
556
- &.#{iv.$class-prefix}is-offset-half-desktop {
557
- margin-inline-start: 50%;
558
- }
559
-
560
- &.#{iv.$class-prefix}is-offset-one-third-desktop {
561
- margin-inline-start: 33.3333%;
562
- }
563
-
564
- &.#{iv.$class-prefix}is-offset-one-quarter-desktop {
565
- margin-inline-start: 25%;
566
- }
567
-
568
- &.#{iv.$class-prefix}is-offset-one-fifth-desktop {
569
- margin-inline-start: 20%;
570
- }
571
-
572
- &.#{iv.$class-prefix}is-offset-two-fifths-desktop {
573
- margin-inline-start: 40%;
574
- }
575
-
576
- &.#{iv.$class-prefix}is-offset-three-fifths-desktop {
577
- margin-inline-start: 60%;
578
- }
579
-
580
- &.#{iv.$class-prefix}is-offset-four-fifths-desktop {
581
- margin-inline-start: 80%;
582
- }
583
-
584
- @for $i from 0 through 12 {
585
- &.#{iv.$class-prefix}is-#{$i}-desktop {
586
- flex: none;
587
- width: calc(
588
- math.percentage(math.div($i, 12)) - calc(
589
- #{cv.getVar("column-gap")} / 2
590
- )
591
- );
592
- }
593
-
594
- &.#{iv.$class-prefix}is-offset-#{$i}-desktop {
595
- margin-inline-start: math.percentage(math.div($i, 12));
596
- }
597
- }
598
- }
599
-
600
- @include mx.widescreen {
601
- &.#{iv.$class-prefix}is-narrow-widescreen {
602
- flex: none;
603
- width: unset;
604
- }
605
-
606
- &.#{iv.$class-prefix}is-full-widescreen {
607
- flex: none;
608
- width: 100%;
609
- }
610
-
611
- &.#{iv.$class-prefix}is-three-quarters-widescreen {
612
- flex: none;
613
- width: calc(75% - calc(#{cv.getVar("column-gap")} / 2));
614
- }
615
-
616
- &.#{iv.$class-prefix}is-two-thirds-widescreen {
617
- flex: none;
618
- width: calc(66.6666% - calc(#{cv.getVar("column-gap")} / 2));
619
- }
620
-
621
- &.#{iv.$class-prefix}is-half-widescreen {
622
- flex: none;
623
- width: calc(50% - calc(#{cv.getVar("column-gap")} / 2));
624
- }
625
-
626
- &.#{iv.$class-prefix}is-one-third-widescreen {
627
- flex: none;
628
- width: calc(33.3333% - calc(#{cv.getVar("column-gap")} / 2));
629
- }
630
-
631
- &.#{iv.$class-prefix}is-one-quarter-widescreen {
632
- flex: none;
633
- width: calc(25% - calc(#{cv.getVar("column-gap")} / 2));
634
- }
635
-
636
- &.#{iv.$class-prefix}is-one-fifth-widescreen {
637
- flex: none;
638
- width: calc(20% - calc(#{cv.getVar("column-gap")} / 2));
639
- }
640
-
641
- &.#{iv.$class-prefix}is-two-fifths-widescreen {
642
- flex: none;
643
- width: calc(40% - calc(#{cv.getVar("column-gap")} / 2));
644
- }
645
-
646
- &.#{iv.$class-prefix}is-three-fifths-widescreen {
647
- flex: none;
648
- width: calc(60% - calc(#{cv.getVar("column-gap")} / 2));
649
- }
650
-
651
- &.#{iv.$class-prefix}is-four-fifths-widescreen {
652
- flex: none;
653
- width: calc(80% - calc(#{cv.getVar("column-gap")} / 2));
654
- }
655
-
656
- &.#{iv.$class-prefix}is-offset-three-quarters-widescreen {
657
- margin-inline-start: 75%;
658
- }
659
-
660
- &.#{iv.$class-prefix}is-offset-two-thirds-widescreen {
661
- margin-inline-start: 66.6666%;
662
- }
663
-
664
- &.#{iv.$class-prefix}is-offset-half-widescreen {
665
- margin-inline-start: 50%;
666
- }
667
-
668
- &.#{iv.$class-prefix}is-offset-one-third-widescreen {
669
- margin-inline-start: 33.3333%;
670
- }
671
-
672
- &.#{iv.$class-prefix}is-offset-one-quarter-widescreen {
673
- margin-inline-start: 25%;
674
- }
675
-
676
- &.#{iv.$class-prefix}is-offset-one-fifth-widescreen {
677
- margin-inline-start: 20%;
678
- }
679
-
680
- &.#{iv.$class-prefix}is-offset-two-fifths-widescreen {
681
- margin-inline-start: 40%;
682
- }
683
-
684
- &.#{iv.$class-prefix}is-offset-three-fifths-widescreen {
685
- margin-inline-start: 60%;
686
- }
687
-
688
- &.#{iv.$class-prefix}is-offset-four-fifths-widescreen {
689
- margin-inline-start: 80%;
690
- }
691
-
692
- @for $i from 0 through 12 {
693
- &.#{iv.$class-prefix}is-#{$i}-widescreen {
694
- flex: none;
695
- width: calc(
696
- math.percentage(math.div($i, 12)) - calc(
697
- #{cv.getVar("column-gap")} / 2
698
- )
699
- );
700
- }
701
-
702
- &.#{iv.$class-prefix}is-offset-#{$i}-widescreen {
703
- margin-inline-start: math.percentage(math.div($i, 12));
704
- }
705
- }
706
- }
707
-
708
- @include mx.fullhd {
709
- &.#{iv.$class-prefix}is-narrow-fullhd {
710
- flex: none;
711
- width: unset;
712
- }
713
-
714
- &.#{iv.$class-prefix}is-full-fullhd {
715
- flex: none;
716
- width: 100%;
717
- }
718
-
719
- &.#{iv.$class-prefix}is-three-quarters-fullhd {
720
- flex: none;
721
- width: calc(75% - calc(#{cv.getVar("column-gap")} / 2));
722
- }
723
-
724
- &.#{iv.$class-prefix}is-two-thirds-fullhd {
725
- flex: none;
726
- width: calc(66.6666% - calc(#{cv.getVar("column-gap")} / 2));
727
- }
728
-
729
- &.#{iv.$class-prefix}is-half-fullhd {
730
- flex: none;
731
- width: calc(50% - calc(#{cv.getVar("column-gap")} / 2));
732
- }
733
-
734
- &.#{iv.$class-prefix}is-one-third-fullhd {
735
- flex: none;
736
- width: calc(33.3333% - calc(#{cv.getVar("column-gap")} / 2));
737
- }
738
-
739
- &.#{iv.$class-prefix}is-one-quarter-fullhd {
740
- flex: none;
741
- width: calc(25% - calc(#{cv.getVar("column-gap")} / 2));
742
- }
743
-
744
- &.#{iv.$class-prefix}is-one-fifth-fullhd {
745
- flex: none;
746
- width: calc(20% - calc(#{cv.getVar("column-gap")} / 2));
747
- }
748
-
749
- &.#{iv.$class-prefix}is-two-fifths-fullhd {
750
- flex: none;
751
- width: calc(40% - calc(#{cv.getVar("column-gap")} / 2));
752
- }
753
-
754
- &.#{iv.$class-prefix}is-three-fifths-fullhd {
755
- flex: none;
756
- width: calc(60% - calc(#{cv.getVar("column-gap")} / 2));
757
- }
758
-
759
- &.#{iv.$class-prefix}is-four-fifths-fullhd {
760
- flex: none;
761
- width: calc(80% - calc(#{cv.getVar("column-gap")} / 2));
762
- }
763
-
764
- &.#{iv.$class-prefix}is-offset-three-quarters-fullhd {
765
- margin-inline-start: 75%;
766
- }
767
-
768
- &.#{iv.$class-prefix}is-offset-two-thirds-fullhd {
769
- margin-inline-start: 66.6666%;
770
- }
771
-
772
- &.#{iv.$class-prefix}is-offset-half-fullhd {
773
- margin-inline-start: 50%;
774
- }
775
-
776
- &.#{iv.$class-prefix}is-offset-one-third-fullhd {
777
- margin-inline-start: 33.3333%;
778
- }
779
-
780
- &.#{iv.$class-prefix}is-offset-one-quarter-fullhd {
781
- margin-inline-start: 25%;
782
- }
783
-
784
- &.#{iv.$class-prefix}is-offset-one-fifth-fullhd {
785
- margin-inline-start: 20%;
786
- }
787
-
788
- &.#{iv.$class-prefix}is-offset-two-fifths-fullhd {
789
- margin-inline-start: 40%;
790
- }
791
-
792
- &.#{iv.$class-prefix}is-offset-three-fifths-fullhd {
793
- margin-inline-start: 60%;
794
- }
795
-
796
- &.#{iv.$class-prefix}is-offset-four-fifths-fullhd {
797
- margin-inline-start: 80%;
798
- }
799
-
800
- @for $i from 0 through 12 {
801
- &.#{iv.$class-prefix}is-#{$i}-fullhd {
802
- flex: none;
803
- width: calc(
804
- math.percentage(math.div($i, 12)) - calc(
805
- #{cv.getVar("column-gap")} / 2
806
- )
807
- );
808
- }
809
-
810
- &.#{iv.$class-prefix}is-offset-#{$i}-fullhd {
811
- margin-inline-start: math.percentage(math.div($i, 12));
812
- }
813
- }
814
- }
815
- }
816
-
817
- .#{iv.$class-prefix}columns {
818
- @extend %block;
819
- gap: cv.getVar("column-gap");
820
-
821
- // Modifiers
822
- &.#{iv.$class-prefix}is-centered {
823
- justify-content: center;
824
- }
825
-
826
- &.#{iv.$class-prefix}is-gapless {
827
- gap: 0;
828
- }
829
-
830
- &.#{iv.$class-prefix}is-mobile {
831
- display: flex;
832
- }
833
-
834
- &.#{iv.$class-prefix}is-multiline {
835
- flex-wrap: wrap;
836
- }
837
-
838
- &.#{iv.$class-prefix}is-vcentered {
839
- align-items: center;
840
- }
841
-
842
- // Responsiveness
843
- @include mx.tablet {
844
- &:not(.#{iv.$class-prefix}is-desktop) {
845
- display: flex;
846
- }
847
- }
848
-
849
- @include mx.desktop {
850
- // Modifiers
851
- &.#{iv.$class-prefix}is-desktop {
852
- display: flex;
853
- }
854
- }
855
-
856
- &.#{iv.$class-prefix}is-variable {
857
- @for $i from 0 through 8 {
858
- &.#{iv.$class-prefix}is-#{$i} {
859
- @include cv.register-vars(
860
- (
861
- "column-gap": #{$i * 0.25rem},
862
- )
863
- );
864
- }
865
-
866
- @include mx.mobile {
867
- &.#{iv.$class-prefix}is-#{$i}-mobile {
868
- @include cv.register-vars(
869
- (
870
- "column-gap": #{$i * 0.25rem},
871
- )
872
- );
873
- }
874
- }
875
-
876
- @include mx.tablet {
877
- &.#{iv.$class-prefix}is-#{$i}-tablet {
878
- @include cv.register-vars(
879
- (
880
- "column-gap": #{$i * 0.25rem},
881
- )
882
- );
883
- }
884
- }
885
-
886
- @include mx.tablet-only {
887
- &.#{iv.$class-prefix}is-#{$i}-tablet-only {
888
- @include cv.register-vars(
889
- (
890
- "column-gap": #{$i * 0.25rem},
891
- )
892
- );
893
- }
894
- }
895
-
896
- @include mx.touch {
897
- &.#{iv.$class-prefix}is-#{$i}-touch {
898
- @include cv.register-vars(
899
- (
900
- "column-gap": #{$i * 0.25rem},
901
- )
902
- );
903
- }
904
- }
905
-
906
- @include mx.desktop {
907
- &.#{iv.$class-prefix}is-#{$i}-desktop {
908
- @include cv.register-vars(
909
- (
910
- "column-gap": #{$i * 0.25rem},
911
- )
912
- );
913
- }
914
- }
915
-
916
- @include mx.desktop-only {
917
- &.#{iv.$class-prefix}is-#{$i}-desktop-only {
918
- @include cv.register-vars(
919
- (
920
- "column-gap": #{$i * 0.25rem},
921
- )
922
- );
923
- }
924
- }
925
-
926
- @include mx.widescreen {
927
- &.#{iv.$class-prefix}is-#{$i}-widescreen {
928
- @include cv.register-vars(
929
- (
930
- "column-gap": #{$i * 0.25rem},
931
- )
932
- );
933
- }
934
- }
935
-
936
- @include mx.widescreen-only {
937
- &.#{iv.$class-prefix}is-#{$i}-widescreen-only {
938
- @include cv.register-vars(
939
- (
940
- "column-gap": #{$i * 0.25rem},
941
- )
942
- );
943
- }
944
- }
945
-
946
- @include mx.fullhd {
947
- &.#{iv.$class-prefix}is-#{$i}-fullhd {
948
- @include cv.register-vars(
949
- (
950
- "column-gap": #{$i * 0.25rem},
951
- )
952
- );
953
- }
954
- }
955
- }
956
- }
957
- }