51–60 of 76 posts
Sorry if I sound snarky, but why use this if you can just write: Center It looks like these are just single rule classes. In my opinion, If you are going to write one class for each style rule, you might as well use the style property.
Earlier quoted context omitted.
Writing actual CSS is the waste of time. SASS variables, mixins, and the "&" operator are pretty much indespensable.
Vanilla CSS has custom properties[1] (which are more powerful then SASS variables) and there is a proposal for the `&` nested selector[2] which you can get with PostCSS[3]. All you are missing are mixins, but there is a PostCSS plugin for that[4]. [1]: https://developer.mozilla.org/en-US/docs/Web/CSS/--* [2]: https://drafts.csswg.org/css-nesting-1/ [3]: https://postcss.org/ [4]: https://github.com/postcss/postcss-mix…
My current shop is moving to switch our sass color function `color.get()` to either dump hardcoded hex or a css variable usage based on a param. It currently just does hex.
Personally I prefer to write the CSS (well Sass really). I've mainly used Bootstrap in the past. I've moved on though, I learned flexbox and css grid and some atomic design principals as well as ABEM ( https://css-tricks.com/abem-useful-adaptation-bem/ ) and I'm happy.
I find https://rscss.io/ to be a really nice design philosophy that takes the best parts from BEM. And agreed: it's easiest to just work directly with flexbox (and grid if you can drop IE11), and a set of design principles is really valuable to avoid spaghetti.
Earlier quoted context omitted.
Tailwind has a class for almost everything, which makes it quite heavy: 1600kb minified. In my experience you end up with ≤ 15kb of minified CSS after running PurgeCSS anyway, so this is not an issue. Personally I prefer Tailwind because you practically don't have to write any CSS. With something like Blunt expect finding many edge cases where you will have to write custom CSS. I do write custom classes that wrap Tai…
Going slightly off topic but I wonder if anyone can point me to a tailwind "starter kit" - ie. a project with everything in place to get going with tailwind, postcss etc. Thanks!
I’m sure this library of classes will be useful for somebody. But the stylesheet weighs in at half a megabyte.
It's a case of combinatorial explosion, e.g. there is a style for every integer up to some max I didn't care to find out, for the height:
.pxh-558 { height: 558px; }
Simple responsive card:
Sorry if I sound snarky, but why use this if you can just write: Center It looks like these are just single rule classes. In my opinion, If you are going to write one class for each style rule, you might as well use the style property.
Earlier quoted context omitted.
I don't mind hand-writing CSS for a small project, but I feel like once you've got a decent team, it ends up being duplicative and wasting a lot of time. How many times do you really need to style button/link and write out your 8px margins (or is it 6?) Sass solves this too, but simply applying classes is even easier and faster for me at least. I thought BEM was horrible when I first saw it, but once I used it, the p…
> How many times do you really need to style button/link and write out your 8px margins. Either 0 or 1 times. Use semantic classes ` ` and use custom properties or the cascade from there: :root { --button-margin-block: 1ex; --button-margin-inline: 1em; } dialog { /* * Modals buttons need more block space and * less inline space. */ --button-margin-block: 1em; --button-margin-inline: 1ex; } button, .button { margin-bl…
The 'simple' responsive card example uses 9 divs and 33 classes.
This is madness.