11ty / webc

Single File Web Components
MIT License
1.3k stars 36 forks source link

Stylesheets in layouts are bundled after more specific component styles #189

Closed riskygit closed 11 months ago

riskygit commented 11 months ago

Component styles are getting overwritten by layout stylesheets. I don't know how to change the order.

riskygit commented 11 months ago

The behavior is intentional... perhaps unfortunately. https://www.11ty.dev/docs/languages/webc/#bundle-code-ordering

The solution seems to be creating a "proper" stylesheet dependency graph... include the base stylesheet in the component and it will get deduplicated and ordered correctly.

riskygit commented 11 months ago

@zachleat let me know if my solution above is how you intended for this to work. I have "base.css" (including .button styles, for example) included in both the layout and the component. This fixed the issue, but I want to make sure this is how I should be handling a stylesheet with global items designed to be overridden.