Skip to content

Commit 1d75b9d

Browse files
SarmagedSarmaged
authored
release: version 2025.1.25 (#8)
1 parent 9eb6490 commit 1d75b9d

File tree

6 files changed

+327
-183
lines changed

6 files changed

+327
-183
lines changed

‎media.css‎

Lines changed: 2 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "style-forge.media",
3-
"version": "2025.1.24",
3+
"version": "2025.1.25",
44
"description": "Style-Forge.Media: comprehensive CSS media query helpers for responsive web design.",
55
"type": "module",
66
"main": "media.css",

‎src/mobile/gap.css‎

Lines changed: 137 additions & 74 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,11 @@
11
@media only screen and (max-width: 600px) {
22
/* flex */
33
.\@mob\:d\:f, .\@mob\:d\:f\:x, .\@mob\:d\:f\:y {
4+
--sf-gap-x: var(--sf-gap-x-sm);
5+
--sf-gap-y: var(--sf-gap-y-sm);
6+
47
row-gap: var(--sf-gap-y);
58
column-gap: var(--sf-gap-x);
6-
margin-top: calc(var(--sf-gap-y) * 0);
7-
margin-left: calc(var(--sf-gap-x) * 0);
89
}
910

1011
.\@mob\:d\:f > *, .\@mob\:d\:f\:x > *, .\@mob\:d\:f\:y > * {
@@ -33,6 +34,9 @@
3334

3435
/* grid */
3536
.\@mob\:d\:g, .\@mob\:d\:g\:x, .\@mob\:d\:g\:y {
37+
--sf-gap-x: var(--sf-gap-x-sm);
38+
--sf-gap-y: var(--sf-gap-y-sm);
39+
3640
row-gap: var(--sf-gap-y);
3741
column-gap: var(--sf-gap-x);
3842
}
@@ -43,7 +47,13 @@
4347
}
4448

4549
/* inline */
46-
.\@mob\:\$d\:i { margin-top: calc(var(--sf-gap-y) * -1); margin-left: calc(var(--sf-gap-x) * -1) }
50+
.\@mob\:\$d\:i {
51+
--sf-gap-x: var(--sf-gap-x-sm);
52+
--sf-gap-y: var(--sf-gap-y-sm);
53+
54+
margin-top: calc(var(--sf-gap-y) * -1);
55+
margin-left: calc(var(--sf-gap-x) * -1);
56+
}
4757
.\@mob\:\$d\:i > * { margin-top: var(--sf-gap-y); margin-left: var(--sf-gap-x) }
4858

4959
.\$d\:i > .\@mob\:\$d\:i,
@@ -71,6 +81,9 @@
7181
.\@mob\:cols\:11,
7282
.\@mob\:cols\:12
7383
{
84+
--sf-gap-x: var(--sf-gap-x-sm);
85+
--sf-gap-y: var(--sf-gap-y-sm);
86+
7487
margin-top: calc(var(--sf-gap-y) * -1);
7588
margin-left: calc(var(--sf-gap-x) * -1);
7689
}
@@ -141,14 +154,6 @@
141154
{ padding-top: var(--sf-gap-y) }
142155

143156
/* gap */
144-
.\@mob\:gap { --sf-gap-x: 0.5em; --sf-gap-y: 0.5em }
145-
.\@mob\:gap\:x { --sf-gap-x: 0.5em }
146-
.\@mob\:gap\:y { --sf-gap-y: 0.5em }
147-
148-
.\@mob\:gap\:0 { --sf-gap-x: 0em; --sf-gap-y: 0em }
149-
.\@mob\:gap\:x\:0 { --sf-gap-x: 0em }
150-
.\@mob\:gap\:y\:0 { --sf-gap-y: 0em }
151-
152157
.\@mob\:gap:not(.d\:f):not(.d\:f\:x):not(.d\:f\:y):not(.d\:g):not(.d\:g\:x):not(.d\:g\:y):not(.\@mob\:d\:f):not(.\@mob\:d\:f\:x):not(.\@mob\:d\:f\:y):not(.\@mob\:d\:g):not(.\@mob\:d\:g\:x):not(.\@mob\:d\:g\:y) { margin-top: calc(var(--sf-gap-y) * -1); margin-left: calc(var(--sf-gap-x) * -1) }
153158
.\@mob\:gap\:x:not(.d\:f):not(.d\:f\:x):not(.d\:f\:y):not(.d\:g):not(.d\:g\:x):not(.d\:g\:y):not(.\@mob\:d\:f):not(.\@mob\:d\:f\:x):not(.\@mob\:d\:f\:y):not(.\@mob\:d\:g):not(.\@mob\:d\:g\:x):not(.\@mob\:d\:g\:y) { margin-left: calc(var(--sf-gap-x) * -1) }
154159
.\@mob\:gap\:y:not(.d\:f):not(.d\:f\:x):not(.d\:f\:y):not(.d\:g):not(.d\:g\:x):not(.d\:g\:y):not(.\@mob\:d\:f):not(.\@mob\:d\:f\:x):not(.\@mob\:d\:f\:y):not(.\@mob\:d\:g):not(.\@mob\:d\:g\:x):not(.\@mob\:d\:g\:y) { margin-top: calc(var(--sf-gap-y) * -1) }
@@ -157,9 +162,25 @@
157162
.\@mob\:gap\:x:not([class*='cols']):not(.d\:f):not(.d\:f\:x):not(.d\:f\:y):not(.d\:g):not(.d\:g\:x):not(.d\:g\:y):not(.\@mob\:d\:f):not(.\@mob\:d\:f\:x):not(.\@mob\:d\:f\:y):not(.\@mob\:d\:g):not(.\@mob\:d\:g\:x):not(.\@mob\:d\:g\:y) > * { margin-left: var(--sf-gap-x) }
158163
.\@mob\:gap\:y:not([class*='cols']):not(.d\:f):not(.d\:f\:x):not(.d\:f\:y):not(.d\:g):not(.d\:g\:x):not(.d\:g\:y):not(.\@mob\:d\:f):not(.\@mob\:d\:f\:x):not(.\@mob\:d\:f\:y):not(.\@mob\:d\:g):not(.\@mob\:d\:g\:x):not(.\@mob\:d\:g\:y) > * { margin-top: var(--sf-gap-y) }
159164

160-
.\@mob\:gap\:0 { margin-top: 0; margin-left: 0 }
161-
.\@mob\:gap\:x\:0 { margin-left: 0 }
162-
.\@mob\:gap\:y\:0 { margin-top: 0 }
165+
.\@mob\:gap\:xs { --sf-gap-x: var(--sf-gap-x-xs); --sf-gap-y: var(--sf-gap-y-xs) }
166+
.\@mob\:gap\:sm { --sf-gap-x: var(--sf-gap-x-sm); --sf-gap-y: var(--sf-gap-y-sm) }
167+
.\@mob\:gap\:ms { --sf-gap-x: var(--sf-gap-x-ms); --sf-gap-y: var(--sf-gap-y-ms) }
168+
.\@mob\:gap\:ls { --sf-gap-x: var(--sf-gap-x-ls); --sf-gap-y: var(--sf-gap-y-ls) }
169+
.\@mob\:gap\:md { --sf-gap-x: var(--sf-gap-x-md); --sf-gap-y: var(--sf-gap-y-md) }
170+
.\@mob\:gap\:lg { --sf-gap-x: var(--sf-gap-x-lg); --sf-gap-y: var(--sf-gap-y-lg) }
171+
.\@mob\:gap\:xl { --sf-gap-x: var(--sf-gap-x-xl); --sf-gap-y: var(--sf-gap-y-xl) }
172+
173+
.\@mob\:gap\:x\:xs { --sf-gap-x: var(--sf-gap-x-xs) } .gap\:y\:xs { --sf-gap-y: var(--sf-gap-y-xs) }
174+
.\@mob\:gap\:x\:sm { --sf-gap-x: var(--sf-gap-x-sm) } .gap\:y\:sm { --sf-gap-y: var(--sf-gap-y-sm) }
175+
.\@mob\:gap\:x\:ms { --sf-gap-x: var(--sf-gap-x-ms) } .gap\:y\:ms { --sf-gap-y: var(--sf-gap-y-ms) }
176+
.\@mob\:gap\:x\:ls { --sf-gap-x: var(--sf-gap-x-ls) } .gap\:y\:ls { --sf-gap-y: var(--sf-gap-y-ls) }
177+
.\@mob\:gap\:x\:md { --sf-gap-x: var(--sf-gap-x-md) } .gap\:y\:md { --sf-gap-y: var(--sf-gap-y-md) }
178+
.\@mob\:gap\:x\:lg { --sf-gap-x: var(--sf-gap-x-lg) } .gap\:y\:lg { --sf-gap-y: var(--sf-gap-y-lg) }
179+
.\@mob\:gap\:x\:xl { --sf-gap-x: var(--sf-gap-x-xl) } .gap\:y\:xl { --sf-gap-y: var(--sf-gap-y-xl) }
180+
181+
.\@mob\:gap\:0 { --sf-gap-x: 0em; --sf-gap-y: 0em; margin-top: 0; margin-left: 0 }
182+
.\@mob\:gap\:x\:0 { --sf-gap-x: 0em; margin-left: 0 }
183+
.\@mob\:gap\:y\:0 { --sf-gap-y: 0em; margin-top: 0 }
163184

164185
.\@mob\:gap\:0 > * { margin-top: 0; margin-left: 0 }
165186
.\@mob\:gap\:x\:0 > * { margin-left: 0 }
@@ -386,73 +407,115 @@
386407
html.var [class*='@mob:cols'] > [class*='col']:not([class*='col:start']) { margin-left: 0 }
387408

388409
html.var .\@mob\:gap[class*='cols'] > [class*='col'] { padding-top: 0.5em; padding-left: 0.5em }
410+
411+
html.var .\@mob\:gap\:x[class*='cols'] { margin-left: -0.5em }
389412
html.var .\@mob\:gap\:x[class*='cols'] > [class*='col'] { padding-left: 0.5em }
413+
414+
html.var .\@mob\:gap\:y[class*='cols'] { margin-top: -0.5em }
390415
html.var .\@mob\:gap\:y[class*='cols'] > [class*='col'] { padding-top: 0.5em }
391416

417+
html.var .\@mob\:gap\:xs[class*='cols'] { margin-top: -0.25em; margin-left: -0.25em }
418+
html.var .\@mob\:gap\:sm[class*='cols'] { margin-top: -0.5em; margin-left: -0.5em }
419+
html.var .\@mob\:gap\:ms[class*='cols'] { margin-top: -0.75em; margin-left: -0.75em }
420+
html.var .\@mob\:gap\:ls[class*='cols'] { margin-top: -0.85em; margin-left: -0.85em }
421+
html.var .\@mob\:gap\:md[class*='cols'] { margin-top: -1em; margin-left: -1em }
422+
html.var .\@mob\:gap\:lg[class*='cols'] { margin-top: -1.5em; margin-left: -1.5em }
423+
html.var .\@mob\:gap\:xl[class*='cols'] { margin-top: -2em; margin-left: -2em }
424+
425+
html.var .\@mob\:gap\:xs[class*='cols'] > [class*='col'] { margin-top: 0; padding-top: 0.25em; padding-left: 0.25em }
426+
html.var .\@mob\:gap\:sm[class*='cols'] > [class*='col'] { margin-top: 0; padding-top: 0.5em; padding-left: 0.5em }
427+
html.var .\@mob\:gap\:ms[class*='cols'] > [class*='col'] { margin-top: 0; padding-top: 0.75em; padding-left: 0.75em }
428+
html.var .\@mob\:gap\:ls[class*='cols'] > [class*='col'] { margin-top: 0; padding-top: 0.85em; padding-left: 0.85em }
429+
html.var .\@mob\:gap\:md[class*='cols'] > [class*='col'] { margin-top: 0; padding-top: 1em; padding-left: 1em }
430+
html.var .\@mob\:gap\:lg[class*='cols'] > [class*='col'] { margin-top: 0; padding-top: 1.5em; padding-left: 1.5em }
431+
html.var .\@mob\:gap\:xl[class*='cols'] > [class*='col'] { margin-top: 0; padding-top: 2em; padding-left: 2em }
432+
433+
html.var .\@mob\:gap\:xs[class*='cols'] > [class*='col']:not([class*='col:start']) { margin-left: 0 }
434+
html.var .\@mob\:gap\:sm[class*='cols'] > [class*='col']:not([class*='col:start']) { margin-left: 0 }
435+
html.var .\@mob\:gap\:ms[class*='cols'] > [class*='col']:not([class*='col:start']) { margin-left: 0 }
436+
html.var .\@mob\:gap\:ls[class*='cols'] > [class*='col']:not([class*='col:start']) { margin-left: 0 }
437+
html.var .\@mob\:gap\:md[class*='cols'] > [class*='col']:not([class*='col:start']) { margin-left: 0 }
438+
html.var .\@mob\:gap\:lg[class*='cols'] > [class*='col']:not([class*='col:start']) { margin-left: 0 }
439+
html.var .\@mob\:gap\:xl[class*='cols'] > [class*='col']:not([class*='col:start']) { margin-left: 0 }
440+
441+
html.var .\@mob\:gap\:x\:xs[class*='cols'] { margin-left: -0.25em }
442+
html.var .\@mob\:gap\:x\:sm[class*='cols'] { margin-left: -0.5em }
443+
html.var .\@mob\:gap\:x\:ms[class*='cols'] { margin-left: -0.75em }
444+
html.var .\@mob\:gap\:x\:ls[class*='cols'] { margin-left: -0.85em }
445+
html.var .\@mob\:gap\:x\:md[class*='cols'] { margin-left: -1em }
446+
html.var .\@mob\:gap\:x\:lg[class*='cols'] { margin-left: -1.5em }
447+
html.var .\@mob\:gap\:x\:xl[class*='cols'] { margin-left: -2em }
448+
449+
html.var .\@mob\:gap\:x\:xs[class*='cols'] > [class*='col'] { padding-left: 0.25em }
450+
html.var .\@mob\:gap\:x\:sm[class*='cols'] > [class*='col'] { padding-left: 0.5em }
451+
html.var .\@mob\:gap\:x\:ms[class*='cols'] > [class*='col'] { padding-left: 0.75em }
452+
html.var .\@mob\:gap\:x\:ls[class*='cols'] > [class*='col'] { padding-left: 0.85em }
453+
html.var .\@mob\:gap\:x\:md[class*='cols'] > [class*='col'] { padding-left: 1em }
454+
html.var .\@mob\:gap\:x\:lg[class*='cols'] > [class*='col'] { padding-left: 1.5em }
455+
html.var .\@mob\:gap\:x\:xl[class*='cols'] > [class*='col'] { padding-left: 2em }
456+
457+
html.var .\@mob\:gap\:y\:xs[class*='cols'] { margin-top: -0.25em }
458+
html.var .\@mob\:gap\:y\:sm[class*='cols'] { margin-top: -0.5em }
459+
html.var .\@mob\:gap\:y\:ms[class*='cols'] { margin-top: -0.75em }
460+
html.var .\@mob\:gap\:y\:ls[class*='cols'] { margin-top: -0.85em }
461+
html.var .\@mob\:gap\:y\:md[class*='cols'] { margin-top: -1em }
462+
html.var .\@mob\:gap\:y\:lg[class*='cols'] { margin-top: -1.5em }
463+
html.var .\@mob\:gap\:y\:xl[class*='cols'] { margin-top: -2em }
464+
465+
html.var .\@mob\:gap\:y\:xs[class*='cols'] > [class*='col'] { padding-top: 0.25em }
466+
html.var .\@mob\:gap\:y\:sm[class*='cols'] > [class*='col'] { padding-top: 0.5em }
467+
html.var .\@mob\:gap\:y\:ms[class*='cols'] > [class*='col'] { padding-top: 0.75em }
468+
html.var .\@mob\:gap\:y\:ls[class*='cols'] > [class*='col'] { padding-top: 0.85em }
469+
html.var .\@mob\:gap\:y\:md[class*='cols'] > [class*='col'] { padding-top: 1em }
470+
html.var .\@mob\:gap\:y\:lg[class*='cols'] > [class*='col'] { padding-top: 1.5em }
471+
html.var .\@mob\:gap\:y\:xl[class*='cols'] > [class*='col'] { padding-top: 2em }
472+
473+
html.var .\@mob\:gap\:0[class*='cols'] { margin-top: 0; margin-left: 0 }
392474
html.var .\@mob\:gap\:0[class*='cols'] > [class*='col'] { padding-top: 0; padding-left: 0 }
475+
476+
html.var .\@mob\:gap\:x\:0[class*='cols'] { margin-left: 0 }
393477
html.var .\@mob\:gap\:x\:0[class*='cols'] > [class*='col'] { padding-left: 0 }
478+
479+
html.var .\@mob\:gap\:y\:0[class*='cols'] { margin-top: 0 }
394480
html.var .\@mob\:gap\:y\:0[class*='cols'] > [class*='col'] { padding-top: 0 }
395481

396482
/* gap */
397483
html.var .\@mob\:gap { margin-top: -0.5em; margin-left: -0.5em }
398-
html.var .\@mob\:gap\:x { margin-left: -0.5em }
399-
html.var .\@mob\:gap\:y { margin-top: -0.5em }
400-
401-
html.var .\@mob\:gap > * { margin-top: 0.5em; margin-left: 0.5em }
402-
html.var .\@mob\:gap\:x > * { margin-left: 0.5em }
403-
html.var .\@mob\:gap\:y > * { margin-top: 0.5em }
404-
405-
html.var .gap\:0.\@mob\:d\:f, html.var .gap\:0.\@mob\:d\:f\:x, html.var .gap\:0.\@mob\:d\:f\:y,
406-
html.var .gap\:0.\@mob\:d\:g, html.var .gap\:0.\@mob\:d\:g\:x, html.var .gap\:0.\@mob\:d\:g\:y,
407-
html.var .\@mob\:gap\:0.d\:f, html.var .\@mob\:gap\:0.d\:f\:x, html.var .\@mob\:gap\:0.d\:f\:y,
408-
html.var .\@mob\:gap\:0.d\:g, html.var .\@mob\:gap\:0.d\:g\:x, html.var .\@mob\:gap\:0.d\:g\:y,
409-
html.var .\@mob\:gap\:0.\@mob\:d\:f, html.var .\@mob\:gap\:0.\@mob\:d\:f\:x, html.var .\@mob\:gap\:0.\@mob\:d\:f\:y,
410-
html.var .\@mob\:gap\:0.\@mob\:d\:g, html.var .\@mob\:gap\:0.\@mob\:d\:g\:x, html.var .\@mob\:gap\:0.\@mob\:d\:g\:y,
411-
html.var .\@mob\:gap\:0
412-
{ margin-top: 0; margin-left: 0 }
413-
414-
html.var .gap\:x\:0.\@mob\:d\:f, html.var .gap\:x\:0.\@mob\:d\:f\:x, html.var .gap\:x\:0.\@mob\:d\:f\:y,
415-
html.var .gap\:x\:0.\@mob\:d\:g, html.var .gap\:x\:0.\@mob\:d\:g\:x, html.var .gap\:x\:0.\@mob\:d\:g\:y,
416-
html.var .\@mob\:gap\:x\:0.d\:f, html.var .\@mob\:gap\:x\:0.d\:f\:x, html.var .\@mob\:gap\:x\:0.d\:f\:y,
417-
html.var .\@mob\:gap\:x\:0.d\:g, html.var .\@mob\:gap\:x\:0.d\:g\:x, html.var .\@mob\:gap\:x\:0.d\:g\:y,
418-
html.var .\@mob\:gap\:x\:0.\@mob\:d\:f, html.var .\@mob\:gap\:x\:0.\@mob\:d\:f\:x, html.var .\@mob\:gap\:x\:0.\@mob\:d\:f\:y,
419-
html.var .\@mob\:gap\:x\:0.\@mob\:d\:g, html.var .\@mob\:gap\:x\:0.\@mob\:d\:g\:x, html.var .\@mob\:gap\:x\:0.\@mob\:d\:g\:y,
420-
html.var .\@mob\:gap\:x\:0
421-
{ margin-left: 0 }
422-
423-
html.var .gap\:y\:0.\@mob\:d\:f, html.var .gap\:y\:0.\@mob\:d\:f\:x, html.var .gap\:y\:0.\@mob\:d\:f\:y,
424-
html.var .gap\:y\:0.\@mob\:d\:g, html.var .gap\:y\:0.\@mob\:d\:g\:x, html.var .gap\:y\:0.\@mob\:d\:g\:y,
425-
html.var .\@mob\:gap\:y\:0.d\:f, html.var .\@mob\:gap\:y\:0.d\:f\:x, html.var .\@mob\:gap\:y\:0.d\:f\:y,
426-
html.var .\@mob\:gap\:y\:0.d\:g, html.var .\@mob\:gap\:y\:0.d\:g\:x, html.var .\@mob\:gap\:y\:0.d\:g\:y,
427-
html.var .\@mob\:gap\:y\:0.\@mob\:d\:f, html.var .\@mob\:gap\:y\:0.\@mob\:d\:f\:x, html.var .\@mob\:gap\:y\:0.\@mob\:d\:f\:y,
428-
html.var .\@mob\:gap\:y\:0.\@mob\:d\:g, html.var .\@mob\:gap\:y\:0.\@mob\:d\:g\:x, html.var .\@mob\:gap\:y\:0.\@mob\:d\:g\:y,
429-
html.var .\@mob\:gap\:y\:0
430-
{ margin-top: 0 }
431-
432-
html.var .gap\:0.\@mob\:d\:f > *, html.var .gap\:0.\@mob\:d\:f\:x > *, html.var .gap\:0.\@mob\:d\:f\:y > *,
433-
html.var .gap\:0.\@mob\:d\:g > *, html.var .gap\:0.\@mob\:d\:g\:x > *, html.var .gap\:0.\@mob\:d\:g\:y > *,
434-
html.var .\@mob\:gap\:0.d\:f > *, html.var .\@mob\:gap\:0.d\:f\:x > *, html.var .\@mob\:gap\:0.d\:f\:y > *,
435-
html.var .\@mob\:gap\:0.d\:g > *, html.var .\@mob\:gap\:0.d\:g\:x > *, html.var .\@mob\:gap\:0.d\:g\:y > *,
436-
html.var .\@mob\:gap\:0.\@mob\:d\:f > *, html.var .\@mob\:gap\:0.\@mob\:d\:f\:x > *, html.var .\@mob\:gap\:0.\@mob\:d\:f\:y > *,
437-
html.var .\@mob\:gap\:0.\@mob\:d\:g > *, html.var .\@mob\:gap\:0.\@mob\:d\:g\:x > *, html.var .\@mob\:gap\:0.\@mob\:d\:g\:y > *,
438-
html.var .\@mob\:gap\:0 > *, html.var .\@mob\:gap\:0 > *[class*='col:start']
439-
{ margin-top: 0; margin-left: 0 }
440-
441-
html.var .gap\:x\:0.\@mob\:d\:f > *, html.var .gap\:x\:0.\@mob\:d\:f\:x > *, html.var .gap\:x\:0.\@mob\:d\:f\:y > *,
442-
html.var .gap\:x\:0.\@mob\:d\:g > *, html.var .gap\:x\:0.\@mob\:d\:g\:x > *, html.var .gap\:x\:0.\@mob\:d\:g\:y > *,
443-
html.var .\@mob\:gap\:x\:0.d\:f > *, html.var .\@mob\:gap\:x\:0.d\:f\:x > *, html.var .\@mob\:gap\:x\:0.d\:f\:y > *,
444-
html.var .\@mob\:gap\:x\:0.d\:g > *, html.var .\@mob\:gap\:x\:0.d\:g\:x > *, html.var .\@mob\:gap\:x\:0.d\:g\:y > *,
445-
html.var .\@mob\:gap\:x\:0.\@mob\:d\:f > *, html.var .\@mob\:gap\:x\:0.\@mob\:d\:f\:x > *, html.var .\@mob\:gap\:x\:0.\@mob\:d\:f\:y > *,
446-
html.var .\@mob\:gap\:x\:0.\@mob\:d\:g > *, html.var .\@mob\:gap\:x\:0.\@mob\:d\:g\:x > *, html.var .\@mob\:gap\:x\:0.\@mob\:d\:g\:y > *,
447-
html.var .\@mob\:gap\:x\:0 > *, html.var .\@mob\:gap\:x\:0 > *[class*='col:start']
448-
{ margin-left: 0 }
449-
450-
html.var .gap\:y\:0.\@mob\:d\:f > *, html.var .gap\:y\:0.\@mob\:d\:f\:x > *, html.var .gap\:y\:0.\@mob\:d\:f\:y > *,
451-
html.var .gap\:y\:0.\@mob\:d\:g > *, html.var .gap\:y\:0.\@mob\:d\:g\:x > *, html.var .gap\:y\:0.\@mob\:d\:g\:y > *,
452-
html.var .\@mob\:gap\:y\:0.d\:f > *, html.var .\@mob\:gap\:y\:0.d\:f\:x > *, html.var .\@mob\:gap\:y\:0.d\:f\:y > *,
453-
html.var .\@mob\:gap\:y\:0.d\:g > *, html.var .\@mob\:gap\:y\:0.d\:g\:x > *, html.var .\@mob\:gap\:y\:0.d\:g\:y > *,
454-
html.var .\@mob\:gap\:y\:0.\@mob\:d\:f > *, html.var .\@mob\:gap\:y\:0.\@mob\:d\:f\:x > *, html.var .\@mob\:gap\:y\:0.\@mob\:d\:f\:y > *,
455-
html.var .\@mob\:gap\:y\:0.\@mob\:d\:g > *, html.var .\@mob\:gap\:y\:0.\@mob\:d\:g\:x > *, html.var .\@mob\:gap\:y\:0.\@mob\:d\:g\:y > *,
456-
html.var .\@mob\:gap\:y\:0 > *, html.var .\@mob\:gap\:y\:0 > *[class*='col:start']
457-
{ margin-top: 0 }
484+
html.var .\@mob\:gap > * { margin-top: 0.5em } html.var .\@mob\:gap > *:not([class*='col:start']) { margin-left: 0.5em }
485+
html.var .\@mob\:gap\:x { margin-left: -0.5em } html.var .\@mob\:gap\:x > *:not([class*='col:start']) { margin-left: 0.5em }
486+
html.var .\@mob\:gap\:y { margin-top: -0.5em } html.var .\@mob\:gap\:y > * { margin-top: 0.5em }
487+
488+
html.var .\@mob\:gap\:xs { margin-top: -0.25em; margin-left: -0.25em } html.var .\@mob\:gap\:xs > * { margin-top: 0.25em } html.var .\@mob\:gap\:xs > *:not([class*='col:start']) { margin-left: 0.25em }
489+
html.var .\@mob\:gap\:sm { margin-top: -0.5em; margin-left: -0.5em } html.var .\@mob\:gap\:sm > * { margin-top: 0.5em } html.var .\@mob\:gap\:sm > *:not([class*='col:start']) { margin-left: 0.5em }
490+
html.var .\@mob\:gap\:ms { margin-top: -0.75em; margin-left: -0.75em } html.var .\@mob\:gap\:ms > * { margin-top: 0.75em } html.var .\@mob\:gap\:ms > *:not([class*='col:start']) { margin-top: 0.75em }
491+
html.var .\@mob\:gap\:ls { margin-top: -0.85em; margin-left: -0.85em } html.var .\@mob\:gap\:ls > * { margin-top: 0.85em } html.var .\@mob\:gap\:ls > *:not([class*='col:start']) { margin-left: 0.85em }
492+
html.var .\@mob\:gap\:md { margin-top: -1em; margin-left: -1em } html.var .\@mob\:gap\:md > * { margin-top: 1em } html.var .\@mob\:gap\:md > *:not([class*='col:start']) { margin-left: 1em }
493+
html.var .\@mob\:gap\:lg { margin-top: -1.5em; margin-left: -1.5em } html.var .\@mob\:gap\:lg > * { margin-top: 1.5em } html.var .\@mob\:gap\:lg > *:not([class*='col:start']) { margin-left: 1.5em }
494+
html.var .\@mob\:gap\:xl { margin-top: -2em; margin-left: -2em } html.var .\@mob\:gap\:xl > * { margin-top: 2em } html.var .\@mob\:gap\:xl > *:not([class*='col:start']) { margin-left: 2em }
495+
496+
html.var .\@mob\:gap\:x\:xs { margin-left: -0.25em } html.var .\@mob\:gap\:x\:xs > *:not([class*='col:start']) { margin-left: 0.25em }
497+
html.var .\@mob\:gap\:x\:sm { margin-left: -0.5em } html.var .\@mob\:gap\:x\:sm > *:not([class*='col:start']) { margin-left: 0.5em }
498+
html.var .\@mob\:gap\:x\:ms { margin-left: -0.75em } html.var .\@mob\:gap\:x\:ms > *:not([class*='col:start']) { margin-left: 0.75em }
499+
html.var .\@mob\:gap\:x\:ls { margin-left: -0.85em } html.var .\@mob\:gap\:x\:ls > *:not([class*='col:start']) { margin-left: 0.85em }
500+
html.var .\@mob\:gap\:x\:md { margin-left: -1em } html.var .\@mob\:gap\:x\:md > *:not([class*='col:start']) { margin-left: 1em }
501+
html.var .\@mob\:gap\:x\:lg { margin-left: -1.5em } html.var .\@mob\:gap\:x\:lg > *:not([class*='col:start']) { margin-left: 1.5em }
502+
html.var .\@mob\:gap\:x\:xl { margin-left: -2em } html.var .\@mob\:gap\:x\:xl > *:not([class*='col:start']) { margin-left: 2em }
503+
504+
html.var .\@mob\:gap\:y\:xs { margin-top: -0.25em } html.var .\@mob\:gap\:y\:xs > * { margin-top: 0.25em }
505+
html.var .\@mob\:gap\:y\:sm { margin-top: -0.5em } html.var .\@mob\:gap\:y\:sm > * { margin-top: 0.5em }
506+
html.var .\@mob\:gap\:y\:ms { margin-top: -0.75em } html.var .\@mob\:gap\:y\:ms > * { margin-top: 0.75em }
507+
html.var .\@mob\:gap\:y\:ls { margin-top: -0.85em } html.var .\@mob\:gap\:y\:ls > * { margin-top: 0.85em }
508+
html.var .\@mob\:gap\:y\:md { margin-top: -1em } html.var .\@mob\:gap\:y\:md > * { margin-top: 1em }
509+
html.var .\@mob\:gap\:y\:lg { margin-top: -1.5em } html.var .\@mob\:gap\:y\:lg > * { margin-top: 1.5em }
510+
html.var .\@mob\:gap\:y\:xl { margin-top: -2em } html.var .\@mob\:gap\:y\:xl > * { margin-top: 2em }
511+
512+
html.var .\@mob\:gap\:0 { margin-top: 0; margin-left: 0 }
513+
html.var .\@mob\:gap\:0 > * { margin-top: 0 }
514+
html.var .\@mob\:gap\:0 > *:not([class*='col:start']) { margin-left: 0 }
515+
516+
html.var .\@mob\:gap\:x\:0 { margin-left: 0 }
517+
html.var .\@mob\:gap\:x\:0 > *:not([class*='col:start']) { margin-left: 0 }
518+
519+
html.var .\@mob\:gap\:y\:0 { margin-top: 0 }
520+
html.var .\@mob\:gap\:y\:0 > * { margin-top: 0 }
458521
}

0 commit comments

Comments
 (0)