Fix some rendering issues

commonUI/src/main/kotlin/ch/dissem/yaep/ui/common/App.kt

@@ -6,12 +6,10 @@ import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.aspectRatio
 import androidx.compose.foundation.layout.fillMaxHeight
-import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.wrapContentHeight
 import androidx.compose.foundation.lazy.grid.GridCells
-import androidx.compose.foundation.lazy.grid.GridItemSpan
 import androidx.compose.foundation.lazy.grid.LazyVerticalGrid
 import androidx.compose.material3.HorizontalDivider
 import androidx.compose.material3.OutlinedCard
@@ -48,7 +46,11 @@ fun App(modifier: Modifier = Modifier) {
     val verticalClues = remember { game.verticalClues.map { DisplayClue(it) } }
     Row(modifier = modifier) {
         PuzzleGrid(modifier = Modifier.aspectRatio(1f).weight(0.6f).fillMaxHeight(), game.grid)
-        PuzzleClues(modifier = Modifier.weight(0.4f).fillMaxHeight(), horizontalClues, verticalClues)
+        PuzzleClues(
+            modifier = Modifier.padding(start = 16.dp).weight(0.4f).fillMaxHeight(),
+            horizontalClues,
+            verticalClues
+        )
     }
 }
 
@@ -88,56 +90,38 @@ fun PuzzleClues(
 ) {
     Column(modifier = modifier) {
         LazyVerticalGrid(
-            modifier = Modifier.fillMaxSize(),
+            modifier = Modifier.fillMaxWidth().wrapContentHeight(),
             columns = GridCells.Fixed(4)
         ) {
-            for (clue in horizontalClues.filter { it.isActive }) {
+            for (clue in horizontalClues) {
                 item {
                     HorizontalClue(
                         modifier = Modifier
+                            .alpha(if (clue.isActive) 1f else 0.2f)
                             .padding(8.dp)
                             .clickable { clue.isActive = false },
                         clue = clue.clue
                     )
                 }
             }
-            for (clue in horizontalClues.filter { !it.isActive }) {
-                item {
-                    HorizontalClue(
-                        modifier = Modifier
-                            .alpha(0.5f)
-                            .padding(8.dp)
-                            .clickable { clue.isActive = true },
-                        clue = clue.clue
-                    )
-                }
-            }
-            item(span = { GridItemSpan(maxLineSpan) }) {
-                HorizontalDivider()
-            }
-            for (clue in verticalClues.filter { it.isActive }) {
+        }
+        HorizontalDivider()
+        LazyVerticalGrid(
+            modifier = Modifier.fillMaxWidth().wrapContentHeight(),
+            columns = GridCells.Fixed(8)
+        ) {
+            for (clue in verticalClues) {
                 item {
                     VerticalClue(
                         modifier = Modifier
+                            .alpha(if (clue.isActive) 1f else 0.2f)
                             .padding(8.dp)
-                            .aspectRatio(0.3333f)
+                            .aspectRatio(0.33333334f)
                             .clickable { clue.isActive = false },
                         clue = clue.clue
                     )
                 }
             }
-            for (clue in verticalClues.filter { !it.isActive }) {
-                item {
-                    VerticalClue(
-                        modifier = Modifier
-                            .alpha(0.5f)
-                            .padding(8.dp)
-                            .aspectRatio(0.3333f)
-                            .clickable { clue.isActive = true },
-                        clue = clue.clue
-                    )
-                }
-            }
         }
     }
 }
@@ -179,7 +163,7 @@ fun HorizontalClue(modifier: Modifier = Modifier, clue: HorizontalClue) {
 
 @Composable
 fun VerticalClue(modifier: Modifier = Modifier, clue: SameColumnClue<*, *>) {
-    OutlinedCard(modifier) {
+    OutlinedCard(modifier.aspectRatio(0.5f)) {
         Column {
             DrawItem(modifier = Modifier.weight(1f), clue.a)
             DrawItem(modifier = Modifier.weight(1f), clue.b)

desktop/src/main/kotlin/ch/dissem/yaep/ui/desktop/main.kt

@@ -8,6 +8,8 @@ import androidx.compose.ui.text.font.FontFamily
 import androidx.compose.ui.text.font.FontStyle
 import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.text.platform.Font
+import androidx.compose.ui.unit.DpSize
+import androidx.compose.ui.unit.dp
 import androidx.compose.ui.window.Window
 import androidx.compose.ui.window.WindowPlacement
 import androidx.compose.ui.window.application
@@ -27,7 +29,8 @@ fun main() = application {
         )
     )
     val windowState = rememberWindowState(
-        placement = WindowPlacement.Floating
+        placement = WindowPlacement.Floating,
+        size = DpSize(1200.dp, 800.dp)
     )
 
     Window(