🚀 Big News: Socket Acquires Coana to Bring Reachability Analysis to Every Appsec Team.Learn more
Socket
Book a DemoInstallSign in
Socket

tailwindcss-pseudo-elements

Package Overview
Dependencies
Maintainers
2
Versions
11
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

tailwindcss-pseudo-elements - npm Package Compare versions

Comparing version

to
1.5.1

8

package.json
{
"name": "tailwindcss-pseudo-elements",
"version": "1.5.0",
"version": "1.5.1",
"description": "TailwindCSS Plugin that adds variants of pseudo elements.",

@@ -35,8 +35,8 @@ "main": "index.js",

"chai": "^4.2.0",
"eslint": "^7.13.0",
"eslint": "^7.15.0",
"mocha": "^8.2.1",
"postcss": "^8.1.14",
"prettier": "^2.1.2",
"prettier": "^2.2.1",
"puppeteer": "^5.5.0",
"tailwindcss": "^1.9.6"
"tailwindcss": "^2.0.1"
},

@@ -43,0 +43,0 @@ "peerDependencies": {

@@ -28,15 +28,17 @@ # tailwindcss-pseudo-elements

variants: {
textColor: [
'responsive',
'hover',
'focus',
'before',
'after',
// If you want to combine it with a pseudo class,
// use `<pseudo-class>_<pseudo-element>`.
'hover_before',
'hover_after',
'focus_before',
'foo_bar',
],
extend: {
textColor: [
'responsive',
'hover',
'focus',
'before',
'after',
// If you want to combine it with a pseudo class,
// use `<pseudo-class>_<pseudo-element>`.
'hover_before',
'hover_after',
'focus_before',
'foo_bar',
],
},
},

@@ -86,1 +88,18 @@

```
#### Content Property Utilities
There are utilities that set the attributes of HTML elements to the content property.
Mark it up as follows:
```html
<p
class="text-lg text-blue-600 content-before content-after content-hover-before"
tw-content-before="🧡"
tw-content-hover-before="💖"
tw-content-after="💙️"
>
Tailwind CSS
</p>
```