use tailwind ui

[josh-chamberlain]

https://tailwindui.com/ https://tailwindui.com/documentation

Context

Our first Vue app is in progress. We'd like to keep all our microservices in visual alignment.

Tailwind is opinionated about utilities-based classes, and HTML that is dependent on CSS. Using it will prevent our CSS from growing, and make it maintainable.

This will likely require reworking the existing grid, forms, and buttons.

Next, we should prioritize components which apply to the views in our roadmap.

Requirements

• Release a new npm version of the design system which uses tailwind UI (requires tailwind css)
• Things should look more or less the same, unless there are tweaks for accessibility
  • may want to replace our existing grid and responsive layout with tailwind's
  • may want to replace other declared styles with tailwind's
• Don't worry too much about the main website—we can keep that on the current version of the design system because it's an npm package.
  • that said, if it's easy enough to bring our static site along, we should do it (can be done separately/later)
• https://github.com/Police-Data-Accessibility-Project/design-system/issues/4 (can be done separately/later)

Docs

• Update this repo's README and CONTRIBUTING with any requirements changes or contributing considerations the front end.
• We may want deeper docs somewhere

[joshuagraber]

Started preliminary work on this (installation, configs, etc), so assigning to myself. cc @josh-chamberlain