elm-designer icon indicating copy to clipboard operation
elm-designer copied to clipboard

Add "space evenly" option to inspector spacing field

Open passiomatic opened this issue 5 years ago • 0 comments

Internally we represent Spacing like this:

type Spacing
    = SpaceEvenly
    | Spacing ( Int, Int )

This matches Elm UI nicely. However we currently don't expose this in the UI. We should model the Spacing X/Y fields accordingly. A few gotchas:

  • row accepts an horizontal spacing only
  • column accepts a vertical spacing only
  • textColumn accepts both values and uses horizontal spacing for "floated" elements on left and right
  • paragraph seems to happily ignore SpaceEvenly (see Para1) but works like textColumn (see Para2), see: https://ellie-app.com/c2jCXBTFB5Va1

The reason why this hasn't been implemented yet is because it isn't clear how to design the UI. We can have:

  • ❌A toggle/button/whatever to switch between the evenly status and the actual horizontal spacing value (numeric input)
  • ❌A toggle/button/whatever to switch between the evenly status and the actual vertical spacing value (numeric input)
  • ❌A toggle/button/whatever to switch between the evenly status and combined horizontal and vertical spacing values (two numeric inputs) for a TextColumn node (and we need to fix this https://github.com/passiomatic/elm-designer/issues/59 fist!)
  • ✅ No spacing evenly toggle for paragraphs, instead a vertical spacing input in the inspector text spacing section (think this as a line-height)

So the only implemented scenario right now is the paragraph one, since it is quite an ad-hoc solution.

passiomatic avatar Jan 07 '21 09:01 passiomatic