Re-design map selection menu

2 files changed, 48 insertions, 59 deletions

diff --git a/client/menu/lobby.gd b/client/menu/lobby.gd
index 1d4674cd..67b5ff8e 100644
--- a/client/menu/lobby.gd
+++ b/client/menu/lobby.gd
@@ -25,17 +25,17 @@ var selected_map_name: String
 var difficulty_names = [tr("Easy"), tr("Moderate"), tr("Hard"), tr("Very hard"), tr("Unplayable")]
 
 @onready var game: Game = $"../Game"
-@onready var player_container = $VBoxContainer/Top/MarginContainer/VBoxContainer/Players
+@onready var player_container = $HBoxContainer/Bottom/MarginContainer/VBoxContainer/Players
 
-@onready var map_name_label = $VBoxContainer/Bottom/MarginContainer/VBoxContainer/HBoxContainer/Map/Name
-@onready var map_player_label = $VBoxContainer/Bottom/MarginContainer/VBoxContainer/HBoxContainer/Map/Players
-@onready var map_difficulty_label = $VBoxContainer/Bottom/MarginContainer/VBoxContainer/HBoxContainer/Map/Difficulty
+@onready var map_name_label = $HBoxContainer/Bottom/MarginContainer/VBoxContainer/HBoxContainer/Map/Name
+@onready var map_player_label = $HBoxContainer/Bottom/MarginContainer/VBoxContainer/HBoxContainer/Map/Players
+@onready var map_difficulty_label = $HBoxContainer/Bottom/MarginContainer/VBoxContainer/HBoxContainer/Map/Difficulty
 
-@onready var map_selector = $VBoxContainer/Bottom/MarginContainer/VBoxContainer/HBoxContainer
-@onready var prev_map = $VBoxContainer/Bottom/MarginContainer/VBoxContainer/HBoxContainer/VBoxContainer/Left
-@onready var next_map = $VBoxContainer/Bottom/MarginContainer/VBoxContainer/HBoxContainer/VBoxContainer2/Right
-@onready var start_button = $VBoxContainer/Bottom/MarginContainer/VBoxContainer/CenterContainer/Start
-@onready var join_spectate = $VBoxContainer/Bottom/MarginContainer/VBoxContainer/CenterContainer/JoinSpectate
+@onready var map_selector = $HBoxContainer/Bottom/MarginContainer/VBoxContainer/HBoxContainer
+@onready var prev_map = $HBoxContainer/Bottom/MarginContainer/VBoxContainer/HBoxContainer/VBoxContainer/Left
+@onready var next_map = $HBoxContainer/Bottom/MarginContainer/VBoxContainer/HBoxContainer/VBoxContainer2/Right
+@onready var join_spectate = $HBoxContainer/Bottom/MarginContainer/VBoxContainer/VBoxContainer/JoinSpectate
+@onready var start_button = $HBoxContainer/Bottom/MarginContainer/VBoxContainer/VBoxContainer/Start
 
 func _ready():
 	game.update_players.connect(update_players)
diff --git a/client/menu/lobby.tscn b/client/menu/lobby.tscn
index d13498d6..ea415417 100644
--- a/client/menu/lobby.tscn
+++ b/client/menu/lobby.tscn
@@ -1,8 +1,9 @@
-[gd_scene load_steps=13 format=3 uid="uid://bc50la65ntifb"]
+[gd_scene load_steps=14 format=3 uid="uid://bc50la65ntifb"]
 
 [ext_resource type="Theme" uid="uid://b0qmvo504e457" path="res://menu/theme/theme.tres" id="1_u18ke"]
 [ext_resource type="Script" path="res://menu/lobby.gd" id="2_7657i"]
 [ext_resource type="StyleBox" uid="uid://de80aw86emnql" path="res://menu/theme/lobby_panel_override.tres" id="3_6iqoe"]
+[ext_resource type="Material" uid="uid://beea1pc5nt67r" path="res://menu/theme/dark_blur_material.tres" id="3_esmbx"]
 [ext_resource type="Texture2D" uid="uid://35rd5gamtyqm" path="res://menu/arrow.svg" id="3_jxleg"]
 [ext_resource type="Texture2D" uid="uid://j75dbytlbju" path="res://menu/arrow_pressed.svg" id="4_eapmn"]
 [ext_resource type="Texture2D" uid="uid://b33qmctbpf48g" path="res://menu/arrow_hover.svg" id="5_odwav"]
@@ -26,54 +27,36 @@ grow_vertical = 2
 theme = ExtResource("1_u18ke")
 script = ExtResource("2_7657i")
 
-[node name="VBoxContainer" type="VBoxContainer" parent="."]
+[node name="HBoxContainer" type="HBoxContainer" parent="."]
 layout_mode = 1
 anchors_preset = 15
 anchor_right = 1.0
 anchor_bottom = 1.0
 grow_horizontal = 2
 grow_vertical = 2
+alignment = 2
 
-[node name="Top" type="PanelContainer" parent="VBoxContainer"]
+[node name="Bottom" type="PanelContainer" parent="HBoxContainer"]
+material = ExtResource("3_esmbx")
 layout_mode = 2
 theme_override_styles/panel = ExtResource("3_6iqoe")
 
-[node name="MarginContainer" type="MarginContainer" parent="VBoxContainer/Top"]
+[node name="MarginContainer" type="MarginContainer" parent="HBoxContainer/Bottom"]
 layout_mode = 2
 
-[node name="VBoxContainer" type="VBoxContainer" parent="VBoxContainer/Top/MarginContainer"]
+[node name="VBoxContainer" type="VBoxContainer" parent="HBoxContainer/Bottom/MarginContainer"]
 layout_mode = 2
 theme_override_constants/separation = 24
 
-[node name="Players" type="HBoxContainer" parent="VBoxContainer/Top/MarginContainer/VBoxContainer"]
+[node name="HBoxContainer" type="HBoxContainer" parent="HBoxContainer/Bottom/MarginContainer/VBoxContainer"]
 layout_mode = 2
 alignment = 1
 
-[node name="Spacer" type="Control" parent="VBoxContainer"]
-layout_mode = 2
-size_flags_vertical = 3
-mouse_filter = 2
-
-[node name="Bottom" type="PanelContainer" parent="VBoxContainer"]
-layout_mode = 2
-theme_override_styles/panel = ExtResource("3_6iqoe")
-
-[node name="MarginContainer" type="MarginContainer" parent="VBoxContainer/Bottom"]
-layout_mode = 2
-
-[node name="VBoxContainer" type="VBoxContainer" parent="VBoxContainer/Bottom/MarginContainer"]
-layout_mode = 2
-theme_override_constants/separation = 24
-
-[node name="HBoxContainer" type="HBoxContainer" parent="VBoxContainer/Bottom/MarginContainer/VBoxContainer"]
+[node name="VBoxContainer" type="VBoxContainer" parent="HBoxContainer/Bottom/MarginContainer/VBoxContainer/HBoxContainer"]
 layout_mode = 2
 alignment = 1
 
-[node name="VBoxContainer" type="VBoxContainer" parent="VBoxContainer/Bottom/MarginContainer/VBoxContainer/HBoxContainer"]
-layout_mode = 2
-alignment = 1
-
-[node name="Left" type="TextureButton" parent="VBoxContainer/Bottom/MarginContainer/VBoxContainer/HBoxContainer/VBoxContainer"]
+[node name="Left" type="TextureButton" parent="HBoxContainer/Bottom/MarginContainer/VBoxContainer/HBoxContainer/VBoxContainer"]
 custom_minimum_size = Vector2(19, 28)
 layout_mode = 2
 focus_mode = 0
@@ -85,11 +68,11 @@ ignore_texture_size = true
 stretch_mode = 4
 flip_h = true
 
-[node name="Map" type="VBoxContainer" parent="VBoxContainer/Bottom/MarginContainer/VBoxContainer/HBoxContainer"]
+[node name="Map" type="VBoxContainer" parent="HBoxContainer/Bottom/MarginContainer/VBoxContainer/HBoxContainer"]
 layout_mode = 2
 
-[node name="Name" type="Label" parent="VBoxContainer/Bottom/MarginContainer/VBoxContainer/HBoxContainer/Map"]
-custom_minimum_size = Vector2(264, 0)
+[node name="Name" type="Label" parent="HBoxContainer/Bottom/MarginContainer/VBoxContainer/HBoxContainer/Map"]
+custom_minimum_size = Vector2(200, 0)
 layout_mode = 2
 theme_override_fonts/font = SubResource("FontVariation_5xxr2")
 theme_override_font_sizes/font_size = 24
@@ -97,25 +80,23 @@ text = "Map name"
 horizontal_alignment = 1
 vertical_alignment = 1
 
-[node name="Players" type="Label" parent="VBoxContainer/Bottom/MarginContainer/VBoxContainer/HBoxContainer/Map"]
-custom_minimum_size = Vector2(264, 0)
+[node name="Players" type="Label" parent="HBoxContainer/Bottom/MarginContainer/VBoxContainer/HBoxContainer/Map"]
 layout_mode = 2
 text = "Players"
 horizontal_alignment = 1
 vertical_alignment = 1
 
-[node name="Difficulty" type="Label" parent="VBoxContainer/Bottom/MarginContainer/VBoxContainer/HBoxContainer/Map"]
-custom_minimum_size = Vector2(264, 0)
+[node name="Difficulty" type="Label" parent="HBoxContainer/Bottom/MarginContainer/VBoxContainer/HBoxContainer/Map"]
 layout_mode = 2
 text = "Difficulty"
 horizontal_alignment = 1
 vertical_alignment = 1
 
-[node name="VBoxContainer2" type="VBoxContainer" parent="VBoxContainer/Bottom/MarginContainer/VBoxContainer/HBoxContainer"]
+[node name="VBoxContainer2" type="VBoxContainer" parent="HBoxContainer/Bottom/MarginContainer/VBoxContainer/HBoxContainer"]
 layout_mode = 2
 alignment = 1
 
-[node name="Right" type="TextureButton" parent="VBoxContainer/Bottom/MarginContainer/VBoxContainer/HBoxContainer/VBoxContainer2"]
+[node name="Right" type="TextureButton" parent="HBoxContainer/Bottom/MarginContainer/VBoxContainer/HBoxContainer/VBoxContainer2"]
 custom_minimum_size = Vector2(19, 28)
 layout_mode = 2
 focus_mode = 0
@@ -126,20 +107,20 @@ texture_focused = ExtResource("6_tulu3")
 ignore_texture_size = true
 stretch_mode = 4
 
-[node name="CenterContainer" type="HBoxContainer" parent="VBoxContainer/Bottom/MarginContainer/VBoxContainer"]
+[node name="Players" type="HBoxContainer" parent="HBoxContainer/Bottom/MarginContainer/VBoxContainer"]
 layout_mode = 2
-theme_override_constants/separation = 50
 alignment = 1
 
-[node name="Start" parent="VBoxContainer/Bottom/MarginContainer/VBoxContainer/CenterContainer" instance=ExtResource("7_t6mox")]
-custom_minimum_size = Vector2(148, 0)
+[node name="Spacer" type="Control" parent="HBoxContainer/Bottom/MarginContainer/VBoxContainer"]
 layout_mode = 2
-text = "Start game"
-expand_icon = true
-controller_texture = ExtResource("9_q14bw")
-press_action = "start_game"
+size_flags_vertical = 3
+
+[node name="VBoxContainer" type="VBoxContainer" parent="HBoxContainer/Bottom/MarginContainer/VBoxContainer"]
+layout_mode = 2
+theme_override_constants/separation = 15
+alignment = 1
 
-[node name="JoinSpectate" parent="VBoxContainer/Bottom/MarginContainer/VBoxContainer/CenterContainer" instance=ExtResource("7_t6mox")]
+[node name="JoinSpectate" parent="HBoxContainer/Bottom/MarginContainer/VBoxContainer/VBoxContainer" instance=ExtResource("7_t6mox")]
 custom_minimum_size = Vector2(148, 0)
 layout_mode = 2
 text = "Spectate"
@@ -147,8 +128,16 @@ expand_icon = true
 controller_texture = ExtResource("11_5uugf")
 press_action = "join_spectate"
 
+[node name="Start" parent="HBoxContainer/Bottom/MarginContainer/VBoxContainer/VBoxContainer" instance=ExtResource("7_t6mox")]
+custom_minimum_size = Vector2(148, 0)
+layout_mode = 2
+text = "Start game"
+expand_icon = true
+controller_texture = ExtResource("9_q14bw")
+press_action = "start_game"
+
 [connection signal="visibility_changed" from="." to="." method="check_for_music"]
-[connection signal="pressed" from="VBoxContainer/Bottom/MarginContainer/VBoxContainer/HBoxContainer/VBoxContainer/Left" to="." method="_on_left_pressed"]
-[connection signal="pressed" from="VBoxContainer/Bottom/MarginContainer/VBoxContainer/HBoxContainer/VBoxContainer2/Right" to="." method="_on_right_pressed"]
-[connection signal="pressed" from="VBoxContainer/Bottom/MarginContainer/VBoxContainer/CenterContainer/Start" to="." method="_on_controller_button_pressed"]
-[connection signal="pressed" from="VBoxContainer/Bottom/MarginContainer/VBoxContainer/CenterContainer/JoinSpectate" to="." method="_on_join_spectate_pressed"]
+[connection signal="pressed" from="HBoxContainer/Bottom/MarginContainer/VBoxContainer/HBoxContainer/VBoxContainer/Left" to="." method="_on_left_pressed"]
+[connection signal="pressed" from="HBoxContainer/Bottom/MarginContainer/VBoxContainer/HBoxContainer/VBoxContainer2/Right" to="." method="_on_right_pressed"]
+[connection signal="pressed" from="HBoxContainer/Bottom/MarginContainer/VBoxContainer/VBoxContainer/JoinSpectate" to="." method="_on_join_spectate_pressed"]
+[connection signal="pressed" from="HBoxContainer/Bottom/MarginContainer/VBoxContainer/VBoxContainer/Start" to="." method="_on_controller_button_pressed"]