diff options
-rw-r--r-- | sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/GlobalStyles.kt | 15 | ||||
-rw-r--r-- | sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/game/GameScene.kt | 30 |
2 files changed, 23 insertions, 22 deletions
diff --git a/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/GlobalStyles.kt b/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/GlobalStyles.kt index 9a4c15a6..97a9fbfa 100644 --- a/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/GlobalStyles.kt +++ b/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/GlobalStyles.kt @@ -1,17 +1,8 @@ package org.luxons.sevenwonders.ui.components -import kotlinx.css.Overflow -import kotlinx.css.Position -import kotlinx.css.bottom -import kotlinx.css.left -import kotlinx.css.overflow -import kotlinx.css.pct -import kotlinx.css.position +import kotlinx.css.* import kotlinx.css.properties.transform import kotlinx.css.properties.translate -import kotlinx.css.px -import kotlinx.css.right -import kotlinx.css.top import styled.StyleSheet object GlobalStyles : StyleSheet("GlobalStyles", isStatic = true) { @@ -42,4 +33,8 @@ object GlobalStyles : StyleSheet("GlobalStyles", isStatic = true) { translate((-50).pct, (-50).pct) } } + + val noPadding by css { + padding(all = 0.px) + } } diff --git a/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/game/GameScene.kt b/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/game/GameScene.kt index 06cb5b00..ce32e8b9 100644 --- a/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/game/GameScene.kt +++ b/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/game/GameScene.kt @@ -18,10 +18,7 @@ import org.luxons.sevenwonders.ui.redux.RequestUnprepareMove import org.luxons.sevenwonders.ui.redux.connectStateAndDispatch import react.* import react.dom.* -import styled.StyledDOMBuilder -import styled.css -import styled.styledDiv -import styled.styledImg +import styled.* interface GameSceneStateProps : RProps { var playerIsReady: Boolean @@ -60,14 +57,7 @@ private class GameScene(props: GameSceneProps) : RComponent<GameSceneProps, RSta private fun RBuilder.turnInfoScene(turnInfo: PlayerTurnInfo) { val board = turnInfo.table.boards[turnInfo.playerIndex] div { - styledDiv { - css { - classes.add("bp3-dark") - display = Display.inlineBlock // so that the cards below don't overlap, but the width is not full - margin(all = 0.4.rem) - } - bpCallout(intent = Intent.PRIMARY, icon = "info-sign") { +turnInfo.message } - } + actionInfo(turnInfo.message) boardComponent(board = board) val hand = turnInfo.hand if (hand != null) { @@ -90,6 +80,22 @@ private class GameScene(props: GameSceneProps) : RComponent<GameSceneProps, RSta } } + private fun RDOMBuilder<DIV>.actionInfo(message: String) { + styledDiv { + css { + classes.add("bp3-dark") + display = Display.inlineBlock // so that the cards below don't overlap, but the width is not full + margin(all = 0.4.rem) + } + bpCard(elevation = Elevation.TWO) { + attrs { + this.className = GlobalStyles.getClassName { it::noPadding } + } + bpCallout(intent = Intent.PRIMARY, icon = "info-sign") { +message } + } + } + } + private fun RBuilder.preparedMove(card: HandCard, move: PlayerMove) { bpOverlay(isOpen = true, onClose = props.unprepareMove) { styledDiv { |