What works for me is:
- Separate CSS file for static styling and basic UI animations, so I
only need to add class attributes in view functions.
- Layout, fonts, hover and focused states etc etc all go in css file.
- So e.g. if I want to make give a "selected" element in a list a
different background-color, I use elm to apply a class of e.g.
"item--selected", and use css to define the styling.
- Basic UI animations: E.g. I have a dropdown menu for which appears
if a button is clicked. This is handled completely in css, using the
:focus
state of of the button to unhide the dropdown.
- Do transitions and more complicated animations directly in elm.
- Unfortunately, css can only handle basic animations/ transitions.
- E.g. for drag and drop, do positioning directly in elm (but I keep
the styling in css)
I use webpack for development, but I have not yet found a way to
"automatically" import the right css files needed.
--
You received this message because you are subscribed to the Google Groups "Elm
Discuss" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
For more options, visit https://groups.google.com/d/optout.
