Skip to content
This repository was archived by the owner on Oct 24, 2023. It is now read-only.

Commit 4b1106d

Browse files
jonathantnealjonathantneal
committed
wip
1 parent d5af5ac commit 4b1106d

File tree

3 files changed

+22
-143
lines changed

3 files changed

+22
-143
lines changed

‎src/lib/plugins-by-id.js

-6
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,6 @@ import postcssAttributeCaseInsensitive from 'postcss-attribute-case-insensitive'
22
import postcssBlankPseudo from 'css-blank-pseudo/postcss';
33
import postcssColorFunctionalNotation from 'postcss-color-functional-notation';
44
import postcssColorHexAlpha from 'postcss-color-hex-alpha';
5-
import postcssColorModFunction from 'postcss-color-mod-function';
65
import postcssColorRebeccapurple from 'postcss-color-rebeccapurple';
76
import postcssCustomMedia from 'postcss-custom-media';
87
import postcssCustomProperties from 'postcss-custom-properties';
@@ -17,7 +16,6 @@ import postcssFontFamilySystemUi from '../patch/postcss-system-ui-font-family';
1716
import postcssGapProperties from 'postcss-gap-properties';
1817
import postcssHasPseudo from 'css-has-pseudo/postcss';
1918
import postcssImageSetPolyfill from 'postcss-image-set-function';
20-
import postcssInitial from 'postcss-initial';
2119
import postcssLabFunction from 'postcss-lab-function';
2220
import postcssLogical from 'postcss-logical';
2321
import postcssMediaMinmax from 'postcss-media-minmax';
@@ -28,18 +26,15 @@ import postcssPlace from 'postcss-place';
2826
import postcssPrefersColorScheme from 'css-prefers-color-scheme/postcss';
2927
import postcssPseudoClassAnyLink from 'postcss-pseudo-class-any-link';
3028
import postcssReplaceOverflowWrap from 'postcss-replace-overflow-wrap';
31-
import postcssSelectorMatches from 'postcss-selector-matches';
3229
import postcssSelectorNot from 'postcss-selector-not';
3330

3431
// postcss plugins ordered by id
3532
export default {
36-
'all-property': postcssInitial,
3733
'any-link-pseudo-class': postcssPseudoClassAnyLink,
3834
'blank-pseudo-class': postcssBlankPseudo,
3935
'break-properties': postcssPageBreak,
4036
'case-insensitive-attributes': postcssAttributeCaseInsensitive,
4137
'color-functional-notation': postcssColorFunctionalNotation,
42-
'color-mod-function': postcssColorModFunction,
4338
'custom-media-queries': postcssCustomMedia,
4439
'custom-properties': postcssCustomProperties,
4540
'custom-selectors': postcssCustomSelectors,
@@ -55,7 +50,6 @@ export default {
5550
'image-set-function': postcssImageSetPolyfill,
5651
'lab-function': postcssLabFunction,
5752
'logical-properties-and-values': postcssLogical,
58-
'matches-pseudo-class': postcssSelectorMatches,
5953
'media-query-ranges': postcssMediaMinmax,
6054
'nesting-rules': postcssNesting,
6155
'not-pseudo-class': postcssSelectorNot,

‎src/patch/postcss-system-ui-font-family.js

+10-7
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,13 @@
1-
import postcss from 'postcss';
2-
3-
export default postcss.plugin('postcss-system-ui-font', () => root => {
4-
root.walkDecls(propertyRegExp, decl => {
5-
decl.value = decl.value.replace(systemUiMatch, systemUiReplace);
6-
});
7-
});
1+
export default function postcssSystemUiFont() {
2+
return {
3+
postcssPlugin: 'postcss-system-ui-font',
4+
Declaration(/** @type {import('postcss').Declaration} */ node) {
5+
if (propertyRegExp.test(node.prop)) {
6+
node.value = node.value.replace(systemUiMatch, systemUiReplace);
7+
}
8+
}
9+
}
10+
}
811

912
const propertyRegExp = /(?:^(?:-|\\002d){2})|(?:^font(?:-family)?$)/i;
1013
const whitespace = '[\\f\\n\\r\\x09\\x20]';

‎test/basic.autoprefixer.false.expect.css

+12-130
Original file line numberDiff line numberDiff line change
@@ -3,38 +3,18 @@
33
}
44

55
.test-custom-properties {
6-
order: 1;
76
order: var(--order);
87
}
98

10-
.test-image-set-function {
11-
background-image: url(img/test.png);
12-
}
13-
14-
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
15-
16-
.test-image-set-function {
17-
background-image: url(img/test-2x.png);
18-
}
19-
}
20-
219
.test-image-set-function {
2210
background-image: image-set(url(img/test.png) 1x, url(img/test-2x.png) 2x);
2311
order: 2;
2412
}
2513

26-
[dir="ltr"] .test-logical-properties-and-values {
27-
margin: 1px 4px 3px 2px;
28-
}
29-
30-
[dir="rtl"] .test-logical-properties-and-values {
31-
margin: 1px 2px 3px 4px;
32-
}
33-
3414
.test-logical-properties-and-values {
15+
margin: logical 1px 2px 3px 4px;
3516
order: 3;
36-
padding-top: 5px;
37-
padding-bottom: 5px;
17+
padding-block: 5px;
3818
}
3919

4020
.test-nesting-rules {
@@ -55,7 +35,7 @@
5535
}
5636
}
5737

58-
@media (min-width: 480px) and (max-width: 767px) {
38+
@media (480px <= width < 768px) {
5939
.test-media-query-ranges {
6040
order: 8;
6141
}
@@ -76,18 +56,18 @@
7656
order: 9;
7757
}
7858

79-
.test-case-insensitive-attributes[frame=hsides],.test-case-insensitive-attributes[frame=Hsides],.test-case-insensitive-attributes[frame=hSides],.test-case-insensitive-attributes[frame=HSides],.test-case-insensitive-attributes[frame=hsIdes],.test-case-insensitive-attributes[frame=HsIdes],.test-case-insensitive-attributes[frame=hSIdes],.test-case-insensitive-attributes[frame=HSIdes],.test-case-insensitive-attributes[frame=hsiDes],.test-case-insensitive-attributes[frame=HsiDes],.test-case-insensitive-attributes[frame=hSiDes],.test-case-insensitive-attributes[frame=HSiDes],.test-case-insensitive-attributes[frame=hsIDes],.test-case-insensitive-attributes[frame=HsIDes],.test-case-insensitive-attributes[frame=hSIDes],.test-case-insensitive-attributes[frame=HSIDes],.test-case-insensitive-attributes[frame=hsidEs],.test-case-insensitive-attributes[frame=HsidEs],.test-case-insensitive-attributes[frame=hSidEs],.test-case-insensitive-attributes[frame=HSidEs],.test-case-insensitive-attributes[frame=hsIdEs],.test-case-insensitive-attributes[frame=HsIdEs],.test-case-insensitive-attributes[frame=hSIdEs],.test-case-insensitive-attributes[frame=HSIdEs],.test-case-insensitive-attributes[frame=hsiDEs],.test-case-insensitive-attributes[frame=HsiDEs],.test-case-insensitive-attributes[frame=hSiDEs],.test-case-insensitive-attributes[frame=HSiDEs],.test-case-insensitive-attributes[frame=hsIDEs],.test-case-insensitive-attributes[frame=HsIDEs],.test-case-insensitive-attributes[frame=hSIDEs],.test-case-insensitive-attributes[frame=HSIDEs],.test-case-insensitive-attributes[frame=hsideS],.test-case-insensitive-attributes[frame=HsideS],.test-case-insensitive-attributes[frame=hSideS],.test-case-insensitive-attributes[frame=HSideS],.test-case-insensitive-attributes[frame=hsIdeS],.test-case-insensitive-attributes[frame=HsIdeS],.test-case-insensitive-attributes[frame=hSIdeS],.test-case-insensitive-attributes[frame=HSIdeS],.test-case-insensitive-attributes[frame=hsiDeS],.test-case-insensitive-attributes[frame=HsiDeS],.test-case-insensitive-attributes[frame=hSiDeS],.test-case-insensitive-attributes[frame=HSiDeS],.test-case-insensitive-attributes[frame=hsIDeS],.test-case-insensitive-attributes[frame=HsIDeS],.test-case-insensitive-attributes[frame=hSIDeS],.test-case-insensitive-attributes[frame=HSIDeS],.test-case-insensitive-attributes[frame=hsidES],.test-case-insensitive-attributes[frame=HsidES],.test-case-insensitive-attributes[frame=hSidES],.test-case-insensitive-attributes[frame=HSidES],.test-case-insensitive-attributes[frame=hsIdES],.test-case-insensitive-attributes[frame=HsIdES],.test-case-insensitive-attributes[frame=hSIdES],.test-case-insensitive-attributes[frame=HSIdES],.test-case-insensitive-attributes[frame=hsiDES],.test-case-insensitive-attributes[frame=HsiDES],.test-case-insensitive-attributes[frame=hSiDES],.test-case-insensitive-attributes[frame=HSiDES],.test-case-insensitive-attributes[frame=hsIDES],.test-case-insensitive-attributes[frame=HsIDES],.test-case-insensitive-attributes[frame=hSIDES],.test-case-insensitive-attributes[frame=HSIDES] {
59+
.test-case-insensitive-attributes[frame=hsides i] {
8060
order: 10;
8161
}
8262

8363
.test-rebeccapurple-color {
84-
color: #639;
64+
color: rebeccapurple;
8565
order: 11;
8666
}
8767

8868
.test-hexadecimal-alpha-notation {
89-
background-color: rgba(243,243,243,0.95294);
90-
color: rgba(0,0,0,0.2);
69+
background-color: #f3f3f3f3;
70+
color: #0003;
9171
order: 12;
9272
}
9373

@@ -97,8 +77,8 @@
9777
}
9878

9979
.test-lab-function {
100-
background-color: rgb(178, 34, 34);
101-
color: rgba(178, 34, 34, 0.5);
80+
background-color: lab(40% 56.6 39);
81+
color: lch(40% 68.8 34.5 / 50%);
10282
order: 14;
10383
}
10484

@@ -108,96 +88,11 @@
10888
}
10989

11090
.test-font-variant-property {
111-
font-feature-settings: "c2sc";
11291
font-variant-caps: small-caps;
11392
order: 16;
11493
}
11594

11695
.test-all-property {
117-
animation: none 0s ease 0s 1 normal none running;
118-
backface-visibility: visible;
119-
background: transparent none repeat 0 0 / auto auto padding-box border-box scroll;
120-
border: medium none currentColor;
121-
border-collapse: separate;
122-
border-image: none;
123-
border-radius: 0;
124-
border-spacing: 0;
125-
bottom: auto;
126-
box-shadow: none;
127-
box-sizing: content-box;
128-
caption-side: top;
129-
clear: none;
130-
clip: auto;
131-
color: #000;
132-
columns: auto;
133-
column-count: auto;
134-
column-fill: balance;
135-
grid-column-gap: normal;
136-
column-gap: normal;
137-
column-rule: medium none currentColor;
138-
column-span: 1;
139-
column-width: auto;
140-
content: normal;
141-
counter-increment: none;
142-
counter-reset: none;
143-
cursor: auto;
144-
direction: ltr;
145-
display: inline;
146-
empty-cells: show;
147-
float: none;
148-
font-family: serif;
149-
font-size: medium;
150-
font-style: normal;
151-
font-feature-settings: normal;
152-
font-variant: normal;
153-
font-weight: normal;
154-
font-stretch: normal;
155-
line-height: normal;
156-
height: auto;
157-
hyphens: none;
158-
left: auto;
159-
letter-spacing: normal;
160-
list-style: disc outside none;
161-
margin: 0;
162-
max-height: none;
163-
max-width: none;
164-
min-height: 0;
165-
min-width: 0;
166-
opacity: 1;
167-
orphans: 2;
168-
outline: medium none invert;
169-
overflow: visible;
170-
overflow-x: visible;
171-
overflow-y: visible;
172-
padding: 0;
173-
page-break-after: auto;
174-
page-break-before: auto;
175-
page-break-inside: auto;
176-
perspective: none;
177-
perspective-origin: 50% 50%;
178-
position: static;
179-
right: auto;
180-
tab-size: 8;
181-
table-layout: auto;
182-
text-align: left;
183-
text-align-last: auto;
184-
text-decoration: none;
185-
text-indent: 0;
186-
text-shadow: none;
187-
text-transform: none;
188-
top: auto;
189-
transform: none;
190-
transform-origin: 50% 50% 0;
191-
transform-style: flat;
192-
transition: none 0s ease 0s;
193-
unicode-bidi: normal;
194-
vertical-align: baseline;
195-
visibility: visible;
196-
white-space: normal;
197-
widows: 2;
198-
width: auto;
199-
word-spacing: normal;
200-
z-index: auto;
20196
all: initial;
20297
order: 17;
20398
}
@@ -206,48 +101,35 @@
206101
order: 18;
207102
}
208103

209-
.test-not-pseudo-class:not(:first-child):not(.special) {
104+
.test-not-pseudo-class:not(:first-child, .special) {
210105
order: 19;
211106
}
212107

213-
.test-any-link-pseudo-class:link,.test-any-link-pseudo-class:visited {
214-
order: 20;
215-
}
216-
217108
.test-any-link-pseudo-class:any-link {
218109
order: 20;
219110
}
220111

221-
[dir="rtl"] .test-dir-pseudo-class {
112+
.test-dir-pseudo-class:dir(rtl) {
222113
order: 21;
223114
}
224115

225116
.test-overflow-wrap-property {
226117
order: 22;
227-
word-wrap: break-word;
228-
}
229-
230-
.test-focus-visible-pseudo-class.focus-visible {
231-
order: 23;
118+
overflow-wrap: break-word;
232119
}
233120

234121
.test-focus-visible-pseudo-class:focus-visible {
235122
order: 23;
236123
}
237124

238125
.test-double-position-gradients {
239-
background-image: conic-gradient(yellowgreen 40%, gold 0deg, gold 75%, #f06 0deg);
240126
background-image: conic-gradient(yellowgreen 40%, gold 0deg 75%, #f06 0deg);
241127
}
242128

243129
.test-blank-pseudo-class:blank {
244130
background-color: yellow;
245131
}
246132

247-
.test-has-pseudo-class[\:has\(.inner-class\)] {
248-
background-color: yellow;
249-
}
250-
251133
.test-has-pseudo-class:has(.inner-class) {
252134
background-color: yellow;
253135
}

0 commit comments

Comments
 (0)