tabler-vue icon indicating copy to clipboard operation
tabler-vue copied to clipboard

How should we handle CSS styling

Open Nilpo opened this issue 7 years ago • 5 comments

How would you like to handle styling? The "Vue way" to do this is to take all of the styles necessary for a particular component and place it in with that component. Alternatively, we could keep all styles in a central stylesheet or some mix of both.

I would suggest that resets and page-wide styles are in a central stylesheet and component-specific styles remain with those components.

Nilpo avatar Jun 04 '18 02:06 Nilpo

What's the point of that? Why would you not just piggyback off of tabler's stylesheets?

chrisbbreuer avatar Jun 04 '18 02:06 chrisbbreuer

It would be using tabler's stylesheet, but it would be sectioned and included with each component. The Vue best practice is to use modular, scoped styles with each component. It would require more work to maintain though which is why I'm asking for opinions.

Nilpo avatar Jun 04 '18 04:06 Nilpo

I get where you are coming from, but I think it's pretty easy to add and remove component .scss files from dashboard.scss. It will make things much easier to maintain and structure - in my opinion.

chrisbbreuer avatar Jun 04 '18 04:06 chrisbbreuer

If we have scoped style the end user will have the advantage of just importing the styles that a necessary and not whole tabler dashboard, and this will help them minimise the size of the final bundle. But in another hand we may have maintenance nightmare! I think for now we can keep the dashboard.scss

isneezy avatar Jun 04 '18 04:06 isneezy

Ok, let's keep the single file for the first full release. We can revisit this idea later if we want to.

Nilpo avatar Jun 04 '18 06:06 Nilpo