Render the columns in QML

Main.qml

@@ -4,10 +4,10 @@ import QtQuick.Controls
 import QtQuick.Layouts
 
 ApplicationWindow {
-    width: 800
+    width: 750
-    height: 600
+    height: 650
     visible: true
-    title: qsTr("Solitaire")
+    title: qsTr("Solitare")
 
     ScoreBar {
         id: scoreBar
@@ -19,6 +19,7 @@ ApplicationWindow {
 
     // Show the foundation piles, throwaway pile & the draw stack on the first row
     Item {
+        id: firstRow
         height: 120
         anchors.top: scoreBar.bottom
         anchors.left: parent.left
@@ -77,4 +78,31 @@ ApplicationWindow {
             }
         }
     }
+
+    // Second row, with the individual columns
+    Row {
+        spacing: 10
+
+        anchors.top: firstRow.bottom
+        anchors.horizontalCenter: parent.horizontalCenter
+        anchors.topMargin: 50
+
+        Repeater {
+            model: gameState.columns.length
+            // Make a column for each slot
+            delegate: Column {
+                required property int index // passed from repeater
+                spacing: -80 // Overlap
+
+                Repeater {
+                    model: gameState.columns[parent.index].length
+                    delegate: CardModel {
+                        required property int index
+                        card: gameState.columns[parent.index][index].card
+                        isFaceDown: !gameState.columns[parent.index][index].revealed
+                    }
+                }
+            }
+        }
+    }
 }