feat: generate our own tailwind stylesheet

[mtamc]

closes #25

SUMMARY

This commit removes assets/styles.css from version control, instead generating it as a part of the build command inside Makefile. The standalone tailwind CLI is already a part of the Miso wasm dev shell, so nix develop .#wasm --command bash -c "make" or nix develop .#wasm --command bash -c "make build" will work for all devs with nix installed.

This will have many benefits, such as supporting tailwind settings (note as of tailwind v4, a tailwind config file is no longer mandatory, so I didn't bother adding one in this commit.), and supporting custom values e.g. text-[14px], beyond the ones that were coincidentally already generated by the stylesheet we previously copied over from the basecoat docs repository.

TODO

This commit DOESN'T add tailwind stylesheet generation as a part of the live development server initializing or reloading. This is because I was not able to run the live development server at all. For future reference, I wrote notes on how to run the tailwind CLI before starting the miso-sampler development server and on reload in issue #25: click

(Note miso-sampler seems to use a different live development server setup from miso-ui.)

CODE COMMENTARY

The input CSS file is located at lib/tailwind-input.css. It is not intended to be a publicly-served file which is why I chose the lib directory for it.

(Relevant documentation on how tailwind class detection and file sourcing works.)

The default behavior is to look at every file with the input CSS file's location (lib/tailwind-input.css) as root. I chose to explicitly register every directory to look for classes in: lib client shared server. Note that class-detection is a language-agnostic process, so it scans Haskell files just fine.

lib/tailwind-input.css imports the basecoat stylesheet, as instructed by the basecoat docs. I've copypasted from hunvreus/basecoat/blob/main/src/css/basecoat.css and into lib/basecoat.css, which seems to be the standard way to import basecoat without using a JavaScript package manager. It is important to note that this CSS file is NOT the same as the basecoat DOCS stylesheet which we previously used instead of generating our own, and therefore could cause unintended visual regressions from e.g. using non-tailwind classes or variables that the basecoat docs stylesheet used. From my quick manual test, it looked like the only missing rules were the theme declaration blocks (Claude, Cosmic, Tangerine, Supabase), so I've included them in tailwind-input.css as well. Note the miso-ui themes Cosmic and Tangerine aren't in the latest basecoat docs themes, I don't know where they originally come from. Regardless, I've copied them over.