Tile cards in deck editor

www/src/Pages/DeckEditor.elm

@@ -73,29 +73,16 @@ update msg model =
 
 viewDeck : Deck.Deck -> E.Element Msg
 viewDeck deck =
-    let
-        cardRow card =
-            E.row
-                [ E.width E.fill
-                , E.spacing 10
-                , E.padding 3
-                ]
-                [ E.column [ E.centerY, E.height E.fill, E.width E.fill, E.clipX ]
-                    [ UI.title card.oracle.name
-                    , UI.subtitle ("x" ++ String.fromInt card.quantity)
-                    ]
-                ]
-    in
     E.column [ E.height E.fill, E.width E.fill, E.centerX, E.spacing 5 ] <|
         [ E.paragraph [ Font.heavy, Font.size 24, Font.center ] [ UI.title deck.name ]
-        , E.column [ E.width E.fill, E.height E.fill, E.scrollbarY ] <|
+        , E.wrappedRow [ E.width E.fill, E.height E.fill, E.scrollbarY ] <|
             List.map
                 (\dc ->
                     UI.cardRow
                         { foil = False
                         , subtitle = "x" ++ String.fromInt dc.quantity
                         }
-                        []
+                        [ E.width <| E.px 400, E.clipX ]
                         dc.card
                 )
                 deck.cards

www/src/UI.elm

@@ -178,17 +178,14 @@ cardRow options attributes card =
     let
         badge color foil string =
             E.el
-                ([ Border.rounded 5
+                [ Border.rounded 5
-                 , Border.color color
+                , Border.color color
-                 , Border.width 1
+                , Border.width 1
-                 , E.width <| E.px 60
+                , E.width <| E.px 60
-                 , Font.family [ Font.typeface "sans" ]
+                , Font.family [ Font.typeface "sans" ]
-                 , Font.size 10
+                , Font.size 10
-                 , Font.color colors.title
+                , Font.color colors.title
-                 , E.mouseOver [ Background.color colors.hover ]
+                ]
-                 ]
-                    ++ attributes
-                )
             <|
                 E.row [ E.height E.fill, E.width E.fill ]
                     [ E.el [ E.padding 2, E.width E.fill ] <| E.text string
@@ -246,10 +243,14 @@ cardRow options attributes card =
                 ]
     in
     E.row
-        [ E.width E.fill
+        (List.append
-        , E.spacing 10
+            [ E.width E.fill
-        , E.padding 3
+            , E.spacing 10
-        ]
+            , E.padding 3
+            , E.mouseOver [ Background.color colors.hover ]
+            ]
+            attributes
+        )
         [ E.el [ E.width <| E.px 100 ] <|
             E.image
                 [ E.height <| E.px 60