Live data from Hacker News

CSS now has an if() conditional function

caniuse.com

31–40 of 245 posts

Re: CSS now has an if() conditional function

#31
post #6

Far from being ready when only one major browser supports it. If you want this, you should vote for it to be focused on for interop-2026 https://github.com/web-platform-tests/interop/issues Right now, the leading CSS proposals are `@container style()`, `corner-shape` and `break-after` https://foolip.github.io/interop-reactions/

The People have spoken, and they want squircles.

Re: CSS now has an if() conditional function

#33

I'm not sure turning CSS into a full blown language is a good idea. With all the cascading in place, it is already a bit hard to determine why certain styles are applied. Now with this, we will be spending more brain cells debugging CSS issues.

css definitely shouldn't have backwards branches (loops/recursive functions), but adding a little more power can clean up expression a ton and make reading/applying that much faster

Re: CSS now has an if() conditional function

#34

This is missing a "if variable equals" imho. Right now it seems like pure syntactic sugar for a media query.

>This is missing a "if variable equals" imho.

This is exactly what it does not need. SASS style conditional CSS is a complete nightmare to maintain. The declarative nature is one of its greatest strengths.

Re: CSS now has an if() conditional function

#35

This is missing a "if variable equals" imho. Right now it seems like pure syntactic sugar for a media query.

>This is missing a "if variable equals" imho. This is exactly what it does not need. SASS style conditional CSS is a complete nightmare to maintain. The declarative nature is one of its greatest strengths.

Did you guys read the docs? It literally does have this albeit the syntax is a bit odd:

if(style(--foo: bar): baz)

Is how you test if variable --foo is equal to "bar"

See https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/V...

Re: CSS now has an if() conditional function

#36
post #4

It's a great way to make conditional styles without having to use JavaScript; however, having used JS for years to make theme color and icon sets that rely on CSS properties, I'm not sure I particularly like this method. I feel like you have to smear a lot of logic across your CSS whereas with JS you can reduce your theme to a data structure and just have a simple function to setup all the CSS variables based on that…

Javascript always suffer from FOUC problem though (Unless it's server side). Although the if() css function seems to just be syntax suger of standard @media query. So it doesn't really add anything to solve existing problems. Edited: It seems it can also be toggled from css variable? So it might actually fix some existing problems.

How hard would it be to have a response header that tells the browser "don't display anything at all until we ask you to from JS when we're ready"?

Considering the kinds of crap that have been done with headers...

Re: CSS now has an if() conditional function

#37

I'm not sure turning CSS into a full blown language is a good idea. With all the cascading in place, it is already a bit hard to determine why certain styles are applied. Now with this, we will be spending more brain cells debugging CSS issues.

css definitely shouldn't have backwards branches (loops/recursive functions), but adding a little more power can clean up expression a ton and make reading/applying that much faster

I wish the "little more power" would add CSS modules. It would also be great if web components didn't require Javascript and could be configured with pure HTML and CSS.

I will kiss the feet of the whatwg groups if they do this.

PS: Would also love to have declarative template inclusion now that removal of XSLT has also removed this facility from the browser.

Re: CSS now has an if() conditional function

#38

Earlier quoted context omitted.

lol. What other browser vendors? Whatwg is just google is a trench coat. Edge is chrome. Firefox is funded by Google. So I guess apple who's main contribution is being years behind and having half their stuff be broken

There's this really cool site where you can see how well supported a feature is: https://caniuse.com/?search=if If Google controls everything, why is if() only supported on 59% traffic? Do you think any serious company will let their site break on 40% of clients? Do you think Apple's opinion is unimportant?

Did you look at detailed usage stats? More specifically at things that do not count towards that 59%: older versions of Chrome add another 20%, various Chromium forks add a few percent more, so the rest of the internet accounts for less than 20%. I'd say this is pretty monopolistic for one company to control the means of more than 80% of traffic of doing its 'trafficking'.

Re: CSS now has an if() conditional function

#39
post #7

Not supported in Firefox and Safari. Also it seems most people forget that the more bloated the web platform is, the more resources are needed to develop and maintain a web browser engine.. Chromium is open-source, but it's already expensive to maintain a fork or even rebuild it..

They just need to start deprecating and removing old features. They had no issues with XSLT removal even when some major sites like the library of congress used it. So the excuse of backward compatability has already proven to be a lie.
Post reply on HN