Tailwind CSS Plugin – Separated

Utilities for adding separators between items.

Install

1. Install the plugin:

``bash


Using npm

npm install @neupauer/tailwindcss-plugin-separated

Using Yarn

yarn add @neupauer/tailwindcss-plugin-separated
`

2. Add it to your tailwind.config.js file:

`js
// tailwind.config.js
module.exports = {
// ...
plugins: [require("@neupauer/tailwindcss-plugin-separated")],
};
`

Configuration

`js
// tailwind.config.js
module.exports = {
theme: {
// default
separated: {
comma: ", ",
},
},
variants: {
// default
separated: [],
},
};
`

Usage

$3

`js
// tailwind.config.js
module.exports = {
theme: {
separated: {
comma: ", ",
// Custom separator string
bullet: " • ",
// Custom separator object
funny: {
content: "' • '", // do not forget double quotes !
backgroundColor: "pink",
},
},
},
};
`

Syntax .separated-{key} e.g. .separated-comma, .separated-bullet

`html


• milk


• eggs





• bread


`

`html


• 
  milk
  


• 
  eggs
  


• 
  bread
  


``