1. postcss-selector-matches
PostCSS plugin to transform :matches() W3C CSS pseudo class to more compatible CSS selectors
postcss-selector-matches
Package: postcss-selector-matches
Created by: postcss
Last modified: Fri, 24 Jun 2022 10:52:43 GMT
Version: 4.0.0
License: MIT
Downloads: 8,526,884
Repository: https://github.com/postcss/postcss-selector-matches

Install

npm install postcss-selector-matches
yarn add postcss-selector-matches

postcss-selector-matches CSS Standard Status Build Status

PostCSS plugin to transform :matches() W3C CSS pseudo class to more compatible CSS selectors

http://dev.w3.org/csswg/selectors-4/#matches

Installation

 $ npm install postcss-selector-matches

Usage

 var postcss = require("postcss")

var output = postcss()
  .use(require("postcss-selector-matches"))
  .process(require("fs").readFileSync("input.css", "utf8"))
  .css

Using this input.css:

 p:matches(:first-child, .special) {
  color: red;
}

you will get:

 p:first-child, p.special {
  color: red;
}

Note that if you are doing crazy selector like p:matches(a) {} you are likely to get crazy results (like pa {}).

Options

lineBreak

(default: false)

Allows you to introduce a line break between generated selectors.


Changelog

License

RELATED POST

10 Must-Know Windows Shortcuts That Will Save You Time

10 Must-Know Windows Shortcuts That Will Save You Time

Arrays vs Linked Lists: Which is Better for Memory Management in Data Structures?

Arrays vs Linked Lists: Which is Better for Memory Management in Data Structures?

Navigating AWS Networking: Essential Hacks for Smooth Operation

Navigating AWS Networking: Essential Hacks for Smooth Operation

Achieving Stunning Visuals with Unity's Global Illumination

Achieving Stunning Visuals with Unity's Global Illumination

Nim's Hidden Gems: Lesser-known Features for Writing Efficient Code

Nim's Hidden Gems: Lesser-known Features for Writing Efficient Code