3 ms·
> I honestly have never seen the value in pre-processors when writing CSS. As mentioned, theming and consistent ux requires far less writing and copy paste wit
by nkozyra 8y ago
> I honestly have never seen the value in pre-processors when writing CSS.
As mentioned, theming and consistent ux requires far less writing and copy paste with a preprocessor than in pure CSS.
I think React's approaches make CSS feel simpler but often just sweep the inefficiencies under the rug.
A lot of this is being fixed with CSS4, so these will go the way of jQuery. And while you don't need jQuery today, it served as an important polyfill for a long time.
- scrollaway 8y ago> A lot of this is being fixed with CSS4 CSS4 won't have nesting. SCSS isn't going away as long as nesting isn't a thing in native css. (Also css variables are awful to use. Honestly, CSS-WG should have just copied most of scss's syntax)
- nkozyra 8y agoI agree about CSS variables. I'm unsure about the merits of nesting. Tends to make for some hard-to-read code.
- frosted-flakes 8y agoMost nesting I do uses the '&' parent selector, so it's not "real" nesting. .a-long-class-name { background: firebrick; &:hover { background: red; } } This approach has some clear benefits (less verbose and it groups related code together) with little or no downsides.
- nkozyra 8y agoSame, but this can definitely get long, ala & > div, & a, & a { &:hover } etc.
- frosted-flakes 8y agoYour example is a bit confusing. This would be a more idiomatic way of writing it: .some-class { > div, a { background: blue; &:hover { background: red; } } }
- have_faith 8y agoThe solution is to not write css like this... ;)
- dmitriid 8y agoCompared to BEM's .b-text-input__text-field or .b-select__option_selected or .media__img--rev nesting is a concise readable breath of fresh air