Skip to content

Commit 180b431

Browse files
authored
release: version 2025.1.22 (#6)
1 parent a6ca430 commit 180b431

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

50 files changed

+2371
-2094
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.18",
3+
"version": "2025.1.22",
44
"description": "Style-Forge.Media: comprehensive CSS media query helpers for responsive web design.",
55
"type": "module",
66
"main": "media.css",

src/all.css

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
@import './var.css';
21
@import './hide.css';
32
@import './tablet/all.css';
43
@import './mobile/all.css';

src/mobile/all.css

Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -10,17 +10,22 @@
1010
@import './clear.css';
1111
@import './color.css';
1212
@import './content-position.css';
13-
@import './cursor.css';
1413
@import './display.css';
1514
@import './float.css';
1615
@import './image.css';
1716
@import './margin.css';
17+
@import './mix-blend-mode.css';
1818
@import './op.css';
1919
@import './order.css';
20-
@import './ov.css';
20+
@import './outline.css';
2121
@import './padding.css';
22+
@import './pointer-events.css';
2223
@import './position.css';
2324
@import './radius.css';
25+
@import './resize.css';
26+
@import './scroll.css';
2427
@import './size.css';
2528
@import './text.css';
29+
@import './touch-action.css';
30+
@import './transition.css';
2631
@import './z.css';

src/mobile/background.css

Lines changed: 52 additions & 52 deletions
Original file line numberDiff line numberDiff line change
@@ -1,66 +1,66 @@
11
@media only screen and (max-width: 600px) {
22
.\@mob\:bg\:n { background: none }
33

4-
.\@mob\:bgi\:n { background-image: none }
4+
.\@mob\:bg\:i\:n { background-image: none }
55

6-
.\@mob\:bga\:f { background-attachment: fixed }
7-
.\@mob\:bga\:s { background-attachment: scroll }
6+
.\@mob\:bg\:a\:f { background-attachment: fixed }
7+
.\@mob\:bg\:a\:s { background-attachment: scroll }
88

9-
.\@mob\:bgc\:t { background-color: transparent }
9+
.\@mob\:bg\:c\:t { background-color: transparent }
1010

11-
.\@mob\:bgb\:c { background-blend-mode: color }
12-
.\@mob\:bgb\:cb { background-blend-mode: color-burn }
13-
.\@mob\:bgb\:cd { background-blend-mode: color-dodge }
14-
.\@mob\:bgb\:d { background-blend-mode: darken }
15-
.\@mob\:bgb\:diff { background-blend-mode: difference }
16-
.\@mob\:bgb\:e { background-blend-mode: exclusion }
17-
.\@mob\:bgb\:hl { background-blend-mode: hard-light }
18-
.\@mob\:bgb\:h { background-blend-mode: hue }
19-
.\@mob\:bgb\:l { background-blend-mode: lighten }
20-
.\@mob\:bgb\:lum { background-blend-mode: luminosity }
21-
.\@mob\:bgb\:m { background-blend-mode: multiply }
22-
.\@mob\:bgb\:n { background-blend-mode: normal }
23-
.\@mob\:bgb\:o { background-blend-mode: overlay }
24-
.\@mob\:bgb\:s { background-blend-mode: saturation }
25-
.\@mob\:bgb\:sc { background-blend-mode: screen }
26-
.\@mob\:bgb\:sl { background-blend-mode: soft-light }
11+
.\@mob\:bg\:b\:c { background-blend-mode: color }
12+
.\@mob\:bg\:b\:cb { background-blend-mode: color-burn }
13+
.\@mob\:bg\:b\:cd { background-blend-mode: color-dodge }
14+
.\@mob\:bg\:b\:d { background-blend-mode: darken }
15+
.\@mob\:bg\:b\:diff { background-blend-mode: difference }
16+
.\@mob\:bg\:b\:e { background-blend-mode: exclusion }
17+
.\@mob\:bg\:b\:hl { background-blend-mode: hard-light }
18+
.\@mob\:bg\:b\:h { background-blend-mode: hue }
19+
.\@mob\:bg\:b\:l { background-blend-mode: lighten }
20+
.\@mob\:bg\:b\:lum { background-blend-mode: luminosity }
21+
.\@mob\:bg\:b\:m { background-blend-mode: multiply }
22+
.\@mob\:bg\:b\:n { background-blend-mode: normal }
23+
.\@mob\:bg\:b\:o { background-blend-mode: overlay }
24+
.\@mob\:bg\:b\:s { background-blend-mode: saturation }
25+
.\@mob\:bg\:b\:sc { background-blend-mode: screen }
26+
.\@mob\:bg\:b\:sl { background-blend-mode: soft-light }
2727

28-
.\@mob\:bgbk\:bb { background-break: bounding-box }
29-
.\@mob\:bgbk\:c { background-break: continuous }
30-
.\@mob\:bgbk\:eb { background-break: each-box }
28+
.\@mob\:bg\:bk\:bb { background-break: bounding-box }
29+
.\@mob\:bg\:bk\:c { background-break: continuous }
30+
.\@mob\:bg\:bk\:eb { background-break: each-box }
3131

32-
.\@mob\:bgsz\:a { background-size: auto }
33-
.\@mob\:bgsz\:ct { background-size: contain }
34-
.\@mob\:bgsz\:cv { background-size: cover }
32+
.\@mob\:bg\:sz\:a { background-size: auto }
33+
.\@mob\:bg\:sz\:ct { background-size: contain }
34+
.\@mob\:bg\:sz\:cv { background-size: cover }
3535

36-
.\@mob\:bgp\:tl { background-position: top left }
37-
.\@mob\:bgp\:tc { background-position: top center }
38-
.\@mob\:bgp\:tr { background-position: top right }
39-
.\@mob\:bgp\:cl { background-position: center left }
40-
.\@mob\:bgp\:cc { background-position: center center }
41-
.\@mob\:bgp\:cr { background-position: center right }
42-
.\@mob\:bgp\:bl { background-position: bottom left }
43-
.\@mob\:bgp\:bc { background-position: bottom center }
44-
.\@mob\:bgp\:br { background-position: bottom right }
45-
.\@mob\:bgp\:x50y50 { background-position: 50% 50% }
36+
.\@mob\:bg\:p\:tl { background-position: top left }
37+
.\@mob\:bg\:p\:tc { background-position: top center }
38+
.\@mob\:bg\:p\:tr { background-position: top right }
39+
.\@mob\:bg\:p\:cl { background-position: center left }
40+
.\@mob\:bg\:p\:cc { background-position: center center }
41+
.\@mob\:bg\:p\:cr { background-position: center right }
42+
.\@mob\:bg\:p\:bl { background-position: bottom left }
43+
.\@mob\:bg\:p\:bc { background-position: bottom center }
44+
.\@mob\:bg\:p\:br { background-position: bottom right }
45+
.\@mob\:bg\:p\:x50y50 { background-position: 50% 50% }
4646

47-
.\@mob\:bgr\:n { background-repeat: no-repeat }
48-
.\@mob\:bgr\:x { background-repeat: repeat-x }
49-
.\@mob\:bgr\:y { background-repeat: repeat-y }
50-
.\@mob\:bgr\:r { background-repeat: repeat }
51-
.\@mob\:bgr\:s { background-repeat: space }
52-
.\@mob\:bgr\:r { background-repeat: round }
47+
.\@mob\:bg\:r\:n { background-repeat: no-repeat }
48+
.\@mob\:bg\:r\:x { background-repeat: repeat-x }
49+
.\@mob\:bg\:r\:y { background-repeat: repeat-y }
50+
.\@mob\:bg\:r\:r { background-repeat: repeat }
51+
.\@mob\:bg\:r\:s { background-repeat: space }
52+
.\@mob\:bg\:r\:r { background-repeat: round }
5353

54-
.\@mob\:bgcp\:b { background-clip: border-box }
55-
.\@mob\:bgcp\:p { background-clip: padding-box }
56-
.\@mob\:bgcp\:c { background-clip: content-box }
57-
.\@mob\:bgcp\:t { background-clip: text }
54+
.\@mob\:bg\:cp\:b { background-clip: border-box }
55+
.\@mob\:bg\:cp\:p { background-clip: padding-box }
56+
.\@mob\:bg\:cp\:c { background-clip: content-box }
57+
.\@mob\:bg\:cp\:t { background-clip: text }
5858

59-
.\@mob\:bgo\:b { background-origin: border-box }
60-
.\@mob\:bgo\:p { background-origin: padding-box }
61-
.\@mob\:bgo\:c { background-origin: content-box }
59+
.\@mob\:bg\:o\:b { background-origin: border-box }
60+
.\@mob\:bg\:o\:p { background-origin: padding-box }
61+
.\@mob\:bg\:o\:c { background-origin: content-box }
6262

63-
.\@mob\:bgsz\:f { background-size: 100% 100% }
64-
.\@mob\:bgsz\:h { background-size: 100% auto }
65-
.\@mob\:bgsz\:w { background-size: auto 100% }
63+
.\@mob\:bg\:sz\:f { background-size: 100% 100% }
64+
.\@mob\:bg\:sz\:h { background-size: 100% auto }
65+
.\@mob\:bg\:sz\:w { background-size: auto 100% }
6666
}

src/mobile/border.css

Lines changed: 87 additions & 50 deletions
Original file line numberDiff line numberDiff line change
@@ -1,58 +1,95 @@
11
@media only screen and (max-width: 600px) {
2+
.\@mob\:bd\:c\:i { border-color: inherit }
3+
.\@mob\:bd\:c\:ii { border-color: initial }
4+
5+
.\@mob\:bd\:st { border-style: solid }
6+
.\@mob\:bd\:st\:n { border-style: none }
7+
.\@mob\:bd\:st\:r { border-style: ridge }
8+
.\@mob\:bd\:st\:da { border-style: dashed }
9+
.\@mob\:bd\:st\:do { border-style: dotted }
10+
.\@mob\:bd\:st\:dbl { border-style: double }
11+
.\@mob\:bd\:st\:g { border-style: groove }
12+
.\@mob\:bd\:st\:h { border-style: hidden }
13+
.\@mob\:bd\:st\:in { border-style: inset }
14+
.\@mob\:bd\:st\:out { border-style: outset }
15+
216
.\@mob\:bd\:0 { border: 0 }
3-
.\@mob\:bd, .\@mob\:bd\:1 { border: var(--sf-bdw) solid }
4-
.\@mob\:bd\:2 { border: calc(var(--sf-bdw) * 2) solid }
5-
6-
.\@mob\:bdc\:i { border-color: initial }
7-
8-
.\@mob\:bds { border-style: solid }
9-
.\@mob\:bds\:n { border-style: none }
10-
.\@mob\:bds\:r { border-style: ridge }
11-
.\@mob\:bds\:da { border-style: dashed }
12-
.\@mob\:bds\:do { border-style: dotted }
13-
.\@mob\:bds\:dbl { border-style: double }
14-
.\@mob\:bds\:g { border-style: groove }
15-
.\@mob\:bds\:h { border-style: hidden }
16-
.\@mob\:bds\:i { border-style: inset }
17-
.\@mob\:bds\:o { border-style: outset }
18-
19-
.\@mob\:bdw\:0 { border-width: 0 }
20-
.\@mob\:bdw, .\@mob\:bdw\:1 { border-width: var(--sf-bdw) }
21-
.\@mob\:bdw\:2 { border-width: calc(var(--sf-bdw) * 2) }
22-
23-
.\@mob\:bdyw { border-block-width: var(--sf-bdw) }
24-
.\@mob\:bdxw { border-inline-width: var(--sf-bdw) }
25-
.\@mob\:bdtw { border-block-start-width: var(--sf-bdw) }
26-
.\@mob\:bdlw { border-inline-start-width: var(--sf-bdw) }
27-
.\@mob\:bdrw { border-inline-end-width: var(--sf-bdw) }
28-
.\@mob\:bdbw { border-block-end-width: var(--sf-bdw) }
17+
.\@mob\:bd\:w\:0 { border-width: 0 }
2918

30-
/* /// */
19+
.\@mob\:bd,
20+
.\@mob\:bd\:1 { border: var(--sf-bd-w) solid }
21+
.\@mob\:bd\:2 { border: calc(var(--sf-bd-w) * 2) solid }
22+
23+
.\@mob\:bd\:w,
24+
.\@mob\:bd\:w\:1 { border-width: var(--sf-bd-w) }
25+
.\@mob\:bd\:t\:w { border-block-start-width: var(--sf-bd-w) }
26+
.\@mob\:bd\:r\:w { border-inline-end-width: var(--sf-bd-w) }
27+
.\@mob\:bd\:b\:w { border-block-end-width: var(--sf-bd-w) }
28+
.\@mob\:bd\:l\:w { border-inline-start-width: var(--sf-bd-w) }
29+
.\@mob\:bd\:x\:w { border-inline-width: var(--sf-bd-w) }
30+
.\@mob\:bd\:y\:w { border-block-width: var(--sf-bd-w) }
3131

32-
html.var .\@mob\:bdyw { border-block-width: 1px }
33-
html.var .\@mob\:bdxw { border-inline-width: 1px }
34-
html.var .\@mob\:bdtw { border-block-start-width: 1px }
35-
html.var .\@mob\:bdlw { border-inline-start-width: 1px }
36-
html.var .\@mob\:bdrw { border-inline-end-width: 1px }
37-
html.var .\@mob\:bdbw { border-block-end-width: 1px }
38-
39-
html.mpb .\@mob\:bdtw { border-top-width: 1px }
40-
html.mpb .\@mob\:bdlw { border-left-width: 1px }
41-
html.mpb .\@mob\:bdrw { border-right-width: 1px }
42-
html.mpb .\@mob\:bdbw { border-bottom-width: 1px }
43-
html.mpb .\@mob\:bdyw { border-top-width: 1px; border-bottom-width: 1px }
44-
html.mpb .\@mob\:bdxw { border-left-width: 1px; border-right-width: 1px }
45-
46-
html.mpb .\@mob\:bdtw\:2 { border-top-width: 2px }
47-
html.mpb .\@mob\:bdlw\:2 { border-left-width: 2px }
48-
html.mpb .\@mob\:bdrw\:2 { border-right-width: 2px }
49-
html.mpb .\@mob\:bdbw\:2 { border-bottom-width: 2px }
50-
html.mpb .\@mob\:bdyw\:2 { border-top-width: 2px; border-bottom-width: 2px }
51-
html.mpb .\@mob\:bdxw\:2 { border-left-width: 2px; border-right-width: 2px }
52-
html.mpb .\@mob\:bdw\:2 { border-width: 2px }
53-
54-
html.var .\@mob\:bdw, html.var .\@mob\:bdw\:1 { border-width: 1px }
32+
.\@mob\:bd\:t\:w\:0 { border-block-start-width: 0 }
33+
.\@mob\:bd\:r\:w\:0 { border-inline-end-width: 0 }
34+
.\@mob\:bd\:b\:w\:0 { border-block-end-width: 0 }
35+
.\@mob\:bd\:l\:w\:0 { border-inline-start-width: 0 }
36+
.\@mob\:bd\:x\:w\:0 { border-inline-width: 0 }
37+
.\@mob\:bd\:y\:w\:0 { border-block-width: 0 }
38+
39+
.\@mob\:bd\:w\:2 { border-width: calc(var(--sf-bd-w) * 2) }
40+
.\@mob\:bd\:t\:w\:2 { border-block-start-width: calc(var(--sf-bd-w) * 2) }
41+
.\@mob\:bd\:r\:w\:2 { border-inline-end-width: calc(var(--sf-bd-w) * 2) }
42+
.\@mob\:bd\:b\:w\:2 { border-block-end-width: calc(var(--sf-bd-w) * 2) }
43+
.\@mob\:bd\:l\:w\:2 { border-inline-start-width: calc(var(--sf-bd-w) * 2) }
44+
.\@mob\:bd\:x\:w\:2 { border-inline-width: calc(var(--sf-bd-w) * 2) }
45+
.\@mob\:bd\:y\:w\:2 { border-block-width: calc(var(--sf-bd-w) * 2) }
46+
47+
/* /// */
5548

5649
html.var .\@mob\:bd, html.var .\@mob\:bd\:1 { border: 1px solid }
5750
html.var .\@mob\:bd\:2 { border: 2px solid }
51+
52+
html.var .\@mob\:bd\:w, html.var .\@mob\:bd\:w\:1 { border-width: 1px }
53+
html.var .\@mob\:bd\:t\:w { border-block-start-width: 1px }
54+
html.var .\@mob\:bd\:r\:w { border-inline-end-width: 1px }
55+
html.var .\@mob\:bd\:b\:w { border-block-end-width: 1px }
56+
html.var .\@mob\:bd\:l\:w { border-inline-start-width: 1px }
57+
html.var .\@mob\:bd\:x\:w { border-inline-width: 1px }
58+
html.var .\@mob\:bd\:y\:w { border-block-width: 1px }
59+
60+
html.var .\@mob\:bd\:t\:w\:0 { border-block-start-width: 0 }
61+
html.var .\@mob\:bd\:r\:w\:0 { border-inline-end-width: 0 }
62+
html.var .\@mob\:bd\:b\:w\:0 { border-block-end-width: 0 }
63+
html.var .\@mob\:bd\:l\:w\:0 { border-inline-start-width: 0 }
64+
html.var .\@mob\:bd\:x\:w\:0 { border-inline-width: 0 }
65+
html.var .\@mob\:bd\:y\:w\:0 { border-block-width: 0 }
66+
67+
html.var .\@mob\:bd\:w\:2 { border-width: 2px }
68+
html.var .\@mob\:bd\:t\:w\:2 { border-block-start-width: 2px }
69+
html.var .\@mob\:bd\:r\:w\:2 { border-inline-end-width: 2px }
70+
html.var .\@mob\:bd\:b\:w\:2 { border-block-end-width: 2px }
71+
html.var .\@mob\:bd\:l\:w\:2 { border-inline-start-width: 2px }
72+
html.var .\@mob\:bd\:x\:w\:2 { border-inline-width: 2px }
73+
html.var .\@mob\:bd\:y\:w\:2 { border-block-width: 2px }
74+
75+
html.mpb .\@mob\:bd\:t\:w { border-top-width: 1px }
76+
html.mpb .\@mob\:bd\:r\:w { border-right-width: 1px }
77+
html.mpb .\@mob\:bd\:b\:w { border-bottom-width: 1px }
78+
html.mpb .\@mob\:bd\:l\:w { border-left-width: 1px }
79+
html.mpb .\@mob\:bd\:x\:w { border-left-width: 1px; border-right-width: 1px }
80+
html.mpb .\@mob\:bd\:y\:w { border-top-width: 1px; border-bottom-width: 1px }
81+
82+
html.mpb .\@mob\:bd\:t\:w\:0 { border-top-width: 0 }
83+
html.mpb .\@mob\:bd\:r\:w\:0 { border-right-width: 0 }
84+
html.mpb .\@mob\:bd\:b\:w\:0 { border-bottom-width: 0 }
85+
html.mpb .\@mob\:bd\:l\:w\:0 { border-left-width: 0 }
86+
html.mpb .\@mob\:bd\:x\:w\:0 { border-left-width: 0; border-right-width: 0 }
87+
html.mpb .\@mob\:bd\:y\:w\:0 { border-top-width: 0; border-bottom-width: 0 }
88+
89+
html.mpb .\@mob\:bd\:t\:w\:2 { border-top-width: 2px }
90+
html.mpb .\@mob\:bd\:r\:w\:2 { border-right-width: 2px }
91+
html.mpb .\@mob\:bd\:b\:w\:2 { border-bottom-width: 2px }
92+
html.mpb .\@mob\:bd\:l\:w\:2 { border-left-width: 2px }
93+
html.mpb .\@mob\:bd\:x\:w\:2 { border-left-width: 2px; border-right-width: 2px }
94+
html.mpb .\@mob\:bd\:y\:w\:2 { border-top-width: 2px; border-bottom-width: 2px }
5895
}

src/mobile/color.css

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,5 @@
11
@media only screen and (max-width: 600px) {
22
.\@mob\:c\:t { color: transparent }
3+
.\@mob\:c\:i { color: inherit }
4+
.\@mob\:c\:ii { color: initial }
35
}

0 commit comments

Comments
 (0)