diff options
Diffstat (limited to 'sw-ui')
16 files changed, 99 insertions, 86 deletions
diff --git a/sw-ui/build.gradle.kts b/sw-ui/build.gradle.kts index 8c1936c4..d1c4e6a8 100644 --- a/sw-ui/build.gradle.kts +++ b/sw-ui/build.gradle.kts @@ -20,7 +20,7 @@ kotlin { implementation(libs.kotlin.wrappers.react.dom) implementation(libs.kotlin.wrappers.react.redux) implementation(libs.kotlin.wrappers.react.router.dom) - implementation(libs.kotlin.wrappers.styled) + implementation(libs.kotlin.wrappers.styled.next) implementation(libs.kotlin.wrappers.blueprintjs.core) implementation(libs.kotlin.wrappers.blueprintjs.icons) } diff --git a/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/SevenWondersUi.kt b/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/SevenWondersUi.kt index 152ff1d5..44faede8 100644 --- a/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/SevenWondersUi.kt +++ b/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/SevenWondersUi.kt @@ -1,21 +1,15 @@ package org.luxons.sevenwonders.ui -import kotlinx.browser.document import kotlinx.browser.window -import kotlinx.coroutines.DelicateCoroutinesApi -import kotlinx.coroutines.GlobalScope -import kotlinx.coroutines.launch -import org.luxons.sevenwonders.ui.components.application -import org.luxons.sevenwonders.ui.redux.SwState -import org.luxons.sevenwonders.ui.redux.configureStore -import org.luxons.sevenwonders.ui.redux.sagas.SagaManager -import org.luxons.sevenwonders.ui.redux.sagas.rootSaga -import org.w3c.dom.Element +import kotlinx.coroutines.* +import org.luxons.sevenwonders.ui.components.* +import org.luxons.sevenwonders.ui.redux.* +import org.luxons.sevenwonders.ui.redux.sagas.* import react.dom.* -import react.redux.provider -import redux.RAction -import redux.Store -import redux.WrapperAction +import react.redux.* +import redux.* +import web.dom.* +import web.dom.document fun main() { window.onload = { diff --git a/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/errors/ErrorDialog.kt b/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/errors/ErrorDialog.kt index 38b3617a..5ff56055 100644 --- a/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/errors/ErrorDialog.kt +++ b/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/errors/ErrorDialog.kt @@ -1,18 +1,13 @@ package org.luxons.sevenwonders.ui.components.errors -import blueprintjs.core.Classes -import blueprintjs.core.Intent -import blueprintjs.core.bpButton -import blueprintjs.core.bpDialog -import blueprintjs.icons.IconNames -import kotlinx.browser.window +import blueprintjs.core.* +import blueprintjs.icons.* +import kotlinx.browser.* import org.luxons.sevenwonders.ui.redux.* -import org.luxons.sevenwonders.ui.router.Navigate -import org.luxons.sevenwonders.ui.router.SwRoute +import org.luxons.sevenwonders.ui.router.* import react.* import react.dom.p -import styled.css -import styled.styledDiv +import styled.* external interface ErrorDialogStateProps : PropsWithChildren { var errorMessage: String? 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 e69882c4..cec41d6a 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 @@ -20,9 +20,9 @@ import org.luxons.sevenwonders.model.cards.HandCard import org.luxons.sevenwonders.model.resources.ResourceTransactionOptions import org.luxons.sevenwonders.ui.components.GlobalStyles import org.luxons.sevenwonders.ui.redux.* +import org.luxons.sevenwonders.ui.utils.* import react.* import styled.css -import styled.getClassName import styled.styledDiv external interface GameSceneStateProps : PropsWithChildren { @@ -147,7 +147,7 @@ private class GameScene(props: GameSceneProps) : RComponent<GameSceneProps, Game private fun RBuilder.actionInfo(message: String) { styledDiv { css { - classes.add("bp3-dark") + classes.add(Classes.DARK) position = Position.fixed top = 0.pct left = 0.pct @@ -156,7 +156,7 @@ private class GameScene(props: GameSceneProps) : RComponent<GameSceneProps, Game } bpCard(elevation = Elevation.TWO) { attrs { - this.className = GlobalStyles.getClassName { it::noPadding } + this.className = GlobalStyles.getTypedClassName { it::noPadding } } bpCallout(intent = Intent.PRIMARY, icon = IconNames.INFO_SIGN) { +message } } diff --git a/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/game/GameStyles.kt b/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/game/GameStyles.kt index 6b4388e3..86d2d101 100644 --- a/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/game/GameStyles.kt +++ b/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/game/GameStyles.kt @@ -27,13 +27,13 @@ object GameStyles : StyleSheet("GameStyles", isStatic = true) { borderRadius = 0.5.rem padding(all = 0.5.rem) - children(".bp3-popover-content") { + children(".bp4-popover-content") { background = "none" // overrides default white background } - descendants(".bp3-popover-arrow-fill") { + descendants(".bp4-popover-arrow-fill") { put("fill", bgColor.toString()) // overrides default white arrow } - descendants(".bp3-popover-arrow::before") { + descendants(".bp4-popover-arrow::before") { // The popover arrow is implemented with a simple square rotated 45 degrees (like a rhombus). // Since we use a semi-transparent background, we can see the box shadow of the rest of the arrow through // the popover, and thus we see the square. This boxShadow(transparent) is to avoid that. @@ -54,7 +54,7 @@ object GameStyles : StyleSheet("GameStyles", isStatic = true) { backgroundColor = sandBgColor width = 40.rem // default is 500px, we want to fit players on the side - children(".bp3-dialog-header") { + children(".bp4-dialog-header") { background = "none" // overrides default white background } } diff --git a/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/game/Hand.kt b/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/game/Hand.kt index 0078fbd5..da17c987 100644 --- a/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/game/Hand.kt +++ b/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/game/Hand.kt @@ -14,12 +14,12 @@ import org.luxons.sevenwonders.model.cards.CardPlayability import org.luxons.sevenwonders.model.cards.HandCard import org.luxons.sevenwonders.model.resources.ResourceTransactionOptions import org.luxons.sevenwonders.model.wonders.WonderBuildability -import org.w3c.dom.HTMLButtonElement import react.* import react.dom.attrs import styled.StyledDOMBuilder import styled.css import styled.styledDiv +import web.html.* import kotlin.math.absoluteValue private enum class HandAction( @@ -126,7 +126,7 @@ class HandComponent(props: HandProps) : RComponent<HandProps, State>(props) { } } - private fun RElementBuilder<IButtonGroupProps>.playCardButton(card: HandCard, handAction: HandAction) { + private fun RElementBuilder<ButtonGroupProps>.playCardButton(card: HandCard, handAction: HandAction) { bpButton( title = "${handAction.buttonTitle} (${cardPlayabilityInfo(card.playability)})", large = true, @@ -141,7 +141,7 @@ class HandComponent(props: HandProps) : RComponent<HandProps, State>(props) { } } - private fun RElementBuilder<IButtonGroupProps>.upgradeWonderButton(card: HandCard) { + private fun RElementBuilder<ButtonGroupProps>.upgradeWonderButton(card: HandCard) { val wonderBuildability = props.ownBoard.wonder.buildability bpButton( title = "UPGRADE WONDER (${wonderBuildabilityInfo(wonderBuildability)})", @@ -164,7 +164,7 @@ class HandComponent(props: HandProps) : RComponent<HandProps, State>(props) { } } - private fun RElementBuilder<IButtonGroupProps>.discardButton(card: HandCard) { + private fun RElementBuilder<ButtonGroupProps>.discardButton(card: HandCard) { bpButton( title = "DISCARD (+3 coins)", // TODO remove hardcoded value large = true, @@ -196,7 +196,7 @@ private fun pricePrefix(amount: Int) = when { else -> "" } -private fun RElementBuilder<IButtonProps<HTMLButtonElement>>.priceInfo(amount: Int) { +private fun RElementBuilder<ButtonProps<HTMLButtonElement>>.priceInfo(amount: Int) { val size = 1.rem goldIndicator( amount = amount, diff --git a/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/game/ScoreTable.kt b/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/game/ScoreTable.kt index b89a02a8..01bf139b 100644 --- a/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/game/ScoreTable.kt +++ b/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/game/ScoreTable.kt @@ -1,13 +1,21 @@ package org.luxons.sevenwonders.ui.components.game import blueprintjs.core.* +import csstype.* import kotlinx.css.* +import kotlinx.css.Display +import kotlinx.css.FlexDirection +import kotlinx.css.TextAlign +import kotlinx.css.VerticalAlign +import kotlinx.css.px +import kotlinx.css.rem import kotlinx.html.TD import kotlinx.html.TH import org.luxons.sevenwonders.model.api.PlayerDTO import org.luxons.sevenwonders.model.score.ScoreBoard import org.luxons.sevenwonders.model.score.ScoreCategory import org.luxons.sevenwonders.ui.components.GlobalStyles +import org.luxons.sevenwonders.ui.utils.* import react.RBuilder import react.dom.* import styled.* @@ -18,7 +26,7 @@ fun RBuilder.scoreTableOverlay(scoreBoard: ScoreBoard, players: List<PlayerDTO>, attrs { val fixedCenterClass = GlobalStyles.getClassName { it::fixedCenter } val scoreBoardClass = GameStyles.getClassName { it::scoreBoard } - className = "$fixedCenterClass $scoreBoardClass" + className = ClassName("$fixedCenterClass $scoreBoardClass") } styledDiv { css { @@ -77,7 +85,7 @@ private fun RBuilder.scoreTable(scoreBoard: ScoreBoard, players: List<PlayerDTO> centeredTd { bpTag(large = true, round = true, minimal = true) { attrs { - this.className = GameStyles.getClassName { it::totalScore } + this.className = GameStyles.getTypedClassName { it::totalScore } } +"${score.totalPoints}" } @@ -132,7 +140,7 @@ private fun RBuilder.centeredTd(block: RDOMBuilder<TD>.() -> Unit) { } } -private fun classNameForCategory(cat: ScoreCategory): String = GameStyles.getClassName { +private fun classNameForCategory(cat: ScoreCategory): ClassName = GameStyles.getTypedClassName { when (cat) { ScoreCategory.CIVIL -> it::civilScore ScoreCategory.SCIENCE -> it::scienceScore 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 b50f540f..66bc44d3 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 @@ -12,6 +12,7 @@ import org.luxons.sevenwonders.model.api.PlayerDTO import org.luxons.sevenwonders.model.resources.* import org.luxons.sevenwonders.model.resources.Provider import org.luxons.sevenwonders.ui.components.gameBrowser.playerInfo +import org.luxons.sevenwonders.ui.utils.* import react.* import react.dom.* import styled.* @@ -31,7 +32,7 @@ fun RBuilder.transactionsSelectorDialog( onClose = cancelTransactionSelection, ) { attrs { - className = GameStyles.getClassName { it::transactionsSelector } + className = GameStyles.getTypedClassName { it::transactionsSelector } } div { attrs { @@ -51,7 +52,7 @@ fun RBuilder.transactionsSelectorDialog( neighbour(neighbours.first) styledDiv { css { - grow(Grow.GROW) + flex(Flex.GROW) margin(horizontal = 0.5.rem) display = Display.flex flexDirection = FlexDirection.column @@ -237,7 +238,7 @@ private fun RBuilder.resourceList(countedResources: List<CountedResource>) { flexDirection = FlexDirection.column alignItems = Align.center justifyContent = JustifyContent.center - grow(Grow.GROW) + flex(Flex.GROW) // this ensures stable dimensions, no matter how many resources (up to 2x3 matrix) width = imgSize * 3 height = imgSize * 2 diff --git a/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/gameBrowser/CreateGameForm.kt b/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/gameBrowser/CreateGameForm.kt index 45bc3ae4..0d148744 100644 --- a/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/gameBrowser/CreateGameForm.kt +++ b/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/gameBrowser/CreateGameForm.kt @@ -5,7 +5,6 @@ import blueprintjs.icons.* import kotlinx.css.* import kotlinx.html.js.* import org.luxons.sevenwonders.ui.redux.* -import org.w3c.dom.* import react.* import react.dom.* import styled.* @@ -43,7 +42,7 @@ private class CreateGameForm(props: CreateGameFormProps) : RComponent<CreateGame large = true, placeholder = "Game name", onChange = { e -> - val input = e.currentTarget as HTMLInputElement + val input = e.currentTarget state.gameName = input.value }, rightElement = createGameButton(), diff --git a/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/gameBrowser/GameBrowser.kt b/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/gameBrowser/GameBrowser.kt index 0f8cca86..579e6cb2 100644 --- a/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/gameBrowser/GameBrowser.kt +++ b/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/gameBrowser/GameBrowser.kt @@ -1,17 +1,13 @@ package org.luxons.sevenwonders.ui.components.gameBrowser -import blueprintjs.core.Classes -import blueprintjs.core.bpCard +import blueprintjs.core.* import kotlinx.css.* -import kotlinx.html.classes +import kotlinx.html.* import org.luxons.sevenwonders.ui.components.GlobalStyles -import react.RBuilder -import react.dom.attrs -import react.dom.h1 -import styled.css -import styled.getClassName -import styled.styledDiv -import styled.styledH2 +import org.luxons.sevenwonders.ui.utils.* +import react.* +import react.dom.* +import styled.* fun RBuilder.gameBrowser() = styledDiv { css { @@ -36,7 +32,7 @@ fun RBuilder.gameBrowser() = styledDiv { currentPlayerInfo() } - bpCard(className = GameBrowserStyles.getClassName { it::createGameCard }) { + bpCard(className = GameBrowserStyles.getTypedClassName { it::createGameCard }) { styledH2 { css { +GameBrowserStyles.cardTitle } +"Create a Game" diff --git a/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/gameBrowser/GameList.kt b/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/gameBrowser/GameList.kt index 466f9251..a1f47045 100644 --- a/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/gameBrowser/GameList.kt +++ b/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/gameBrowser/GameList.kt @@ -2,7 +2,14 @@ package org.luxons.sevenwonders.ui.components.gameBrowser import blueprintjs.core.* import blueprintjs.icons.IconNames +import csstype.* import kotlinx.css.* +import kotlinx.css.Display +import kotlinx.css.FlexDirection +import kotlinx.css.JustifyContent +import kotlinx.css.TextAlign +import kotlinx.css.VerticalAlign +import kotlinx.css.rem import kotlinx.html.classes import kotlinx.html.title import org.luxons.sevenwonders.model.api.ConnectedPlayer @@ -24,7 +31,7 @@ external interface GameListDispatchProps : PropsWithChildren { var joinGame: (Long) -> Unit } -interface GameListProps : GameListStateProps, GameListDispatchProps +external interface GameListProps : GameListStateProps, GameListDispatchProps class GameListPresenter(props: GameListProps) : RComponent<GameListProps, RState>(props) { @@ -43,7 +50,7 @@ class GameListPresenter(props: GameListProps) : RComponent<GameListProps, RState ) { styledDiv { attrs { - classes += "bp3-running-text" + classes += Classes.RUNNING_TEXT } css { maxWidth = 35.rem @@ -57,7 +64,7 @@ class GameListPresenter(props: GameListProps) : RComponent<GameListProps, RState private fun RBuilder.gamesTable() { bpHtmlTable { attrs { - className = GameBrowserStyles.getClassName { it::gameTable } + className = ClassName(GameBrowserStyles.getClassName { it::gameTable }) } columnWidthsSpec() thead { @@ -71,7 +78,7 @@ class GameListPresenter(props: GameListProps) : RComponent<GameListProps, RState } } - private fun RElementBuilder<IHTMLTableProps>.columnWidthsSpec() { + private fun RElementBuilder<HTMLTableProps>.columnWidthsSpec() { colgroup { styledCol { css { diff --git a/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/home/ChooseNameForm.kt b/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/home/ChooseNameForm.kt index 279e94f2..27a2057c 100644 --- a/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/home/ChooseNameForm.kt +++ b/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/home/ChooseNameForm.kt @@ -1,18 +1,12 @@ package org.luxons.sevenwonders.ui.components.home -import blueprintjs.core.Intent -import blueprintjs.core.bpButton -import blueprintjs.core.bpInputGroup -import blueprintjs.icons.IconNames +import blueprintjs.core.* +import blueprintjs.icons.* import kotlinx.css.* -import kotlinx.html.js.onSubmitFunction -import org.luxons.sevenwonders.ui.redux.RequestChooseName -import org.luxons.sevenwonders.ui.redux.connectDispatch -import org.w3c.dom.HTMLInputElement +import kotlinx.html.js.* +import org.luxons.sevenwonders.ui.redux.* import react.* -import styled.css -import styled.styledDiv -import styled.styledForm +import styled.* private external interface ChooseNameFormProps : PropsWithChildren { var chooseUsername: (String) -> Unit @@ -46,7 +40,7 @@ private class ChooseNameForm(props: ChooseNameFormProps) : RComponent<ChooseName rightElement = submitButton(), value = state.username, onChange = { e -> - val input = e.currentTarget as HTMLInputElement + val input = e.currentTarget setState { username = input.value } diff --git a/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/lobby/Lobby.kt b/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/lobby/Lobby.kt index 1cb4989c..7435ffb0 100644 --- a/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/lobby/Lobby.kt +++ b/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/lobby/Lobby.kt @@ -1,20 +1,23 @@ package org.luxons.sevenwonders.ui.components.lobby import blueprintjs.core.* -import blueprintjs.icons.IconNames +import blueprintjs.icons.* +import csstype.* import kotlinx.css.* +import kotlinx.css.Display +import kotlinx.css.JustifyContent import kotlinx.css.Position -import kotlinx.css.properties.transform -import kotlinx.css.properties.translate -import org.luxons.sevenwonders.model.api.LobbyDTO -import org.luxons.sevenwonders.model.api.PlayerDTO +import kotlinx.css.pct +import kotlinx.css.properties.* +import kotlinx.css.px +import kotlinx.css.rem +import org.luxons.sevenwonders.model.api.* import org.luxons.sevenwonders.model.wonders.* import org.luxons.sevenwonders.ui.components.GlobalStyles import org.luxons.sevenwonders.ui.redux.* import react.* -import react.dom.h1 -import react.dom.h3 -import react.dom.h4 +import react.State +import react.dom.* import styled.* private val BOT_NAMES = listOf("Wall-E", "B-Max", "Sonny", "T-800", "HAL", "GLaDOS", "R2-D2", "Bender", "AWESOM-O") @@ -121,7 +124,7 @@ class LobbyPresenter(props: LobbyProps) : RComponent<LobbyProps, State>(props) { css { +LobbyStyles.setupPanel } - bpCard(Elevation.TWO, className = Classes.DARK) { + bpCard(Elevation.TWO, className = ClassName(Classes.DARK)) { styledH2 { css { margin(top = 0.px) diff --git a/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/lobby/RadialPlayerList.kt b/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/lobby/RadialPlayerList.kt index 22fcd3ad..2084b7c0 100644 --- a/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/lobby/RadialPlayerList.kt +++ b/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/components/lobby/RadialPlayerList.kt @@ -2,7 +2,13 @@ package org.luxons.sevenwonders.ui.components.lobby import blueprintjs.core.bpIcon import blueprintjs.core.bpTag +import csstype.* import kotlinx.css.* +import kotlinx.css.Color +import kotlinx.css.Display +import kotlinx.css.FlexDirection +import kotlinx.css.px +import kotlinx.css.rem import kotlinx.html.DIV import org.luxons.sevenwonders.model.api.PlayerDTO import org.luxons.sevenwonders.model.api.actions.Icon @@ -112,16 +118,16 @@ private fun RBuilder.playerElement(playerItem: PlayerItem) { css { marginTop = 0.3.rem - // this is to overcome ".bp3-dark .bp3-tag" on the nested bpTag + // this is to overcome ".bp4-dark .bp4-tag" on the nested bpTag children(".wonder-tag") { - color = Color("#f5f8fa") // blueprintjs dark theme color (removed by .bp3-tag) + color = Color("#f5f8fa") // blueprintjs dark theme color (removed by .bp4-tag) backgroundColor = when (wonder.side) { WonderSide.A -> Color.seaGreen WonderSide.B -> Color.darkRed } } } - bpTag(round = true, className = "wonder-tag") { + bpTag(round = true, className = ClassName("wonder-tag")) { +"${wonder.name} ${wonder.side}" } } diff --git a/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/utils/StyleUtils.kt b/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/utils/StyleUtils.kt new file mode 100644 index 00000000..d438c259 --- /dev/null +++ b/sw-ui/src/main/kotlin/org/luxons/sevenwonders/ui/utils/StyleUtils.kt @@ -0,0 +1,10 @@ +package org.luxons.sevenwonders.ui.utils + +import csstype.ClassName +import kotlinx.css.* +import styled.* +import kotlin.reflect.* + +fun <T : StyleSheet> T.getTypedClassName(getClass: (T) -> KProperty0<RuleSet>): ClassName { + return ClassName(getClassName(getClass)) +} diff --git a/sw-ui/src/main/resources/index.html b/sw-ui/src/main/resources/index.html index 304be751..b43c1428 100644 --- a/sw-ui/src/main/resources/index.html +++ b/sw-ui/src/main/resources/index.html @@ -9,8 +9,8 @@ <!-- Style dependencies --> <link href="https://unpkg.com/normalize.css@^7.0.0" rel="stylesheet"/> <!-- Blueprint stylesheets --> - <link href="https://unpkg.com/@blueprintjs/icons@^3.4.0/lib/css/blueprint-icons.css" rel="stylesheet"/> - <link href="https://unpkg.com/@blueprintjs/core@^3.10.0/lib/css/blueprint.css" rel="stylesheet"/> + <link href="https://unpkg.com/@blueprintjs/icons@^4.13.0/lib/css/blueprint-icons.css" rel="stylesheet"/> + <link href="https://unpkg.com/@blueprintjs/core@^4.15.0/lib/css/blueprint.css" rel="stylesheet"/> </head> <body> <div id="root"></div> |