tailwindlabs / tailwindcss-forms

A plugin that provides a basic reset for form styles that makes form elements easy to override with utilities.
https://tailwindcss-forms.vercel.app
MIT License
4.15k stars 219 forks source link

refactor: limit attribute rules to input and select elements #159

Open sabbaticaldev opened 3 months ago

sabbaticaldev commented 3 months ago

Currently the rules for styling the inputs are too broad and may conflict with web components that use props named type or mutiple. This PR address this issue by using :where to select only inputs without change the specificity.

vercel[bot] commented 3 months ago

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
tailwindcss-forms ✅ Ready (Inspect) Visit Preview 💬 Add feedback Jun 14, 2024 7:40pm
thecrypticace commented 3 months ago

Wrapping an existing portion of a selector in :where(…) will change its specificity but I've fixed them up so that doesn't happen. I think the likelihood of things breaking is probably zero but I think I'd rather be on the safe side here.

adamwathan commented 3 months ago

Honestly I think we should stick with the change from the original commit, where the element selector is bare but the attribute selector is wrapped in :where:

input:where([type=date])

It does reduce the specificity from 0,1,0 to 0,0,1 but I'll take the blame if that breaks anything 🙃 I would've chosen a 0,0,1 selector originally if it were possible anyways.

thecrypticace commented 3 months ago

And this is why I tagged you — I thought there was a chance you might want to.