https://github.com/aniftyco/tailwind-htmx

Variants for styling htmx classes with Tailwind CSS
https://github.com/aniftyco/tailwind-htmx

Last synced: about 1 month ago
JSON representation

Variants for styling htmx classes with Tailwind CSS

• Host: GitHub
• URL: https://github.com/aniftyco/tailwind-htmx
• Owner: aniftyco
• License: mit
• Created: 2023-10-30T20:25:50.000Z (about 1 year ago)
• Default Branch: master
• Last Pushed: 2023-10-30T21:38:41.000Z (about 1 year ago)
• Last Synced: 2024-08-04T01:04:52.798Z (5 months ago)
• Language: TypeScript
• Homepage:
• Size: 55.7 KB
• Stars: 17
• Watchers: 3
• Forks: 0
• Open Issues: 1
• Metadata Files:
  • Readme: README.md
  • License: LICENSE.md

Awesome Lists containing this project

• awesome-tailwindcss - Htmx - Adds variants for styling on [htmx](https://htmx.org/reference/#classes) events. (Plugins)

README

        
# tailwind-htmx

> Variants for styling htmx classes with Tailwind CSS

## Getting Started

### Installation

Install the plugin from npm:

```sh

npm install -D tailwind-htmx

```

Then add the plugin to your `tailwind.config.js` file:

```js

/** @type {import('tailwindcss').Config} */

module.exports = {

  theme: {

    // ...

  },

  plugins: [

    require('tailwind-htmx'),

    // ...

  ],

};

```

### Configuration

You can change the default class names to generate with the following options:

```js

// tailwind.config.js

module.exports = {

  ...,

  plugins: [

    require('tailwind-htmx')({

      classNames: {

        settling: 'htmx-settling';

        request: 'htmx-request';

        swapping: 'htmx-swapping';

        added: 'htmx-added';

      };

    }),

  ],

};

```

### Usage

```html



  Post It!

  



```