Improve SettingsMenu for mobile (#14)

- Adjusted settings menu layout to better support mobile screens.
- Fixed horizontal overflow issues.
- Removed the **Shortcuts** tab as it is not essential for mobile users.
  - It could be useful for those using a keyboard, so I'll reconsider its inclusion.
- Removed UI scaling options (temporarily)

src/autoload/HandlerGUI.gd

@@ -68,7 +68,7 @@ func _add_control(new_control: Control) -> void:
 	menu_stack.append(overlay_ref)
 	get_tree().root.add_child(overlay_ref)
 	overlay_ref.add_child(new_control)
-	new_control.set_anchors_and_offsets_preset(Control.PRESET_CENTER)
+	new_control.set_anchors_and_offsets_preset(Control.PRESET_FULL_RECT)
 	new_control.tree_exiting.connect(_remove_control.bind(overlay_ref))
 
 func _remove_control(overlay_ref: ColorRect = null) -> void:

src/ui_parts/settings_menu.gd

@@ -2,7 +2,7 @@ extends PanelContainer
 
 const PaletteConfigWidget = preload("res://src/ui_widgets/palette_config.tscn")
 const ShortcutConfigWidget = preload("res://src/ui_widgets/setting_shortcut.tscn")
-const ShortcutShowcaseWidget = preload("res://src/ui_widgets/presented_shortcut.tscn")
+#const ShortcutShowcaseWidget = preload("res://src/ui_widgets/presented_shortcut.tscn")
 const SettingFrame = preload("res://src/ui_widgets/setting_frame.tscn")
 const ProfileFrame = preload("res://src/ui_widgets/profile_frame.tscn")
 
@@ -46,7 +46,8 @@ func setup_tabs() -> void:
 	var button_group := ButtonGroup.new()
 	add_tab("formatting", Translator.translate("Formatting"), button_group)
 	add_tab("palettes", Translator.translate("Palettes"), button_group)
-	add_tab("shortcuts", Translator.translate("Shortcuts"), button_group)
+	# Removing shortcuts tab as this is not really needed for mobile port.
+	#add_tab("shortcuts", Translator.translate("Shortcuts"), button_group)
 	add_tab("theming", Translator.translate("Theming"), button_group)
 	add_tab("other", Translator.translate("Other"), button_group)
 
@@ -113,32 +114,32 @@ func setup_content() -> void:
 			vbox.size_flags_horizontal = Control.SIZE_EXPAND_FILL
 			content_container.add_child(vbox)
 			rebuild_palettes()
-		"shortcuts":
-			advice_panel.hide()
-			var vbox := VBoxContainer.new()
-			vbox.size_flags_horizontal = Control.SIZE_EXPAND_FILL
-			vbox.add_theme_constant_override("separation", 6)
-			content_container.add_child(vbox)
-			var categories := HFlowContainer.new()
-			var button_group := ButtonGroup.new()
-			for tab_idx in shortcut_tab_names:
-				var btn := Button.new()
-				btn.toggle_mode = true
-				btn.button_group = button_group
-				btn.pressed.connect(show_shortcuts.bind(tab_idx))
-				btn.text = get_translated_shortcut_tab(tab_idx)
-				btn.mouse_default_cursor_shape = Control.CURSOR_POINTING_HAND
-				btn.focus_mode = Control.FOCUS_NONE
-				btn.action_mode = BaseButton.ACTION_MODE_BUTTON_PRESS
-				categories.add_child(btn)
-			vbox.add_child(categories)
-			var shortcuts := VBoxContainer.new()
-			shortcuts.add_theme_constant_override("separation", 3)
-			shortcuts.size_flags_horizontal = Control.SIZE_EXPAND_FILL
-			shortcuts.size_flags_vertical = Control.SIZE_EXPAND_FILL
-			vbox.add_child(shortcuts)
-			categories.get_child(0).button_pressed = true
-			categories.get_child(0).pressed.emit()
+		#"shortcuts":
+			#advice_panel.hide()
+			#var vbox := VBoxContainer.new()
+			#vbox.size_flags_horizontal = Control.SIZE_EXPAND_FILL
+			#vbox.add_theme_constant_override("separation", 6)
+			#content_container.add_child(vbox)
+			#var categories := HFlowContainer.new()
+			#var button_group := ButtonGroup.new()
+			#for tab_idx in shortcut_tab_names:
+				#var btn := Button.new()
+				#btn.toggle_mode = true
+				#btn.button_group = button_group
+				#btn.pressed.connect(show_shortcuts.bind(tab_idx))
+				#btn.text = get_translated_shortcut_tab(tab_idx)
+				#btn.mouse_default_cursor_shape = Control.CURSOR_POINTING_HAND
+				#btn.focus_mode = Control.FOCUS_NONE
+				#btn.action_mode = BaseButton.ACTION_MODE_BUTTON_PRESS
+				#categories.add_child(btn)
+			#vbox.add_child(categories)
+			#var shortcuts := VBoxContainer.new()
+			#shortcuts.add_theme_constant_override("separation", 3)
+			#shortcuts.size_flags_horizontal = Control.SIZE_EXPAND_FILL
+			#shortcuts.size_flags_vertical = Control.SIZE_EXPAND_FILL
+			#vbox.add_child(shortcuts)
+			#categories.get_child(0).button_pressed = true
+			#categories.get_child(0).pressed.emit()
 		"theming":
 			advice_panel.hide()
 			create_setting_container()
@@ -220,16 +221,18 @@ func setup_content() -> void:
 					SaveData.HANDLE_SIZE_MIN, SaveData.HANDLE_SIZE_MAX)
 			add_advice(Translator.translate(
 					"Changes the visual size and grabbing area of handles."))
-			current_setup_setting = "ui_scale"
-			add_number_dropdown(Translator.translate("UI scale"),
-					[0.75, 1.0, 1.25, 1.5, 1.75, 2.0, 2.5, 3.0, 4.0], false, false,
-					SaveData.UI_SCALE_MIN, SaveData.UI_SCALE_MAX)
-			add_advice(Translator.translate(
-					"Changes the scale of the visual user interface."))
-			current_setup_setting = "auto_ui_scale"
-			add_checkbox(Translator.translate("Auto UI scale"))
-			add_advice(Translator.translate(
-					"Scales the user interface based on the screen size."))
+
+			# Temporarily hiding settings to change scale.
+			#current_setup_setting = "ui_scale"
+			#add_number_dropdown(Translator.translate("UI scale"),
+					#[0.75, 1.0, 1.25, 1.5, 1.75, 2.0, 2.5, 3.0, 4.0], false, false,
+					#SaveData.UI_SCALE_MIN, SaveData.UI_SCALE_MAX)
+			#add_advice(Translator.translate(
+					#"Changes the scale of the visual user interface."))
+			#current_setup_setting = "auto_ui_scale"
+			#add_checkbox(Translator.translate("Auto UI scale"))
+			#add_advice(Translator.translate(
+					#"Scales the user interface based on the screen size."))
 
 			# Disable mouse wrap if not available.
 			if not DisplayServer.has_feature(DisplayServer.FEATURE_MOUSE_WARP):
@@ -573,19 +576,19 @@ func show_formatter(category: String) -> void:
 	add_checkbox(Translator.translate("Remove unnecessary parameters"))
 
 
-func show_shortcuts(category: String) -> void:
-	var shortcuts_container := content_container.get_child(-1).get_child(-1)
-	for child in shortcuts_container.get_children():
-		child.queue_free()
-
-	for action in ShortcutUtils.get_shortcuts(category):
-		var shortcut_config := ShortcutConfigWidget.instantiate() if\
-				ShortcutUtils.is_shortcut_modifiable(action) else\
-				ShortcutShowcaseWidget.instantiate()
-
-		shortcuts_container.add_child(shortcut_config)
-		shortcut_config.label.text = TranslationUtils.get_shortcut_description(action)
-		shortcut_config.setup(action)
+#func show_shortcuts(category: String) -> void:
+	#var shortcuts_container := content_container.get_child(-1).get_child(-1)
+	#for child in shortcuts_container.get_children():
+		#child.queue_free()
+	#
+	#for action in ShortcutUtils.get_shortcuts(category):
+		#var shortcut_config := ShortcutConfigWidget.instantiate() if\
+				#ShortcutUtils.is_shortcut_modifiable(action) else\
+				#ShortcutShowcaseWidget.instantiate()
+		#
+		#shortcuts_container.add_child(shortcut_config)
+		#shortcut_config.label.text = TranslationUtils.get_shortcut_description(action)
+		#shortcut_config.setup(action)
 
 func create_setting_container() -> void:
 	setting_container = VBoxContainer.new()

src/ui_parts/settings_menu.tscn

@@ -1,19 +1,12 @@
 [gd_scene load_steps=3 format=3 uid="uid://1rylg17uwltw"]
 
-[ext_resource type="Script" path="res://src/ui_parts/settings_menu.gd" id="1_1gf4m"]
+[ext_resource type="Script" uid="uid://1rjr3yrqwueu" path="res://src/ui_parts/settings_menu.gd" id="1_1gf4m"]
 [ext_resource type="Texture2D" uid="uid://c528knojuxbw6" path="res://assets/icons/Languages.svg" id="2_ndyp7"]
 
 [node name="SettingsMenu" type="PanelContainer"]
-custom_minimum_size = Vector2(640, 400)
-anchors_preset = 8
-anchor_left = 0.5
-anchor_top = 0.5
-anchor_right = 0.5
-anchor_bottom = 0.5
-offset_left = -180.0
-offset_top = -128.0
-offset_right = 180.0
-offset_bottom = 128.0
+anchors_preset = 15
+anchor_right = 1.0
+anchor_bottom = 1.0
 grow_horizontal = 2
 grow_vertical = 2
 theme_type_variation = &"OverlayPanel"
@@ -30,29 +23,29 @@ focus_mode = 0
 mouse_default_cursor_shape = 2
 icon = ExtResource("2_ndyp7")
 
-[node name="HBoxContainer" type="HBoxContainer" parent="VBoxContainer"]
+[node name="VBoxContainer" type="VBoxContainer" parent="VBoxContainer"]
 layout_mode = 2
 size_flags_vertical = 3
 theme_override_constants/separation = 0
 
-[node name="ContentPicker" type="PanelContainer" parent="VBoxContainer/HBoxContainer"]
-custom_minimum_size = Vector2(160, 0)
+[node name="ContentPicker" type="PanelContainer" parent="VBoxContainer/VBoxContainer"]
+custom_minimum_size = Vector2(0, 100)
 layout_mode = 2
 theme_type_variation = &"SideTabBar"
 
-[node name="Tabs" type="VBoxContainer" parent="VBoxContainer/HBoxContainer/ContentPicker"]
+[node name="Tabs" type="VBoxContainer" parent="VBoxContainer/VBoxContainer/ContentPicker"]
 unique_name_in_owner = true
 layout_mode = 2
 size_flags_horizontal = 3
 theme_override_constants/separation = 0
 
-[node name="PanelContainer" type="PanelContainer" parent="VBoxContainer/HBoxContainer"]
+[node name="PanelContainer" type="PanelContainer" parent="VBoxContainer/VBoxContainer"]
 layout_mode = 2
-size_flags_horizontal = 3
+size_flags_vertical = 3
 mouse_filter = 1
 theme_type_variation = &"SideBarContent"
 
-[node name="ContentContainer" type="ScrollContainer" parent="VBoxContainer/HBoxContainer/PanelContainer"]
+[node name="ContentContainer" type="ScrollContainer" parent="VBoxContainer/VBoxContainer/PanelContainer"]
 unique_name_in_owner = true
 custom_minimum_size = Vector2(0, 120)
 layout_mode = 2

src/ui_widgets/setting_shortcut.tscn

@@ -1,6 +1,6 @@
 [gd_scene load_steps=3 format=3 uid="uid://b7fw7bodu5fbb"]
 
-[ext_resource type="Script" path="res://src/ui_widgets/setting_shortcut.gd" id="1_4c8oc"]
+[ext_resource type="Script" uid="uid://ds386q8jgqkr2" path="res://src/ui_widgets/setting_shortcut.gd" id="1_4c8oc"]
 [ext_resource type="Texture2D" uid="uid://cvh3kwbucf2n1" path="res://assets/icons/Reload.svg" id="2_n8e0s"]
 
 [node name="SettingShortcut" type="PanelContainer"]