Skip to content

Change border and shadow type to allow a "none" option #51

@passiomatic

Description

@passiomatic

Currently we have a sloppy way to figure out if a border or shadow style is specified:

  • Shadow: check if blur or size values are /= 0
  • Border: check if width or corner values are /= 0

When the user, after tweaking the shadow or border fields, set them back to a zero value the panel collapses unexpectedly.

This is caused by the way types are currently written, e.g.:

type alias BorderWidth =
    { locked : Bool
    , top : Int
    , right : Int
    , bottom : Int
    , left : Int
    }

Compare these with the Background type which has a None variant which precisely turns off the background style.

Border

So a first step would be to unify the BorderWidth, BorderStyle , BorderCorner and Node.borderColor values, since it makes no sense to have separate records for them. I can see something like this could work better:

type alias BorderData =
    { locked : Bool
    , top : Int
    , topLeftCorner: Int
    , right : Int
    , topRightCorner: Int
    ...
    , style: BorderStyle
    , color: Color
    }

Then we need to add the Border type to the mix, adding a None variant:

type Border 
   = None
   | Solid BorderData
   | Dashed BorderData
   | Dotted BorderData

This way to define an element border one needs to set at least a color and a width. Elm Designer can always generate some defaults: 1px border width, solid style, dark gray color and square corners (radius with 0px).

Shadow

We could change the Shadow type in the same way:

type alias ShadowData =
    { offsetX : Float
    , offsetY : Float
    , size : Float
    , blur : Float
    , color : Color    
    }

type Shadow
    = None 
    | Inner ShadowData
    | Outer ShadowData

With these changes None in the UI is then set only by the click on the panel trash can icon, make it more obvious that user is gonna to delete some styles. On the contrary, when switching from Inner to Outer style we copy the ShadowData record from one variant to another.

Note: This change causes a MAJOR schema change and it needs to be handled accordingly. We need to bump the schema version and create a decoder which reads back old JSON data serialized with v4.

Metadata

Metadata

Assignees

Labels

enhancementNew feature or requestschema changeThe issue will need a database schema change

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions