• pcouy@lemmy.pierre-couy.frOP
    link
    fedilink
    arrow-up
    3
    ·
    24 hours ago

    I’m not sure how this relates to the shared post. I’m just searched the article for “radius” and only found one example where a variable is defined then used later. Were you talking about this ? Or can you clarify what “radius calculation” you hate ?

    • lucas@startrek.website
      link
      fedilink
      English
      arrow-up
      5
      ·
      edit-2
      20 hours ago

      They’re referring (I believe) to the screenshot right at the top of the article, which includes this absurd calculation:

      border-radius: max (0px, min(8px, calc( (100vw - 4px - 100%) * 9999)) );
      

      My guess (hope!) is that this is not ‘serious’ code, but padding for the sake of a screenshot to demonstrate that it’s possible to use each of these different features (not that you should!).

      • pinchy@lemmy.world
        link
        fedilink
        arrow-up
        2
        ·
        edit-2
        7 hours ago

        It‘s used in Facebooks css. Remembered it from a nice article from Ahmad Shadeed. And while this limbo sure has some usefulness, it‘s way too obscure to use for the fun of it.

        To add to this: CSS really has come a long way. This border-radius example can be done with Container Queries by now, which has quite good support already.

      • pcouy@lemmy.pierre-couy.frOP
        link
        fedilink
        arrow-up
        2
        ·
        20 hours ago

        border-radius: max(0px, min(8px, calc( (100vw - 4px - 100%) * 9999)) );

        Oh I missed this. I think it’s only here to showcase doing math between different units, which is really nice in my opinion. I’m thinking about a few instances where I had to resort to dirty JS hacks just because CSS did not support this at the time