From 35c458679247c4e166816d13deafb293166f61ac Mon Sep 17 00:00:00 2001 From: Phillip Tarrant Date: Sat, 11 Jul 2026 09:00:54 -0500 Subject: [PATCH] fix(shell): dark DockButton theme variation for the system dock DarkPanel is a PanelContainer-base variation (only a `panel` stylebox); a Button looks up normal/hover/pressed, which don't exist on it, so SystemDock's menu buttons rendered as default gray Godot buttons instead of mock-faithful dark nav buttons. Add a dedicated Button-base DockButton variation (Palette-only colours, dock-dark normal/hover/pressed styleboxes), point system_dock.gd's menu buttons at it, and regenerate the committed game_theme.tres artifact from the builder. Co-Authored-By: Claude Opus 4.8 (1M context) --- client/assets/theme/game_theme.tres | 120 +++++++++++++++++------ client/scripts/theme/build_game_theme.gd | 14 +++ client/scripts/theme/theme_keys.gd | 2 + client/scripts/ui/shell/system_dock.gd | 2 +- 4 files changed, 105 insertions(+), 33 deletions(-) diff --git a/client/assets/theme/game_theme.tres b/client/assets/theme/game_theme.tres index 8eef967..f311cff 100644 --- a/client/assets/theme/game_theme.tres +++ b/client/assets/theme/game_theme.tres @@ -70,7 +70,57 @@ corner_radius_top_right = 4 corner_radius_bottom_right = 4 corner_radius_bottom_left = 4 -[sub_resource type="StyleBoxFlat" id="StyleBoxFlat_73lme"] +[sub_resource type="StyleBoxEmpty" id="StyleBoxEmpty_73lme"] + +[sub_resource type="StyleBoxFlat" id="StyleBoxFlat_js3tr"] +content_margin_left = 12.0 +content_margin_top = 6.0 +content_margin_right = 12.0 +content_margin_bottom = 6.0 +bg_color = Color(0.05490196, 0.043137256, 0.03529412, 0.85) +border_width_left = 1 +border_width_top = 1 +border_width_right = 1 +border_width_bottom = 1 +border_color = Color(0.6627451, 0.5176471, 0.24705882, 1) +corner_radius_top_left = 8 +corner_radius_top_right = 8 +corner_radius_bottom_right = 8 +corner_radius_bottom_left = 8 + +[sub_resource type="StyleBoxFlat" id="StyleBoxFlat_ube3r"] +content_margin_left = 12.0 +content_margin_top = 6.0 +content_margin_right = 12.0 +content_margin_bottom = 6.0 +bg_color = Color(0.07058824, 0.05882353, 0.043137256, 0.7) +border_width_left = 1 +border_width_top = 1 +border_width_right = 1 +border_width_bottom = 1 +border_color = Color(0.41960785, 0.38039216, 0.32156864, 1) +corner_radius_top_left = 8 +corner_radius_top_right = 8 +corner_radius_bottom_right = 8 +corner_radius_bottom_left = 8 + +[sub_resource type="StyleBoxFlat" id="StyleBoxFlat_2tooq"] +content_margin_left = 12.0 +content_margin_top = 6.0 +content_margin_right = 12.0 +content_margin_bottom = 6.0 +bg_color = Color(0.039215688, 0.03137255, 0.023529412, 0.9) +border_width_left = 1 +border_width_top = 1 +border_width_right = 1 +border_width_bottom = 1 +border_color = Color(0.6627451, 0.5176471, 0.24705882, 1) +corner_radius_top_left = 8 +corner_radius_top_right = 8 +corner_radius_bottom_right = 8 +corner_radius_bottom_left = 8 + +[sub_resource type="StyleBoxFlat" id="StyleBoxFlat_4kten"] content_margin_left = 12.0 content_margin_top = 6.0 content_margin_right = 12.0 @@ -86,7 +136,7 @@ corner_radius_top_right = 6 corner_radius_bottom_right = 6 corner_radius_bottom_left = 6 -[sub_resource type="StyleBoxFlat" id="StyleBoxFlat_js3tr"] +[sub_resource type="StyleBoxFlat" id="StyleBoxFlat_p6wtm"] content_margin_left = 12.0 content_margin_top = 6.0 content_margin_right = 12.0 @@ -103,7 +153,7 @@ corner_radius_top_right = 6 corner_radius_bottom_right = 6 corner_radius_bottom_left = 6 -[sub_resource type="StyleBoxFlat" id="StyleBoxFlat_ube3r"] +[sub_resource type="StyleBoxFlat" id="StyleBoxFlat_0fjdt"] content_margin_left = 12.0 content_margin_top = 6.0 content_margin_right = 12.0 @@ -119,7 +169,7 @@ corner_radius_top_right = 6 corner_radius_bottom_right = 6 corner_radius_bottom_left = 6 -[sub_resource type="StyleBoxFlat" id="StyleBoxFlat_2tooq"] +[sub_resource type="StyleBoxFlat" id="StyleBoxFlat_ns3kg"] content_margin_left = 12.0 content_margin_top = 6.0 content_margin_right = 12.0 @@ -135,7 +185,7 @@ corner_radius_top_right = 4 corner_radius_bottom_right = 4 corner_radius_bottom_left = 4 -[sub_resource type="StyleBoxFlat" id="StyleBoxFlat_4kten"] +[sub_resource type="StyleBoxFlat" id="StyleBoxFlat_jly1r"] content_margin_left = 12.0 content_margin_top = 6.0 content_margin_right = 12.0 @@ -151,7 +201,7 @@ corner_radius_top_right = 4 corner_radius_bottom_right = 4 corner_radius_bottom_left = 4 -[sub_resource type="StyleBoxFlat" id="StyleBoxFlat_p6wtm"] +[sub_resource type="StyleBoxFlat" id="StyleBoxFlat_lw8lk"] content_margin_left = 12.0 content_margin_top = 6.0 content_margin_right = 12.0 @@ -167,7 +217,7 @@ corner_radius_top_right = 4 corner_radius_bottom_right = 4 corner_radius_bottom_left = 4 -[sub_resource type="StyleBoxFlat" id="StyleBoxFlat_0fjdt"] +[sub_resource type="StyleBoxFlat" id="StyleBoxFlat_nh0e7"] content_margin_left = 12.0 content_margin_top = 6.0 content_margin_right = 12.0 @@ -183,7 +233,7 @@ corner_radius_top_right = 4 corner_radius_bottom_right = 4 corner_radius_bottom_left = 4 -[sub_resource type="StyleBoxFlat" id="StyleBoxFlat_ns3kg"] +[sub_resource type="StyleBoxFlat" id="StyleBoxFlat_dtr07"] content_margin_left = 12.0 content_margin_top = 6.0 content_margin_right = 12.0 @@ -199,9 +249,9 @@ corner_radius_top_right = 4 corner_radius_bottom_right = 4 corner_radius_bottom_left = 4 -[sub_resource type="StyleBoxEmpty" id="StyleBoxEmpty_jly1r"] +[sub_resource type="StyleBoxEmpty" id="StyleBoxEmpty_nmowx"] -[sub_resource type="StyleBoxFlat" id="StyleBoxFlat_lw8lk"] +[sub_resource type="StyleBoxFlat" id="StyleBoxFlat_oi067"] content_margin_left = 12.0 content_margin_top = 6.0 content_margin_right = 12.0 @@ -217,7 +267,7 @@ corner_radius_top_right = 14 corner_radius_bottom_right = 14 corner_radius_bottom_left = 14 -[sub_resource type="StyleBoxFlat" id="StyleBoxFlat_nh0e7"] +[sub_resource type="StyleBoxFlat" id="StyleBoxFlat_ukblj"] content_margin_left = 12.0 content_margin_top = 6.0 content_margin_right = 12.0 @@ -233,7 +283,7 @@ corner_radius_top_right = 14 corner_radius_bottom_right = 14 corner_radius_bottom_left = 14 -[sub_resource type="StyleBoxFlat" id="StyleBoxFlat_dtr07"] +[sub_resource type="StyleBoxFlat" id="StyleBoxFlat_utt73"] content_margin_left = 12.0 content_margin_top = 6.0 content_margin_right = 12.0 @@ -249,9 +299,9 @@ corner_radius_top_right = 14 corner_radius_bottom_right = 14 corner_radius_bottom_left = 14 -[sub_resource type="StyleBoxEmpty" id="StyleBoxEmpty_nmowx"] +[sub_resource type="StyleBoxEmpty" id="StyleBoxEmpty_5u8fh"] -[sub_resource type="StyleBoxFlat" id="StyleBoxFlat_oi067"] +[sub_resource type="StyleBoxFlat" id="StyleBoxFlat_p0qbh"] content_margin_left = 12.0 content_margin_top = 6.0 content_margin_right = 12.0 @@ -267,7 +317,7 @@ corner_radius_top_right = 14 corner_radius_bottom_right = 14 corner_radius_bottom_left = 14 -[sub_resource type="StyleBoxFlat" id="StyleBoxFlat_ukblj"] +[sub_resource type="StyleBoxFlat" id="StyleBoxFlat_6y6ak"] content_margin_left = 12.0 content_margin_top = 6.0 content_margin_right = 12.0 @@ -283,7 +333,7 @@ corner_radius_top_right = 14 corner_radius_bottom_right = 14 corner_radius_bottom_left = 14 -[sub_resource type="StyleBoxFlat" id="StyleBoxFlat_utt73"] +[sub_resource type="StyleBoxFlat" id="StyleBoxFlat_txxuc"] content_margin_left = 12.0 content_margin_top = 6.0 content_margin_right = 12.0 @@ -316,38 +366,44 @@ Chip/styles/normal = SubResource("StyleBoxFlat_cqbvn") Chip/styles/pressed = SubResource("StyleBoxFlat_q5gpk") DarkPanel/base_type = &"PanelContainer" DarkPanel/styles/panel = SubResource("StyleBoxFlat_bbpmc") +DockButton/base_type = &"Button" +DockButton/colors/font_color = Color(0.7882353, 0.7411765, 0.6392157, 1) +DockButton/styles/focus = SubResource("StyleBoxEmpty_73lme") +DockButton/styles/hover = SubResource("StyleBoxFlat_js3tr") +DockButton/styles/normal = SubResource("StyleBoxFlat_ube3r") +DockButton/styles/pressed = SubResource("StyleBoxFlat_2tooq") Heading/base_type = &"Label" Heading/colors/font_color = Color(0.22745098, 0.18431373, 0.10980392, 1) Heading/font_sizes/font_size = 34 Heading/fonts/font = ExtResource("3_4lwr2") ItemTile/base_type = &"PanelContainer" -ItemTile/styles/panel = SubResource("StyleBoxFlat_73lme") +ItemTile/styles/panel = SubResource("StyleBoxFlat_4kten") ItemTileEmpty/base_type = &"PanelContainer" -ItemTileEmpty/styles/panel = SubResource("StyleBoxFlat_js3tr") +ItemTileEmpty/styles/panel = SubResource("StyleBoxFlat_p6wtm") Mono/base_type = &"Label" Mono/colors/font_color = Color(0.6039216, 0.56078434, 0.47058824, 1) Mono/font_sizes/font_size = 13 Mono/fonts/font = ExtResource("2_605w4") ParchmentCard/base_type = &"PanelContainer" -ParchmentCard/styles/panel = SubResource("StyleBoxFlat_ube3r") +ParchmentCard/styles/panel = SubResource("StyleBoxFlat_0fjdt") ParchmentInset/base_type = &"PanelContainer" -ParchmentInset/styles/panel = SubResource("StyleBoxFlat_2tooq") +ParchmentInset/styles/panel = SubResource("StyleBoxFlat_ns3kg") PrimaryCTA/base_type = &"Button" PrimaryCTA/colors/font_color = Color(0.9411765, 0.9019608, 0.8156863, 1) PrimaryCTA/colors/font_disabled_color = Color(0.6039216, 0.56078434, 0.47058824, 1) -PrimaryCTA/styles/disabled = SubResource("StyleBoxFlat_4kten") -PrimaryCTA/styles/hover = SubResource("StyleBoxFlat_p6wtm") -PrimaryCTA/styles/normal = SubResource("StyleBoxFlat_0fjdt") -PrimaryCTA/styles/pressed = SubResource("StyleBoxFlat_ns3kg") +PrimaryCTA/styles/disabled = SubResource("StyleBoxFlat_jly1r") +PrimaryCTA/styles/hover = SubResource("StyleBoxFlat_lw8lk") +PrimaryCTA/styles/normal = SubResource("StyleBoxFlat_nh0e7") +PrimaryCTA/styles/pressed = SubResource("StyleBoxFlat_dtr07") Tab/base_type = &"Button" Tab/colors/font_color = Color(0.41568628, 0.3529412, 0.22745098, 1) -Tab/styles/focus = SubResource("StyleBoxEmpty_jly1r") -Tab/styles/hover = SubResource("StyleBoxFlat_lw8lk") -Tab/styles/normal = SubResource("StyleBoxFlat_nh0e7") -Tab/styles/pressed = SubResource("StyleBoxFlat_dtr07") +Tab/styles/focus = SubResource("StyleBoxEmpty_nmowx") +Tab/styles/hover = SubResource("StyleBoxFlat_oi067") +Tab/styles/normal = SubResource("StyleBoxFlat_ukblj") +Tab/styles/pressed = SubResource("StyleBoxFlat_utt73") TabActive/base_type = &"Button" TabActive/colors/font_color = Color(0.9411765, 0.9019608, 0.8156863, 1) -TabActive/styles/focus = SubResource("StyleBoxEmpty_nmowx") -TabActive/styles/hover = SubResource("StyleBoxFlat_oi067") -TabActive/styles/normal = SubResource("StyleBoxFlat_ukblj") -TabActive/styles/pressed = SubResource("StyleBoxFlat_utt73") +TabActive/styles/focus = SubResource("StyleBoxEmpty_5u8fh") +TabActive/styles/hover = SubResource("StyleBoxFlat_p0qbh") +TabActive/styles/normal = SubResource("StyleBoxFlat_6y6ak") +TabActive/styles/pressed = SubResource("StyleBoxFlat_txxuc") diff --git a/client/scripts/theme/build_game_theme.gd b/client/scripts/theme/build_game_theme.gd index 96b08f6..df3b006 100644 --- a/client/scripts/theme/build_game_theme.gd +++ b/client/scripts/theme/build_game_theme.gd @@ -35,6 +35,7 @@ static func build_theme() -> Theme: _fonts(theme) _primary_cta(theme) _tabs(theme) + _dock_button(theme) _chip(theme) _tiles(theme) _cards_and_panels(theme) @@ -106,6 +107,19 @@ static func _tabs(theme: Theme) -> void: theme.set_color(&"font_color", tab_active, Palette.CREAM_BRIGHT) +static func _dock_button(theme: Theme) -> void: + # Dark nav button for the slide-in system dock (mock 2a). Button-base so + # normal/hover/pressed styleboxes actually apply (a PanelContainer variation's + # lone `panel` stylebox does not skin a Button). Colours are dock-dark. + var k := ThemeKeys.DOCK_BUTTON + theme.set_type_variation(k, "Button") + theme.set_stylebox(&"normal", k, _flat(Palette.DARK_PANEL_70, Palette.BORDER_1, 1, 8)) + theme.set_stylebox(&"hover", k, _flat(Palette.DARK_PANEL_85, Palette.GOLD, 1, 8)) + theme.set_stylebox(&"pressed", k, _flat(Palette.DARK_PANEL_90, Palette.GOLD, 1, 8)) + theme.set_stylebox(&"focus", k, StyleBoxEmpty.new()) + theme.set_color(&"font_color", k, Palette.CREAM_SECONDARY) + + static func _chip(theme: Theme) -> void: # Base chip; the semantic colour (red/gold/grey) is applied per-use by script. var k := ThemeKeys.CHIP diff --git a/client/scripts/theme/theme_keys.gd b/client/scripts/theme/theme_keys.gd index 0a11113..8acf858 100644 --- a/client/scripts/theme/theme_keys.gd +++ b/client/scripts/theme/theme_keys.gd @@ -9,6 +9,7 @@ const PRIMARY_CTA := &"PrimaryCTA" const TAB := &"Tab" const TAB_ACTIVE := &"TabActive" const CHIP := &"Chip" +const DOCK_BUTTON := &"DockButton" const ITEM_TILE := &"ItemTile" const ITEM_TILE_EMPTY := &"ItemTileEmpty" const PARCHMENT_CARD := &"ParchmentCard" @@ -28,6 +29,7 @@ const ALL := { TAB: "Button", TAB_ACTIVE: "Button", CHIP: "Button", + DOCK_BUTTON: "Button", ITEM_TILE: "PanelContainer", ITEM_TILE_EMPTY: "PanelContainer", PARCHMENT_CARD: "PanelContainer", diff --git a/client/scripts/ui/shell/system_dock.gd b/client/scripts/ui/shell/system_dock.gd index 16df17a..282bd88 100644 --- a/client/scripts/ui/shell/system_dock.gd +++ b/client/scripts/ui/shell/system_dock.gd @@ -32,7 +32,7 @@ func _ready() -> void: var id: StringName = entry[0] var button := Button.new() button.text = "%s %s" % [entry[2], entry[1]] - button.theme_type_variation = ThemeKeys.DARK_PANEL + button.theme_type_variation = ThemeKeys.DOCK_BUTTON button.pressed.connect(func(): screen_requested.emit(id)) _menu.add_child(button) _screen_buttons[id] = button