4 ms·
Cool but also reminds me why I use inline styles for everything. I don't want to fiddle with selectors. I want to put the styling right on the element.
by Kiro 3y ago
Cool but also reminds me why I use inline styles for everything. I don't want to fiddle with selectors. I want to put the styling right on the element.
- ailef 3y agoHow do you create reusable styles this way?
- bryanrasmussen 3y agomodern JS has a bunch of half-assed scenarios for solving this problem that allows you to solve almost everything CSS did a few years ago and helps keep people stuck in ineffective legacy ways of doing it because all their code would have to be rewritten to use straight css. I know because every place I've worked in the last few years uses some form of CSS in JS.
- hinkley 3y agoEvery five years or so prior to CSS 3, there was a push to purge styling and animation decisions from JS. We are meant to be past that now. Calling it a feature that you have CSS in your JS is tantamount to saying you’re writing legacy code. Which happens, but don’t be cheerful about it.
- Kiro 3y agoWith components. Same thing as when isolating styles to a component in various frameworks (e.g. Single-File Components in Vue) but instead of its own style tags I just put the styling directly in the HTML.
- froddd 3y agoSo you’re using S, not CSS
- hinkley 3y agoIn a large app you often can’t easily find all of the html. It’s less work by far to ensure you can find all of the CSS though. And when the company decides to rebrand and change the color scheme for the whole app, which they will at least half the time, you’ll be glad not to be playing whack-a-mole. Problems that aren’t done when you think they’re done create a lot of friction with the rest of the org. Open ended problems cause engineering to look incompetent. The cost of that problem is immeasurable, and doubly so in a bad economy.
- oneeyedpigeon 3y ago> In a large app you often can’t easily find all of the html. Which is often a warning sign of a bad design. The times I've dealt with systems that bury a certain piece of text in either a content file or a template or the database... > It’s less work by far to ensure you can find all of the CSS though. Hmm... depends. I've seen things like React embedding the CSS directly in with the markup and component logic etc. So this hasn't necessarily gotten any better — in fact, a site consisting JUST of html files would probably be easier to find CSS in even if it's all added via inline style attributes.
- hinkley 3y agoThere are no clean designs on a large team. Anyone who tells you otherwise is selling something. Zealots provide solutions that cannot possibly survive contact with actual humans. The rest of the team talks about them behind their backs. > I've seen things like React embedding the CSS directly in with the markup and component logic etc. You were talking about bad designs? Embedded styling is not Cascading Style Sheets. It’s embedded styling. There’s no sheet, and no cascade. Nothing is free, and few things are easy. There are lines that are easier to maintain in practice than others, and separation of CSS is one of the former.
- oneeyedpigeon 3y ago> Embedded styling is not Cascading Style Sheets I think that's needless pedantry; the contents of the `style` attribute still needs to be valid CSS.
- oneeyedpigeon 3y agoPresumably you never use hover styles, media queries, or quite a lot of other CSS features?
- Kiro 3y agoI use Tailwind when I need that.
- hoherd 3y agoFWIW, these are useful for more than styling. I don't do any front-end dev work, but I use these regularly in selenium to find components in the page to interact with.