search

antoniandre / wave-ui

A UI framework for Vue.js 3 (and 2) with only the bright side. ☀️
https://antoniandre.github.io/wave-ui
MIT License
546 stars 41 forks source link

Adding one side borders and colored Borders #99

Closed MedLabs closed 4 months ago

MedLabs commented 1 year ago

Hello, it would be great to add sides borders like .bdt .bdr .bdl .bdb and green-light2--bd , blue-dark3--bdb ...

I hope it's not against the phylosophy of wave-ui

antoniandre commented 1 year ago

Hi @MedLabs, I understand this can be convenient, but this is also generating a lot of extra CSS unfortunately. For instance bdt .bdr .bdl .bdb definitions from 0 to 6 is already adding 4*7= 28 CSS rules. And if we add bdx and bdy to be consistent, this is an extra 14 CSS rules. I need to decide where should be the limit, but for now I can already say that colored border will definitely not be added as it would be a crazy amount of extra CSS for the small benefit. I try to keep Wave UI as lean as possible with all the primary needs first. :)

I'll do some tests and will let you know the outcome soon. I am just focused on finishing the dark theme feature first.

antoniandre commented 4 months ago

Hi @MedLabs, after doing some tests, I decided not to add these classes even though they would be convenient, it generates a big chunk of CSS and it's not as frequently used as margin / padding. It's always nice to specify borders rules with a small class, but doing some tradeoffs is also very important to keep the library lean, performant, and easy to override :) Thanks for your ideas!