Allow the user to choose between 3 preview sizes

modules/webapp/src/main/elm/Comp/BasicSizeField.elm

@@ -0,0 +1,40 @@
+module Comp.BasicSizeField exposing (Msg, update, view)
+
+import Data.BasicSize exposing (BasicSize)
+import Html exposing (..)
+import Html.Attributes exposing (..)
+import Html.Events exposing (onCheck)
+
+
+type Msg
+    = Toggle BasicSize
+
+
+update : Msg -> Maybe BasicSize
+update msg =
+    case msg of
+        Toggle bs ->
+            Just bs
+
+
+view : String -> BasicSize -> Html Msg
+view labelTxt current =
+    div [ class "grouped fields" ]
+        (label [] [ text labelTxt ]
+            :: List.map (makeField current) Data.BasicSize.all
+        )
+
+
+makeField : BasicSize -> BasicSize -> Html Msg
+makeField current element =
+    div [ class "field" ]
+        [ div [ class "ui radio checkbox" ]
+            [ input
+                [ type_ "radio"
+                , checked (current == element)
+                , onCheck (\_ -> Toggle element)
+                ]
+                []
+            , label [] [ text (Data.BasicSize.label element) ]
+            ]
+        ]

modules/webapp/src/main/elm/Comp/ItemCardList.elm

@@ -239,6 +239,7 @@ viewItem cfg settings item =
                 [ img
                     [ class "preview-image"
                     , src (Api.itemPreviewURL item.id)
+                    , Data.UiSettings.cardPreviewSize settings
                     ]
                     []
                 ]

modules/webapp/src/main/elm/Comp/UiSettingsForm.elm

@@ -8,9 +8,11 @@ module Comp.UiSettingsForm exposing
 
 import Api
 import Api.Model.TagList exposing (TagList)
+import Comp.BasicSizeField
 import Comp.ColorTagger
 import Comp.FieldListSelect
 import Comp.IntField
+import Data.BasicSize exposing (BasicSize)
 import Data.Color exposing (Color)
 import Data.Fields exposing (Field)
 import Data.Flags exposing (Flags)
@@ -42,6 +44,7 @@ type alias Model =
     , itemDetailShortcuts : Bool
     , searchMenuVisible : Bool
     , editMenuVisible : Bool
+    , cardPreviewSize : BasicSize
     }
 
 
@@ -93,6 +96,7 @@ init flags settings =
       , itemDetailShortcuts = settings.itemDetailShortcuts
       , searchMenuVisible = settings.searchMenuVisible
       , editMenuVisible = settings.editMenuVisible
+      , cardPreviewSize = settings.cardPreviewSize
       }
     , Api.getTags flags "" GetTagsResp
     )
@@ -112,6 +116,7 @@ type Msg
     | ToggleItemDetailShortcuts
     | ToggleSearchMenuVisible
     | ToggleEditMenuVisible
+    | CardPreviewSizeMsg Comp.BasicSizeField.Msg
 
 
 
@@ -297,6 +302,23 @@ update sett msg model =
             , Just { sett | editMenuVisible = flag }
             )
 
+        CardPreviewSizeMsg lm ->
+            let
+                next =
+                    Comp.BasicSizeField.update lm
+                        |> Maybe.withDefault model.cardPreviewSize
+
+                newSettings =
+                    if next /= model.cardPreviewSize then
+                        Just { sett | cardPreviewSize = next }
+
+                    else
+                        Nothing
+            in
+            ( { model | cardPreviewSize = next }
+            , newSettings
+            )
+
 
 
 --- View
@@ -329,6 +351,9 @@ view flags _ model =
                 "field"
                 model.searchPageSizeModel
             )
+        , div [ class "ui dividing header" ]
+            [ text "Item Cards"
+            ]
         , Html.map NoteLengthMsg
             (Comp.IntField.viewWithInfo
                 ("Maximum size of the item notes to display in card view. Between 0 - "
@@ -339,6 +364,11 @@ view flags _ model =
                 "field"
                 model.searchNoteLengthModel
             )
+        , Html.map CardPreviewSizeMsg
+            (Comp.BasicSizeField.view
+                "Size of item preview"
+                model.cardPreviewSize
+            )
         , div [ class "ui dividing header" ]
             [ text "Search Menu" ]
         , div [ class "field" ]