From 1f9092515201e9db46f3fb15b3c2c1675c66c7c7 Mon Sep 17 00:00:00 2001 From: joffrey-bion Date: Sat, 28 Nov 2020 02:13:35 +0100 Subject: Group resources in a 2x2 matrix when there are 4 Related: https://github.com/joffrey-bion/seven-wonders/issues/50 --- .../sevenwonders/ui/components/game/TransactionsSelector.kt | 9 ++++++--- 1 file changed, 6 insertions(+), 3 deletions(-) diff --git a/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/game/TransactionsSelector.kt b/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/game/TransactionsSelector.kt index ebe97bfa..a05effea 100644 --- a/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/game/TransactionsSelector.kt +++ b/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/game/TransactionsSelector.kt @@ -156,11 +156,14 @@ private fun StyledDOMBuilder
.transactionCellInnerCss() { } } -private fun RBuilder.resourceList(resources: List) { +private fun RBuilder.resourceList(countedResources: List) { + val resources = countedResources.toRepeatedTypesList() + // The biggest card is the Palace and requires 7 resources (1 of each). // We always have at least 1 resource on our wonder, so we'll never need to buy more than 6. - // Therefore, 3 by row seems decent. - val rows = resources.toRepeatedTypesList().chunked(3) + // Therefore, 3 by row seems decent. When there are 4 items, it's visually better to have a 2x2 matrix, though. + val rows = resources.chunked(if (resources.size == 4) 2 else 3) + val imgSize = 1.5.rem styledDiv { css { -- cgit