`calc` in `SizeUnit`

[ghivert]

I think we should be able to access calc in SizeUnit. It is as much legit than any other thing, and avoid costly computation in JS when wanting to compute a layout for example. And it allows to mix and match different values.

An idea:

myStyle =
  [ width 
    (Sizes.calc 
      (Sizes.div 
        (Sizes.sub (px 50) (px 104)) 
        (vw 100)
      ) 
    )
  ]

This would results in:

.myStyle {
  width: calc((50px - 104px) / 100vw);
}

Because all the CSS is computed directly by the browser with a C++ engine, we would gain in performance instead of subscribing to the size of the window to do the same computation in Elm.

[tibastral]

je suis pas fan...

-- Thibaut

Le 31 janv. 2020 à 15:32, Guillaume Hivert [email protected] a écrit :

 I think we should be able to access calc in SizeUnit. It is as much legit than any other thing, and avoid costly computation in JS when wanting to compute a layout for example. And it allows to mix and match different values.

An idea:

myStyle = [ width (Sizes.calc (Sizes.div (Sizes.sub (px 50) (px 104)) (vw 100) ) ) ] This would results in:

.myStyle { width: calc((50px - 104px) / 100vw); } Because all the CSS is computed directly by the browser with a C++ engine, we would gain in performance instead of subscribing to the size of the window to do the same computation in Elm.

— You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub, or unsubscribe.