blah.elm

-- I have a conditional that changes on element in a potentially long list of css elements

cssDoubleTextImageSection : Bool -> List Css.Style
cssDoubleTextImageSection isLeftAligned =
    if isLeftAligned then
        [ displayFlex
        , flexDirection row
        , Css.padding (Css.px 50)
        ]

    else
        [ displayFlex
        , flexDirection Css.rowReverse
        , Css.padding (Css.px 50)
        ]
        
        
-- One solution is this, but it also seems a bit strange

cssNavigationItem : Bool -> List Css.Style
cssNavigationItem isFeatured =
    let
        common =
            [ cursor pointer
            , Css.fontWeight Css.bold
            ]
    in
    if isFeatured then
        -- Missing the diagonal cut on the left side
        List.append common
            [ displayFlex
            , Css.alignItems Css.center
            , Css.color <| Css.hex "#FFFFFF"
            , Css.height (Css.pct 100)
            , Css.paddingLeft (Css.px 30)
            , Css.paddingRight (Css.px 15)
            , Css.property "background" "linear-gradient(26.34deg, #3023AE -0.5%, #6DA4D7 100%)"
            ]

    else
        List.append common
            [ padding (px 10) ]