Skip to content

Migrate css-has-pseudo #21

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.

Sign up for GitHub

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 7 commits into from
Nov 22, 2021
Merged

Migrate css-has-pseudo #21

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
d14a253
css-has-pseudo : monorepo migration
romainmenke Nov 21, 2021
384be05
Merge remote-tracking branch 'origin/main' into css-has-pseudo--monor…
romainmenke Nov 21, 2021
ecb9e29
migrate
romainmenke Nov 21, 2021
bf319e0
more docs
romainmenke Nov 21, 2021
10c22f7
Merge remote-tracking branch 'origin/main' into css-has-pseudo--monor…
romainmenke Nov 21, 2021
527fa5b
remove top level lock file
romainmenke Nov 22, 2021
97fb586
use exports field
romainmenke Nov 22, 2021
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
15 changes: 0 additions & 15 deletions plugins/css-has-pseudo/.editorconfig
View file
Open in desktop

This file was deleted.

7 changes: 2 additions & 5 deletions plugins/css-has-pseudo/.gitignore
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,13 +1,10 @@
node_modules
/browser.*
/cli.*
/index.*
/postcss.*
dist
package-lock.json
yarn.lock
*.log*
*.result.css
.*
*.result.css.map
!.editorconfig
!.gitignore
!.rollup.js
Expand Down
73 changes: 0 additions & 73 deletions plugins/css-has-pseudo/.rollup.js
View file
Open in desktop

This file was deleted.

10 changes: 0 additions & 10 deletions plugins/css-has-pseudo/.travis.yml
View file
Open in desktop

This file was deleted.

65 changes: 0 additions & 65 deletions plugins/css-has-pseudo/CONTRIBUTING.md
View file
Open in desktop

This file was deleted.

24 changes: 8 additions & 16 deletions plugins/css-has-pseudo/INSTALL-POSTCSS.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,19 +13,11 @@ Add [CSS Has Pseudo] to your project:
npm install css-has-pseudo --save-dev
```

Use [CSS Has Pseudo] to process your CSS:

```js
const postcssHasPseudo = require('css-has-pseudo/postcss');

postcssHasPseudo.process(YOUR_CSS /*, processOptions, pluginOptions */);
```

Or use it as a [PostCSS] plugin:
Use it as a [PostCSS] plugin:

```js
const postcss = require('postcss');
const postcssHasPseudo = require('css-has-pseudo/postcss');
const postcssHasPseudo = require('css-has-pseudo');

postcss([
postcssHasPseudo(/* pluginOptions */)
Expand All @@ -43,7 +35,7 @@ npm install postcss-cli --save-dev
Use [CSS Has Pseudo] in your `postcss.config.js` configuration file:

```js
const postcssHasPseudo = require('css-has-pseudo/postcss');
const postcssHasPseudo = require('css-has-pseudo');

module.exports = {
plugins: [
Expand All @@ -63,7 +55,7 @@ npm install postcss-loader --save-dev
Use [CSS Has Pseudo] in your Webpack configuration:

```js
const postcssHasPseudo = require('css-has-pseudo/postcss');
const postcssHasPseudo = require('css-has-pseudo');

module.exports = {
module: {
Expand Down Expand Up @@ -100,7 +92,7 @@ file:

```js
const reactAppRewirePostcss = require('react-app-rewire-postcss');
const postcssHasPseudo = require('css-has-pseudo/postcss');
const postcssHasPseudo = require('css-has-pseudo');

module.exports = config => reactAppRewirePostcss(config, {
plugins: () => [
Expand All @@ -121,7 +113,7 @@ Use [CSS Has Pseudo] in your Gulpfile:

```js
const postcss = require('gulp-postcss');
const postcssHasPseudo = require('css-has-pseudo/postcss');
const postcssHasPseudo = require('css-has-pseudo');

gulp.task('css', () => gulp.src('./src/*.css').pipe(
postcss([
Expand All @@ -143,7 +135,7 @@ npm install grunt-postcss --save-dev
Use [CSS Has Pseudo] in your Gruntfile:

```js
const postcssHasPseudo = require('css-has-pseudo/postcss');
const postcssHasPseudo = require('css-has-pseudo');

grunt.loadNpmTasks('grunt-postcss');

Expand All @@ -161,7 +153,7 @@ grunt.initConfig({
});
```

[CSS Has Pseudo]: https://github.com/csstools/css-has-pseudo
[CSS Has Pseudo]: https://github.com/csstools/postcss-plugins/tree/main/plugins/css-has-pseudo
[Gulp PostCSS]: https://github.com/postcss/gulp-postcss
[Grunt PostCSS]: https://github.com/nDmitry/grunt-postcss
[PostCSS]: https://github.com/postcss/postcss
Expand Down
34 changes: 29 additions & 5 deletions plugins/css-has-pseudo/README-BROWSER.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,6 @@
# CSS Has Pseudo for Browsers [<img src="http://jonathantneal.github.io/js-logo.svg" alt="" width="90" height="90" align="right">][CSS Has Pseudo]

[![NPM Version][npm-img]][npm-url]
[![Build Status][cli-img]][cli-url]
[![Support Chat][git-img]][git-url]

[CSS Has Pseudo] lets you style elements relative to other elements in CSS,
Expand All @@ -28,17 +27,42 @@ npm install css-has-pseudo
Then include and initialize it on your document:

```js
const cssHasPseudo = require('css-has-pseudo');
const cssHasPseudo = require('css-has-pseudo/browser');

cssHasPseudo(document);
```

[cli-img]: https://img.shields.io/travis/csstools/css-has-pseudo/master.svg
[cli-url]: https://travis-ci.org/csstools/css-has-pseudo
```html
<link rel="stylesheet" href="TRANSFORMED.css">
<script src="https://unpkg.com/css-has-pseudo/dist/browser-global.js"></script>
<script>cssHasPseudo(document)</script>
```

## Dependencies

Web API's:

- [MutationObserver](https://developer.mozilla.org/en-US/docs/Web/API/MutationObserver)
- [requestAnimationFrame](https://developer.mozilla.org/en-US/docs/Web/API/window/requestAnimationFrame)
- [querySelectorAll](https://developer.mozilla.org/en-US/docs/Web/API/Document/querySelectorAll) with support for post CSS 2.1 selectors

ECMA Script:

- `Array.prototype.filter`
- `Array.prototype.forEach`
- `Array.prototype.indexOf`
- `Array.prototype.join`
- `Array.prototype.map`
- `Array.prototype.splice`
- `RegExp.prototype.exec`
- `String.prototype.match`
- `String.prototype.replace`
- `String.prototype.split`

[git-img]: https://img.shields.io/badge/support-chat-blue.svg
[git-url]: https://gitter.im/postcss/postcss
[npm-img]: https://img.shields.io/npm/v/css-has-pseudo.svg
[npm-url]: https://www.npmjs.com/package/css-has-pseudo

[CSS Has Pseudo]: https://github.com/csstools/css-has-pseudo
[CSS Has Pseudo]: https://github.com/csstools/postcss-plugins/tree/main/plugins/css-has-pseudo
[Selectors Level 4]: https://drafts.csswg.org/selectors-4/#has
9 changes: 3 additions & 6 deletions plugins/css-has-pseudo/README-POSTCSS.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,6 @@
# CSS Has Pseudo for PostCSS [<img src="http://jonathantneal.github.io/postcss-logo.svg" alt="" width="90" height="90" align="right">][CSS Has Pseudo]

[![NPM Version][npm-img]][npm-url]
[![Build Status][cli-img]][cli-url]
[![Support Chat][git-img]][git-url]

[CSS Has Pseudo] lets you style elements relative to other elements in CSS,
Expand Down Expand Up @@ -38,7 +37,7 @@ npm install css-has-pseudo --save-dev
Use [CSS Has Pseudo] to process your CSS:

```js
const postcssHasPseudo = require('css-has-pseudo/postcss');
const postcssHasPseudo = require('css-has-pseudo');

postcssHasPseudo.process(YOUR_CSS /*, processOptions, pluginOptions */);
```
Expand All @@ -47,7 +46,7 @@ Or use it as a [PostCSS] plugin:

```js
const postcss = require('postcss');
const postcssHasPseudo = require('css-has-pseudo/postcss');
const postcssHasPseudo = require('css-has-pseudo');

postcss([
postcssHasPseudo(/* pluginOptions */)
Expand Down Expand Up @@ -83,12 +82,10 @@ body[\:has\(\:focus\)] {
}
```

[cli-img]: https://img.shields.io/travis/csstools/css-has-pseudo/master.svg
[cli-url]: https://travis-ci.org/csstools/css-has-pseudo
[git-img]: https://img.shields.io/badge/support-chat-blue.svg
[git-url]: https://gitter.im/postcss/postcss
[npm-img]: https://img.shields.io/npm/v/css-has-pseudo.svg
[npm-url]: https://www.npmjs.com/package/css-has-pseudo

[CSS Has Pseudo]: https://github.com/csstools/css-has-pseudo
[CSS Has Pseudo]: https://github.com/csstools/postcss-plugins/tree/main/plugins/css-has-pseudo
[Selectors Level 4]: https://drafts.csswg.org/selectors-4/#has-pseudo
Loading