Skip to content

clarify browser polyfills #943

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 4 additions & 0 deletions plugins/css-blank-pseudo/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,10 @@
[PostCSS Blank Pseudo] lets you style form elements when they are empty, following
the [Selectors Level 4] specification.

To use this feature you need to do two things :
- add the [PostCSS plugin](#usage) that transforms the selector into a class or attribute
- add the [browser polyfill](#browser) that sets the attribute or class on elements in a browser

```pcss
input:blank {
background-color: yellow;
Expand Down
4 changes: 4 additions & 0 deletions plugins/css-blank-pseudo/docs/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,10 @@
[<humanReadableName>] lets you style form elements when they are empty, following
the [Selectors Level 4] specification.

To use this feature you need to do two things :
- add the [PostCSS plugin](#usage) that transforms the selector into a class or attribute
- add the [browser polyfill](#browser) that sets the attribute or class on elements in a browser

```pcss
<example.css>

Expand Down
4 changes: 4 additions & 0 deletions plugins/css-has-pseudo/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,10 @@

[PostCSS Has Pseudo] lets you style elements relative to other elements in CSS, following the [Selectors Level 4] specification.

To use this feature you need to do two things :
- add the [PostCSS plugin](#usage) that transforms the selector into a class or attribute
- add the [browser polyfill](#browser) that sets the attribute or class on elements in a browser

```pcss
.title:has(+ p) {
margin-bottom: 1.5rem;
Expand Down
4 changes: 4 additions & 0 deletions plugins/css-has-pseudo/docs/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,10 @@

[<humanReadableName>] lets you style elements relative to other elements in CSS, following the [Selectors Level 4] specification.

To use this feature you need to do two things :
- add the [PostCSS plugin](#usage) that transforms the selector into a class or attribute
- add the [browser polyfill](#browser) that sets the attribute or class on elements in a browser

```pcss
<example.css>

Expand Down
4 changes: 4 additions & 0 deletions plugins/css-prefers-color-scheme/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,10 @@

[Prefers Color Scheme] lets you use light and dark color schemes in all browsers, following the [Media Queries] specification.

To use this feature you need to do two things :
- add the [PostCSS plugin](#usage) that transforms the media queries
- add the [browser polyfill](#browser) that triggers specific queries in a browser

```pcss
@media (prefers-color-scheme: dark) {
:root {
Expand Down
4 changes: 4 additions & 0 deletions plugins/css-prefers-color-scheme/docs/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,10 @@

[<humanReadableName>] lets you use light and dark color schemes in all browsers, following the [Media Queries] specification.

To use this feature you need to do two things :
- add the [PostCSS plugin](#usage) that transforms the media queries
- add the [browser polyfill](#browser) that triggers specific queries in a browser

```pcss
<example.css>

Expand Down
6 changes: 3 additions & 3 deletions plugins/postcss-focus-visible/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -5,9 +5,9 @@
[PostCSS Focus Visible] lets you use the `:focus-visible` pseudo-class in CSS,
following the [Selectors Level 4 specification].

It is the companion to the [focus-visible polyfill]. Note that this plugin
alone **is not** sufficient to polyfill for `:focus-visible` and that you need
the browser's polyfill as well.
To use this feature you need to do two things :
- add the [PostCSS plugin](#usage) that transforms the selector into a class or attribute
- add the [focus-visible polyfill] that sets the attribute or class on elements in a browser

[!['Can I use' table](https://caniuse.bitsofco.de/image/css-focus-visible.png)](https://caniuse.com/#feat=css-focus-visible)

Expand Down
6 changes: 3 additions & 3 deletions plugins/postcss-focus-visible/docs/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -19,9 +19,9 @@
[<humanReadableName>] lets you use the `:focus-visible` pseudo-class in CSS,
following the [Selectors Level 4 specification].

It is the companion to the [focus-visible polyfill]. Note that this plugin
alone **is not** sufficient to polyfill for `:focus-visible` and that you need
the browser's polyfill as well.
To use this feature you need to do two things :
- add the [PostCSS plugin](#usage) that transforms the selector into a class or attribute
- add the [focus-visible polyfill] that sets the attribute or class on elements in a browser

[!['Can I use' table](https://caniuse.bitsofco.de/image/css-focus-visible.png)](https://caniuse.com/#feat=css-focus-visible)

Expand Down
4 changes: 4 additions & 0 deletions plugins/postcss-focus-within/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,10 @@
[PostCSS Focus Within] lets you use the `:focus-within` pseudo-class in CSS,
following the [Selectors Level 4 specification].

To use this feature you need to do two things :
- add the [PostCSS plugin](#usage) that transforms the selector into a class or attribute
- add the [browser polyfill](#browser) that sets the attribute or class on elements in a browser

```pcss
.my-form-field:focus-within label {
background-color: yellow;
Expand Down
4 changes: 4 additions & 0 deletions plugins/postcss-focus-within/docs/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,10 @@
[<humanReadableName>] lets you use the `:focus-within` pseudo-class in CSS,
following the [Selectors Level 4 specification].

To use this feature you need to do two things :
- add the [PostCSS plugin](#usage) that transforms the selector into a class or attribute
- add the [browser polyfill](#browser) that sets the attribute or class on elements in a browser

```pcss
<example.css>

Expand Down