Proposal: Style Guide

[nrueckmann]

One of Nova's selling point is the ability to extend the functionality.
Unfortunately, every extension needs to make their own decision about styling, because there is no common style guide and we can not rely on tailwindcss classes to be present as tailwindcss only bundles those classes which are used by the application (= laravel/nova).

We could dramatically improve the user and development experience if laravel/nova would contain a defined set of components which can be used by any extension.

Example / Use case:

I want to use a grid with 3 columns in my extension. Using tailwindcss it should be as simple as <div class="grid-cols-3"></div>. But because laravel/nova is not using this feature, i will need to build my own css which either results in writing custom css, or duplicated a whole tailwindcss stack.

Alternative solutions:

• Support custom build of nova assets including custom code
• Just keep all tailwindcss classes in build so they can be used by extensions (see https://tailwindcss.com/docs/content-configuration#safelisting-classes)

[jimarick]

I agree. Perhaps simplest option is to have tailwind installed by default on all custom components, potentially by using scoped styles as I've detailed in this issue:

Issue 4061

[baszach]

I support this idea. I made some custom fields and cards for Nova and they look kinda off. It would be great to get a style sheet. I'll be solving this by looking into the vendor/laravel/nova DIR and copying the styles.

[bkuhl]

I've also tried to use tailwind css for very small areas where I render a blade view and such, it's just not the same. With Nova being intended for an admin area, it doesn't seem unreasonable to ensure tailwind is always available as traffic won't be super heavy for 99.9%+ installs.

[Egnaro]

We also would like to see all of the tailwind classes available all the time. This would solve issues we are now facing as we migrate our custom tools from Nova 3 to Nova 4.