a11y-todos

Expand History Expand History
Collapse History Collapse History

Style with TailwindCSS

To reduce the number of duplicated occurrences of [class] declarations, extract the application/row partial, and render all <tr> elements through it.

First, configure Webpacker to build CSS and link to it from the HTML document’s <head> via a call to stylesheet_pack_tag.

Next, install the TailwindCSS source according to the TailwindCSS Guides:

If you’re using postcss-import (or a tool that uses it under the hood, such as Webpacker for Rails), use our imports instead of the @tailwind directive to avoid issues when importing any of your own additional files:

Extend the Tailwind configuration to include the [@tailwindcss/custom-forms][] package to make the .form-checkbox class available.

Finally, since we’ll rely on Webpacker and PostCSS to build our styles, we can remove the app/assets/stylesheets directory.