Skip to content

Commit eb9c086

Browse files
romainmenkeAntonio-Laguna
romainmenke
and
Antonio-Laguna
authored
prefers color scheme (#436)
* prefers-color-scheme : cleanup * cleanup * fix * more fixes * Update plugins/css-prefers-color-scheme/CHANGELOG.md Co-authored-by: Antonio Laguna <[email protected]> * peer dependency * import * update change log Co-authored-by: Antonio Laguna <[email protected]>
1 parent 28865ad commit eb9c086

Some content is hidden

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

46 files changed

+1107
-714
lines changed

‎package-lock.json

+5-3
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎plugin-packs/postcss-preset-env/test/basic.autoprefixer.expect.css

-7
Original file line numberDiff line numberDiff line change
@@ -77,13 +77,6 @@
7777
}
7878
}
7979

80-
@media (color-index: 48) {
81-
body {
82-
background-color: black;
83-
color: white;
84-
}
85-
}
86-
8780
@media (color: 48842621) {
8881
body {
8982
background-color: black;

‎plugin-packs/postcss-preset-env/test/basic.autoprefixer.false.expect.css

-7
Original file line numberDiff line numberDiff line change
@@ -77,13 +77,6 @@
7777
}
7878
}
7979

80-
@media (color-index: 48) {
81-
body {
82-
background-color: black;
83-
color: white;
84-
}
85-
}
86-
8780
@media (color: 48842621) {
8881
body {
8982
background-color: black;

‎plugin-packs/postcss-preset-env/test/basic.ch38.expect.css

-7
Original file line numberDiff line numberDiff line change
@@ -78,13 +78,6 @@
7878
}
7979
}
8080

81-
@media (color-index: 48) {
82-
body {
83-
background-color: black;
84-
color: white;
85-
}
86-
}
87-
8881
@media (color: 48842621) {
8982
body {
9083
background-color: black;

‎plugin-packs/postcss-preset-env/test/basic.ch88-ff78-saf10.expect.css

-7
Original file line numberDiff line numberDiff line change
@@ -84,13 +84,6 @@
8484
}
8585
}
8686

87-
@media (color-index: 48) {
88-
body {
89-
background-color: black;
90-
color: white;
91-
}
92-
}
93-
9487
@media (color: 48842621) {
9588
body {
9689
background-color: black;

‎plugin-packs/postcss-preset-env/test/basic.expect.css

-7
Original file line numberDiff line numberDiff line change
@@ -78,13 +78,6 @@
7878
}
7979
}
8080

81-
@media (color-index: 48) {
82-
body {
83-
background-color: black;
84-
color: white;
85-
}
86-
}
87-
8881
@media (color: 48842621) {
8982
body {
9083
background-color: black;

‎plugin-packs/postcss-preset-env/test/basic.ff49.expect.css

-7
Original file line numberDiff line numberDiff line change
@@ -76,13 +76,6 @@
7676
}
7777
}
7878

79-
@media (color-index: 48) {
80-
body {
81-
background-color: black;
82-
color: white;
83-
}
84-
}
85-
8679
@media (color: 48842621) {
8780
body {
8881
background-color: black;

‎plugin-packs/postcss-preset-env/test/basic.ff66.expect.css

-7
Original file line numberDiff line numberDiff line change
@@ -68,13 +68,6 @@
6868
}
6969
}
7070

71-
@media (color-index: 48) {
72-
body {
73-
background-color: black;
74-
color: white;
75-
}
76-
}
77-
7871
@media (color: 48842621) {
7972
body {
8073
background-color: black;

‎plugin-packs/postcss-preset-env/test/basic.ie10.expect.css

-7
Original file line numberDiff line numberDiff line change
@@ -91,13 +91,6 @@
9191
}
9292
}
9393

94-
@media (color-index: 48) {
95-
body {
96-
background-color: black;
97-
color: white;
98-
}
99-
}
100-
10194
@media (color: 48842621) {
10295
body {
10396
background-color: black;

‎plugin-packs/postcss-preset-env/test/basic.nesting.false.expect.css

-7
Original file line numberDiff line numberDiff line change
@@ -78,13 +78,6 @@
7878
}
7979
}
8080

81-
@media (color-index: 48) {
82-
body {
83-
background-color: black;
84-
color: white;
85-
}
86-
}
87-
8881
@media (color: 48842621) {
8982
body {
9083
background-color: black;

‎plugin-packs/postcss-preset-env/test/basic.preserve.true.expect.css

-7
Original file line numberDiff line numberDiff line change
@@ -171,13 +171,6 @@
171171

172172
@custom-media --dark-mode (prefers-color-scheme: dark);
173173

174-
@media (color-index: 48) {
175-
body {
176-
background-color: black;
177-
color: white;
178-
}
179-
}
180-
181174
@media (color: 48842621) {
182175
body {
183176
background-color: black;

‎plugin-packs/postcss-preset-env/test/basic.stage0-ff49.expect.css

-7
Original file line numberDiff line numberDiff line change
@@ -83,13 +83,6 @@
8383
}
8484
}
8585

86-
@media (color-index: 48) {
87-
body {
88-
background-color: black;
89-
color: white;
90-
}
91-
}
92-
9386
@media (color: 48842621) {
9487
body {
9588
background-color: black;

‎plugin-packs/postcss-preset-env/test/basic.stage0-ff66.expect.css

-7
Original file line numberDiff line numberDiff line change
@@ -75,13 +75,6 @@
7575
}
7676
}
7777

78-
@media (color-index: 48) {
79-
body {
80-
background-color: black;
81-
color: white;
82-
}
83-
}
84-
8578
@media (color: 48842621) {
8679
body {
8780
background-color: black;

‎plugin-packs/postcss-preset-env/test/basic.stage0.expect.css

-7
Original file line numberDiff line numberDiff line change
@@ -85,13 +85,6 @@
8585
}
8686
}
8787

88-
@media (color-index: 48) {
89-
body {
90-
background-color: black;
91-
color: white;
92-
}
93-
}
94-
9588
@media (color: 48842621) {
9689
body {
9790
background-color: black;

‎plugin-packs/postcss-preset-env/test/client-side-polyfills.stage-1.expect.css

-6
Original file line numberDiff line numberDiff line change
@@ -14,12 +14,6 @@
1414
order: 4;
1515
}
1616

17-
@media (color-index: 70) {
18-
.b {
19-
order: 5;
20-
}
21-
}
22-
2317
@media (color: 70318723) {
2418
.b {
2519
order: 5;

‎plugin-packs/postcss-preset-env/test/disable-client-side-polyfills.disabled.expect.css

-6
Original file line numberDiff line numberDiff line change
@@ -14,12 +14,6 @@ a:has(> img) {
1414
order: 2;
1515
}
1616

17-
@media (color-index: 48) {
18-
p {
19-
order: 3;
20-
}
21-
}
22-
2317
@media (color: 48842621) {
2418
p {
2519
order: 3;

‎plugin-packs/postcss-preset-env/test/layers-basic.expect.css

-7
Original file line numberDiff line numberDiff line change
@@ -152,13 +152,6 @@
152152
}
153153
}
154154

155-
@media (color-index: 48) {
156-
body:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
157-
background-color: black;
158-
color: white;
159-
}
160-
}
161-
162155
@media (color: 48842621) {
163156
body:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
164157
background-color: black;

‎plugin-packs/postcss-preset-env/test/layers-basic.preserve.true.expect.css

-7
Original file line numberDiff line numberDiff line change
@@ -182,13 +182,6 @@
182182

183183
@custom-media --dark-mode (prefers-color-scheme: dark);
184184

185-
@media (color-index: 48) {
186-
body:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
187-
background-color: black;
188-
color: white;
189-
}
190-
}
191-
192185
@media (color: 48842621) {
193186
body:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
194187
background-color: black;

‎plugins/css-prefers-color-scheme/.gitignore

+1-10
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,6 @@
11
node_modules
2-
dist
32
package-lock.json
43
yarn.lock
5-
browser.js
6-
!src/browser.js
7-
browser.min.js
8-
*.log*
94
*.result.css
105
*.result.css.map
11-
!.editorconfig
12-
!.gitignore
13-
!.rollup.js
14-
!.tape.js
15-
!.travis.yml
6+
dist/*

‎plugins/css-prefers-color-scheme/.tape.mjs

+13-13
Original file line numberDiff line numberDiff line change
@@ -5,18 +5,6 @@ postcssTape(plugin)({
55
'basic': {
66
message: 'supports basic usage'
77
},
8-
'basic:color': {
9-
message: 'supports { mediaQuery: "color" } usage',
10-
options: {
11-
mediaQuery: 'color'
12-
}
13-
},
14-
'basic:color-index': {
15-
message: 'supports { mediaQuery: "color-index" } usage',
16-
options: {
17-
mediaQuery: 'color-index'
18-
}
19-
},
208
'basic:preserve': {
219
message: 'supports { preserve: true } usage',
2210
options: {
@@ -28,5 +16,17 @@ postcssTape(plugin)({
2816
options: {
2917
preserve: false
3018
}
31-
}
19+
},
20+
'examples/example': {
21+
message: 'minimal example',
22+
},
23+
'examples/example:preserve-false': {
24+
message: 'minimal example',
25+
options: {
26+
preserve: false
27+
}
28+
},
29+
'browser': {
30+
message: 'css for browser tests',
31+
},
3232
});

‎plugins/css-prefers-color-scheme/CHANGELOG.md

+48
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,53 @@
11
# Changes to Prefers Color Scheme
22

3+
### Unreleased (major)
4+
5+
[Read the full changelog](https://github.com/csstools/postcss-plugins/wiki/PostCSS-Preset-Env-8)
6+
7+
- Breaking: removed old CDN urls
8+
- Breaking: remove `color-depth` queries fallback
9+
- Breaking: remove 'no-preference' support as this was dropped from the spec
10+
- Breaking: remove old global object
11+
12+
#### How to migrate :
13+
14+
##### Re-build your CSS with the new version of the library.
15+
16+
17+
##### If you use a CDN url, please update it.
18+
19+
```diff
20+
- <script src="https://unpkg.com/css-prefers-color-scheme/browser"></script>
21+
+ <script src="https://unpkg.com/css-prefers-color-scheme/dist/browser-global.js"></script>
22+
```
23+
24+
```diff
25+
- <script src="https://unpkg.com/css-prefers-color-scheme/browser.min"></script>
26+
+ <script src="https://unpkg.com/css-prefers-color-scheme/dist/browser-global.js"></script>
27+
```
28+
29+
##### Use `prefersColorSchemeInit` to initialize the polyfill in the browser.
30+
31+
```diff
32+
- initPrefersColorScheme()
33+
+ prefersColorSchemeInit()
34+
```
35+
36+
##### Remove `@media (prefer-color-scheme: no-preference)` from your CSS.
37+
38+
`@media (prefers-color-scheme: no-preference)` was removed from the specification and should be equivalent to not having any media query.
39+
40+
```diff
41+
- @media (prefers-color-scheme: no-preference) {
42+
- .some-selector {
43+
- /* your styles ... */
44+
- }
45+
- }
46+
+ .some-selector {
47+
+ /* your styles ... */
48+
+ }
49+
```
50+
351
### 6.0.3 (January 31, 2022)
452

553
- Fix `preserve: false` option.

0 commit comments

Comments
 (0)