search

vikramrojo / fortune

🔮Fortune is your friendly CSS properties framework.
MIT License
16 stars 2 forks source link

Components blocking utilities #3

Closed vikramrojo closed 6 years ago

vikramrojo commented 6 years ago
screen shot 2018-04-05 at 9 24 38 am

Adding a utility class (eg radius-3) to a component (button) does not modify the component.

vikramrojo commented 6 years ago

Seems the simplest ways to solve this are either add write utility classes like body .radius-3 { prop } or just change the order of fortune.css to have components before utilities.

https://stackoverflow.com/questions/20954715/how-to-override-the-properties-of-a-css-class-using-another-css-class

chasestarr commented 6 years ago

you mentioned this issue was resolved?

vikramrojo commented 6 years ago

The solution is there which is add body or !important if needed. It isn't necessary for most components but isn't resolved for components that have higher specificity in their CSS, eg. Tabs

https://github.com/atav1k/fortune/blob/b864f0a61f917acd36fa733ddeaa51f318256b18/src/tab.css#L5

vikramrojo commented 6 years ago

Simple hack to raise specificity is .class.class instead of !important