More style updates

lib/asterisk/states/game_form.rb

@@ -7,26 +7,26 @@ class W3DHub
 
           theme W3DHub::THEME
 
-          background 0xaa_444444
+          background 0x88_525252
 
-          stack(width: 1.0, max_width: 760, height: 1.0, max_height: 256, v_align: :center, h_align: :center, background: 0xff_222222) do
+          stack(width: 1.0, max_width: 760, height: 1.0, max_height: 268, v_align: :center, h_align: :center, background: 0xee_222222) do
             # Title bar
-            flow(width: 1.0, height: 32, padding: 8) do
+            flow(width: 1.0, height: 36, padding: 8) do
               background 0x88_000000
 
               # image "#{GAME_ROOT_PATH}/media/ui_icons/export.png", width: 32, align: :center, color: 0xaa_ffffff
 
               # tagline "<b>#{I18n.t(:"server_browser.direct_connect")}</b>", fill: true, text_align: :center
-              tagline @game ? "Update Game" : "Add Game", width: 1.0, text_align: :center
+              title @game ? "Update Game" : "Add Game", width: 1.0, text_align: :center, font: BOLD_FONT
             end
 
             stack(width: 1.0, fill: true, padding_left: 8, padding_right: 8) do
-              stack(width: 1.0, height: 66) do
+              stack(width: 1.0, height: 72) do
                 para "Game or Mod Title:"
                 @game_title = edit_line "#{@game&.title}", width: 1.0, fill: true
               end
 
-              stack(width: 1.0, height: 66) do
+              stack(width: 1.0, height: 72) do
                 para "Path to Executable:"
 
                 flow(width: 1.0, fill: true) do
@@ -40,7 +40,7 @@ class W3DHub
 
               flow(fill: true)
 
-              flow(width: 1.0, margin_top: 8, height: 40, padding_bottom: 8) do
+              flow(width: 1.0, margin_top: 8, height: 46, padding_bottom: 8) do
                 button "Cancel", fill: true, margin_right: 4 do
                   pop_state
                 end

lib/asterisk/states/irc_profile_form.rb

@@ -7,24 +7,24 @@ class W3DHub
 
           theme W3DHub::THEME
 
-          background 0xaa_444444
+          background 0x88_525252
 
-          stack(width: 1.0, max_width: 760, height: 1.0, max_height: 560, v_align: :center, h_align: :center, background: 0xff_222222) do
+          stack(width: 1.0, max_width: 760, height: 1.0, max_height: 610, v_align: :center, h_align: :center, background: 0xee_222222) do
             # Title bar
-            flow(width: 1.0, height: 32, padding: 8) do
+            flow(width: 1.0, height: 36, padding: 8) do
               background 0x88_000000
 
               # tagline "<b>#{I18n.t(:"server_browser.direct_connect")}</b>", fill: true, text_align: :center
-              tagline @profile ? "Update IRC Profile" : "Add IRC Profile", width: 1.0, fill: true, text_align: :center
+              title @profile ? "Update IRC Profile" : "Add IRC Profile", width: 1.0, fill: true, text_align: :center, font: BOLD_FONT
             end
 
             stack(width: 1.0, fill: true, padding_left: 8, padding_right: 8) do
-              stack(width: 1.0, height: 66) do
+              stack(width: 1.0, height: 72) do
                 para "IRC Nickname:"
                 @nickname = edit_line "#{@profile&.nickname}", width: 1.0, fill: true
               end
 
-              stack(width: 1.0, height: 66) do
+              stack(width: 1.0, height: 72) do
                 flow(width: 1.0, height: 1.0) do
                   stack(width: 0.5, height: 1.0) do
                     para "IRC Username (Optional):"
@@ -38,7 +38,7 @@ class W3DHub
                 end
               end
 
-              stack(width: 1.0, height: 66, margin_top: 32) do
+              stack(width: 1.0, height: 72, margin_top: 32) do
                 flow(width: 1.0, height: 1.0) do
                   stack(width: 0.75, height: 1.0) do
                     para "IRC Server IP or Hostname:"
@@ -52,23 +52,30 @@ class W3DHub
                 end
               end
 
-              flow(width: 1.0, height: 66, margin_top: 8) do
+              flow(width: 1.0, height: 72, margin_top: 8) do
-                @server_ssl = check_box "IRC Server Use SSL", checked: @profile&.server_ssl, text_size: 18, width: 0.5, height: 66
+                flow(width: 0.5, height: 1.0) do
-                @server_verify_ssl = check_box "IRC Verify Server SSL Certificate", checked: @profile ? @profile.server_verify_ssl : true, text_size: 18, width: 0.5, height: 66
+                  @server_ssl = toggle_button checked: @profile&.server_ssl, text_size: 18, height: 18
+                  para "IRC Server Use SSL", fill: true, text_wrap: :none, margin_left: 8
+                end
+
+                flow(width: 0.5, height: 1.0) do
+                  @server_verify_ssl = toggle_button checked: @profile ? @profile.server_verify_ssl : true, text_size: 18, height: 18
+                  para "IRC Verify Server SSL Certificate", fill: true, text_wrap: :none, margin_left: 8
+                end
               end
 
-              stack(width: 1.0, height: 66) do
+              stack(width: 1.0, height: 72) do
                 para "Brenbot Bot Name:"
                 @bot_username = edit_line "#{@profile&.bot_username}", width: 1.0, fill: true
               end
 
-              flow(width: 1.0, height: 66) do
+              flow(width: 1.0, height: 72) do
-                stack(width: 0.5, height: 66) do
+                stack(width: 0.5, height: 72) do
                   para "Brenbot Auth Username:"
                   @bot_auth_username = edit_line "#{@profile&.bot_auth_username}", width: 1.0, fill: true
                 end
 
-                stack(width: 0.5, height: 66) do
+                stack(width: 0.5, height: 72) do
                   para "Brenbot Auth Password:"
                   @bot_auth_password = edit_line @profile && @profile.bot_auth_password ? Base64.strict_decode64(@profile.bot_auth_password) : "", width: 1.0, fill: true, type: :password
                 end
@@ -76,7 +83,7 @@ class W3DHub
 
               flow(fill: true)
 
-              flow(width: 1.0, margin_top: 8, height: 40, padding_bottom: 8) do
+              flow(width: 1.0, margin_top: 8, height: 46, padding_bottom: 8) do
                 button "Cancel", fill: true, margin_right: 4 do
                   pop_state
                 end

lib/asterisk/states/server_profile_form.rb

@@ -7,21 +7,21 @@ class W3DHub
 
           theme W3DHub::THEME
 
-          background 0xaa_444444
+          background 0x88_525252
 
-          stack(width: 1.0, max_width: 760, height: 1.0, max_height: 256, v_align: :center, h_align: :center, background: 0xff_222222) do
+          stack(width: 1.0, max_width: 760, height: 1.0, max_height: 272, v_align: :center, h_align: :center, background: 0xee_222222) do
             # Title bar
-            flow(width: 1.0, height: 32, padding: 8) do
+            flow(width: 1.0, height: 36, padding: 8) do
               background 0x88_000000
 
               # image "#{GAME_ROOT_PATH}/media/ui_icons/export.png", width: 32, align: :center, color: 0xaa_ffffff
 
               # tagline "<b>#{I18n.t(:"server_browser.direct_connect")}</b>", fill: true, text_align: :center
-              tagline @server_profile ? "Update Server Profile" : "Add Server Profile", width: 1.0, text_align: :center
+              title @server_profile ? "Update Server Profile" : "Add Server Profile", width: 1.0, text_align: :center, font: BOLD_FONT
             end
 
             stack(width: 1.0, fill: true, padding_left: 8, padding_right: 8) do
-              stack(width: 1.0, height: 66) do
+              stack(width: 1.0, height: 72) do
                 para "Server Profile Name:"
                 @server_name = edit_line "#{@server_profile&.name}", width: 1.0, fill: true
                 @server_name.subscribe(:changed) do |label|
@@ -31,7 +31,7 @@ class W3DHub
 
               flow(fill: true)
 
-              flow(width: 1.0, height: 40, padding_bottom: 8) do
+              flow(width: 1.0, height: 46, padding_bottom: 8) do
                 button "Cancel", fill: true, margin_right: 4 do
                   pop_state
                 end

lib/pages/login.rb

@@ -4,11 +4,9 @@ class W3DHub
       def setup
         body.clear do
           flow(width: 1.0, height: 1.0, padding: 32) do
-            background 0xff_252535
+            background 0xaa_25253f
 
-            stack(width: 0.28)
+            stack(width: 610, height: 380, v_align: :center, h_align: :center) do
-
-            stack(width: 0.48) do
               flow(width: 1.0) do
                 stack(width: 0.4)
                 image "#{GAME_ROOT_PATH}/media/icons/w3dhub.png", width: 0.20
@@ -20,14 +18,14 @@ class W3DHub
                 @username = edit_line "", width: 0.75, autofocus: true, focus: true
               end
 
-              flow(width: 1.0) do
+              flow(width: 1.0, margin_top: 8) do
                 tagline "Password", width: 0.25, text_align: :right
                 @password = edit_line "", width: 0.75, type: :password
               end
 
               flow(width: 1.0) do
                 tagline "", width: 0.25
-                button "Log In" do |btn|
+                @action_button = button "Log In" do |btn|
                   @username.enabled = false
                   @password.enabled = false
                   btn.enabled = false
@@ -90,6 +88,19 @@ class W3DHub
         end
       end
 
+      def button_down(id)
+        case id
+        when Gosu::KB_TAB
+          if @username.focused?
+            window.current_state.request_focus(@password)
+          else
+            window.current_state.request_focus(@username)
+          end
+        when Gosu::KB_ENTER, Gosu::KB_RETURN
+          @action_button.enabled? && @action_button.clicked_left_mouse_button(@action_button, 0, 0)
+        end
+      end
+
       def populate_account_info
         @host.instance_variable_get(:"@account_container").clear do
           flow(fill: true, height: 1.0) do

lib/states/dialogs/direct_connect_dialog.rb

@@ -9,7 +9,7 @@ class W3DHub
 
         background 0xaa_525252
 
-        stack(width: 1.0, max_width: 720, height: 1.0, max_height: 540, v_align: :center, h_align: :center, background: 0xee_222222) do
+        stack(width: 1.0, max_width: 720, height: 1.0, max_height: 576, v_align: :center, h_align: :center, background: 0xee_222222) do
           # Title bar
           flow(width: 1.0, height: 36, padding: 8) do
             background 0x88_000000
@@ -20,7 +20,7 @@ class W3DHub
           end
 
           stack(width: 1.0, fill: true, scroll: true) do
-            stack(width: 1.0, height: 66, margin_left: 8, margin_right: 8) do
+            stack(width: 1.0, height: 72, margin_left: 8, margin_right: 8) do
               para "Server profiles", text_align: :center, width: 1.0
 
               flow(width: 1.0, fill: true) do
@@ -51,7 +51,7 @@ class W3DHub
             end
 
             stack(width: 1.0, fill: true, margin_top: 8, padding: 8, border_color: 0xff_111111, border_thickness: 1) do
-              flow(width: 1.0, height: 66) do
+              flow(width: 1.0, height: 72) do
                 stack(width: 0.5, height: 1.0) do
                   para "Nickname:"
                   @server_nickname = edit_line "", width: 1.0, fill: true
@@ -73,7 +73,7 @@ class W3DHub
                 end
               end
 
-              flow(width: 1.0, height: 66) do
+              flow(width: 1.0, height: 72) do
                 stack(width: 0.5, height: 1.0) do
                   para "Server IP or Hostname:"
                   @server_hostname = edit_line "", width: 1.0, fill: true
@@ -95,7 +95,7 @@ class W3DHub
                 end
               end
 
-              stack(width: 1.0, height: 66) do
+              stack(width: 1.0, height: 72) do
                 para "Game or Mod:"
 
                 flow(width: 1.0, fill: true) do
@@ -125,7 +125,7 @@ class W3DHub
                 end
               end
 
-              stack(width: 1.0, height: 66) do
+              stack(width: 1.0, height: 72) do
                 para "Launch arguments (Optional):"
                 @launch_arguments = edit_line "", width: 1.0, fill: true
                 @launch_arguments.subscribe(:changed) do |e|
@@ -135,7 +135,7 @@ class W3DHub
                 end
               end
 
-              stack(width: 1.0, height: 66) do
+              stack(width: 1.0, height: 72) do
                 para "IRC Profile (Optional):"
 
                 flow(width: 1.0, fill: true) do

lib/states/dialogs/game_settings_dialog.rb

@@ -1,7 +1,7 @@
 class W3DHub
   class States
     class GameSettingsDialog < Dialog
-      BUTTON_STYLE = { text_size: 18, padding_top: 3, padding_bottom: 3, padding_left: 3, padding_right: 3 }
+      BUTTON_STYLE = { text_size: 18, padding_top: 3, padding_bottom: 3, padding_left: 3, padding_right: 3, height: 18 }
 
       def setup
         window.show_cursor = true
@@ -15,7 +15,7 @@ class W3DHub
 
         background 0xaa_525252
 
-        stack(width: 1.0, max_width: 720, height: 1.0, max_height: 680, v_align: :center, h_align: :center, background: 0xee_222222, border_thickness: 2, border_color: 0xff_444444, padding: 10) do
+        stack(width: 1.0, max_width: 760, height: 1.0, max_height: 720, v_align: :center, h_align: :center, background: 0xee_222222, border_thickness: 2, border_color: 0xee_222222, padding: 10) do
           flow(width: 1.0, height: 36, padding: 8) do
             background Store.application_manager.color(@app_id)
 
@@ -27,49 +27,49 @@ class W3DHub
               stack(width: 0.5, height: 1.0, margin_right: 8) do
                 tagline "General"
 
-                flow(width: 1.0, height: 24, margin: 4, margin_left: 10) do
+                flow(width: 1.0, height: 28, margin: 4, margin_left: 10) do
                   para "Default to First Person", fill: true, text_wrap: :none
                   toggle_button tip: "Default to First Person", checked: @game_settings.get_value(:default_to_first_person), **BUTTON_STYLE do |btn|
                     @game_settings.set_value(:default_to_first_person, btn.value)
                   end
                 end
 
-                flow(width: 1.0, height: 24, margin: 4, margin_left: 10) do
+                flow(width: 1.0, height: 28, margin: 4, margin_left: 10) do
                   para "Background Downloads", fill: true, text_wrap: :none
                   toggle_button tip: "Background Downloads", checked: @game_settings.get_value(:background_downloads), **BUTTON_STYLE do |btn|
                     @game_settings.set_value(:background_downloads, btn.value)
                   end
                 end
 
-                flow(width: 1.0, height: 24, margin: 4, margin_left: 10) do
+                flow(width: 1.0, height: 28, margin: 4, margin_left: 10) do
                   para "Enable Hints", fill: true, text_wrap: :none
                   toggle_button tip: "Enable Hints", checked: @game_settings.get_value(:hints_enabled), **BUTTON_STYLE do |btn|
                     @game_settings.set_value(:hints_enabled, btn.value)
                   end
                 end
 
-                flow(width: 1.0, height: 24, margin: 4, margin_left: 10) do
+                flow(width: 1.0, height: 28, margin: 4, margin_left: 10) do
                   para "Enable Chat Log", fill: true, text_wrap: :none
                   toggle_button tip: "Enable Chat Log", checked: @game_settings.get_value(:chat_log), **BUTTON_STYLE do |btn|
                     @game_settings.set_value(:chat_log, btn.value)
                   end
                 end
 
-                flow(width: 1.0, height: 24, margin: 4, margin_left: 10) do
+                flow(width: 1.0, height: 28, margin: 4, margin_left: 10) do
                   para "Show FPS", fill: true, text_wrap: :none
                   toggle_button tip: "Show FPS", checked: @game_settings.get_value(:show_fps), **BUTTON_STYLE do |btn|
                     @game_settings.set_value(:show_fps, btn.value)
                   end
                 end
 
-                flow(width: 1.0, height: 24, margin: 4, margin_left: 10) do
+                flow(width: 1.0, height: 28, margin: 4, margin_left: 10) do
                   para "Show Velocity", fill: true, text_wrap: :none
                   toggle_button tip: "Show Velocity", checked: @game_settings.get_value(:show_velocity), **BUTTON_STYLE do |btn|
                     @game_settings.set_value(:show_velocity, btn.value)
                   end
                 end
 
-                flow(width: 1.0, height: 24, margin: 4, margin_left: 10) do
+                flow(width: 1.0, height: 28, margin: 4, margin_left: 10) do
                   para "Show Damage Numbers", fill: true, text_wrap: :none
                   toggle_button tip: "Show Damage Numbers", checked: @game_settings.get_value(:show_damage_numbers), **BUTTON_STYLE do |btn|
                     @game_settings.set_value(:show_damage_numbers, btn.value)
@@ -80,7 +80,7 @@ class W3DHub
               stack(width: 0.5, height: 1.0, margin_left: 8) do
                 tagline "Video"
 
-                flow(width: 1.0, height: 24, margin: 4, margin_left: 10) do
+                flow(width: 1.0, height: 28, margin: 4, margin_left: 10) do
                   res_options = @game_settings.get(:resolution_width).options.each_with_index.map do |w, i|
                     "#{w[0]}x#{@game_settings.get(:resolution_height).options[i][0]}"
                   end
@@ -96,21 +96,21 @@ class W3DHub
                   end
                 end
 
-                flow(width: 1.0, height: 24, margin: 4, margin_left: 10) do
+                flow(width: 1.0, height: 28, margin: 4, margin_left: 10) do
                   para "Windowed Mode", fill: true, text_wrap: :none
                   list_box items: @game_settings.get(:windowed_mode).options.map { |v| v[0] }, choose: @game_settings.get_value(:windowed_mode), width: 172, **BUTTON_STYLE do |value|
                     @game_settings.set_value(:windowed_mode, value)
                   end
                 end
 
-                flow(width: 1.0, height: 24, margin: 4, margin_left: 10) do
+                flow(width: 1.0, height: 28, margin: 4, margin_left: 10) do
                   para "Enable VSync", fill: true, text_wrap: :none
                   toggle_button tip: "Enable VSync", checked: @game_settings.get_value(:vsync), **BUTTON_STYLE do |btn|
                     @game_settings.set_value(:vsync, btn.value)
                   end
                 end
 
-                flow(width: 1.0, height: 24, margin: 4, margin_left: 10) do
+                flow(width: 1.0, height: 28, margin: 4, margin_left: 10) do
                   para "Anti-aliasing", fill: true, text_wrap: :none
                   list_box items: @game_settings.get(:anti_aliasing).options.map { |v| v[0] }, choose: @game_settings.get_value(:anti_aliasing), width: 72, **BUTTON_STYLE do |value|
                     @game_settings.set_value(:anti_aliasing, value)
@@ -123,7 +123,7 @@ class W3DHub
               stack(width: 0.5, height: 1.0, margin_right: 8) do
                 tagline "Audio"
 
-                flow(width: 1.0, height: 24, margin: 4, margin_left: 10) do
+                flow(width: 1.0, height: 28, margin: 4, margin_left: 10) do
                   para "Master Volume", fill: true, text_wrap: :none
                   slider(height: 1.0, width: 172, value: @game_settings.get_value(:master_volume), margin_right: 8).subscribe(:changed) do |slider|
                     @game_settings.set_value(:master_volume, slider.value)
@@ -134,7 +134,7 @@ class W3DHub
                   end
                 end
 
-                flow(width: 1.0, height: 24, margin: 4, margin_left: 10) do
+                flow(width: 1.0, height: 28, margin: 4, margin_left: 10) do
                   para "Sound Effects", fill: true, text_wrap: :none
                   slider(height: 1.0, width: 172, value: @game_settings.get_value(:sound_effects_volume), margin_right: 8).subscribe(:changed) do |slider|
                     @game_settings.set_value(:sound_effects_volume, slider.value)
@@ -145,7 +145,7 @@ class W3DHub
                   end
                 end
 
-                flow(width: 1.0, height: 24, margin: 4, margin_left: 10) do
+                flow(width: 1.0, height: 28, margin: 4, margin_left: 10) do
                   para "Dialogue", fill: true, text_wrap: :none
                   slider(height: 1.0, width: 172, value: @game_settings.get_value(:sound_dialog_volume), margin_right: 8).subscribe(:changed) do |slider|
                     @game_settings.set_value(:sound_dialog_volume, slider.value)
@@ -156,7 +156,7 @@ class W3DHub
                   end
                 end
 
-                flow(width: 1.0, height: 24, margin: 4, margin_left: 10) do
+                flow(width: 1.0, height: 28, margin: 4, margin_left: 10) do
                   para "Music", fill: true, text_wrap: :none
                   slider(height: 1.0, width: 172, value: @game_settings.get_value(:sound_music_volume), margin_right: 8).subscribe(:changed) do |slider|
                     @game_settings.set_value(:sound_music_volume, slider.value)
@@ -167,7 +167,7 @@ class W3DHub
                   end
                 end
 
-                flow(width: 1.0, height: 24, margin: 4, margin_left: 10) do
+                flow(width: 1.0, height: 28, margin: 4, margin_left: 10) do
                   para "Cinematic", fill: true, text_wrap: :none
                   slider(height: 1.0, width: 172, value: @game_settings.get_value(:sound_cinematic_volume), margin_right: 8).subscribe(:changed) do |slider|
                     @game_settings.set_value(:sound_cinematic_volume, slider.value)
@@ -178,7 +178,7 @@ class W3DHub
                   end
                 end
 
-                flow(width: 1.0, height: 24, margin: 4, margin_left: 10) do
+                flow(width: 1.0, height: 28, margin: 4, margin_left: 10) do
                   para "Play Sound with Game in Background", fill: true, text_wrap: :none
                   toggle_button tip: "Play Sound with Game in Background", checked: @game_settings.get_value(:sound_in_background), **BUTTON_STYLE do |btn|
                     @game_settings.set_value(:sound_in_background, btn.value)
@@ -189,49 +189,49 @@ class W3DHub
               stack(width: 0.5, height: 1.0, margin_left: 8) do
                 tagline "Performance"
 
-                flow(width: 1.0, height: 24, margin: 4, margin_left: 10) do
+                flow(width: 1.0, height: 28, margin: 4, margin_left: 10) do
                   para "Texture Detail", fill: true, text_wrap: :none
                   list_box items: @game_settings.get(:texture_detail).options.map { |v| v[0] }, choose: @game_settings.get_value(:texture_detail), width: 172, **BUTTON_STYLE do |value|
                     @game_settings.set_value(:texture_detail, value)
                   end
                 end
 
-                flow(width: 1.0, height: 24, margin: 4, margin_left: 10) do
+                flow(width: 1.0, height: 28, margin: 4, margin_left: 10) do
                   para "Texture Filtering", fill: true, text_wrap: :none
                   list_box items: @game_settings.get(:texture_filtering).options.map { |v| v[0] }, choose: @game_settings.get_value(:texture_filtering), width: 172, **BUTTON_STYLE do |value|
                     @game_settings.set_value(:texture_filtering, value)
                   end
                 end
 
-                # flow(width: 1.0, height: 24, margin: 4, margin_left: 10) do
+                # flow(width: 1.0, height: 28, margin: 4, margin_left: 10) do
                 #   para "Shader Detail", fill: true
                 #   list_box items: @game_settings.get(:texture_filtering).options.map { |v| v[0] }, choose: @game_settings.get_value(:texture_filtering), width: 172, **BUTTON_STYLE do |value|
                 #     @game_settings.set_value(:texture_filtering, value)
                 #   end
                 # end
 
-                # flow(width: 1.0, height: 24, margin: 4, margin_left: 10) do
+                # flow(width: 1.0, height: 28, margin: 4, margin_left: 10) do
                 #   para "Post Processing Detail", fill: true
                 #   list_box items: @game_settings.get(:texture_filtering).options.map { |v| v[0] }, choose: @game_settings.get_value(:texture_filtering), width: 172, **BUTTON_STYLE do |value|
                 #     @game_settings.set_value(:texture_filtering, value)
                 #   end
                 # end
 
-                flow(width: 1.0, height: 24, margin: 4, margin_left: 10) do
+                flow(width: 1.0, height: 28, margin: 4, margin_left: 10) do
                   para "Shadow Resolution", fill: true, text_wrap: :none
                   list_box items: @game_settings.get(:shadow_resolution).options.map { |v| v[0] }, choose: @game_settings.get_value(:shadow_resolution), width: 172, **BUTTON_STYLE do |value|
                     @game_settings.set_value(:shadow_resolution, value)
                   end
                 end
 
-                flow(width: 1.0, height: 24, margin: 4, margin_left: 10) do
+                flow(width: 1.0, height: 28, margin: 4, margin_left: 10) do
                   para "High Quality Shadows", fill: true, text_wrap: :none
                   toggle_button tip: "High Quality Shadows", checked: @game_settings.get_value(:background_downloads), **BUTTON_STYLE do |btn|
                     @game_settings.set_value(:background_downloads, btn.value)
                   end
                 end
 
-                flow(width: 1.0, height: 24, margin: 4, margin_left: 10) do
+                flow(width: 1.0, height: 28, margin: 4, margin_left: 10) do
                   para "FPS Limit", fill: true, text_wrap: :none
                   list_box items: @game_settings.get(:fps).options.map { |v| v[0] }, choose: @game_settings.get_value(:fps), width: 172, **BUTTON_STYLE do |value|
                     @game_settings.set_value(:fps, value.to_i)
@@ -241,7 +241,7 @@ class W3DHub
             end
           end
 
-          flow(width: 1.0, height: 0.1, padding: 8) do
+          flow(width: 1.0, height: 46, padding: 8) do
             button "Cancel", width: 0.25 do
               pop_state
               @options[:cancel_callback]&.call

lib/theme.rb

@@ -29,8 +29,8 @@ class W3DHub
     },
     TextBlock: {
       font: REGULAR_FONT,
+      color: 0xff_f2f2f2,
       text_static: true,
-      text_color: 0xff_f2f2f2,
       text_border: false,
       text_shadow: true,
       text_shadow_size: 1,
@@ -61,11 +61,6 @@ class W3DHub
     Inscription: { # < TextBlock
       text_size: 18
     },
-    EditLine: {
-      border_thickness: 2,
-      border_color: Gosu::Color::WHITE,
-      hover: { color: Gosu::Color::WHITE }
-    },
     Link: {
       color: 0xff_cdcdcd,
       hover: {
@@ -77,6 +72,7 @@ class W3DHub
     },
     Button: {
       font: BOLD_FONT,
+      color: 0xff_f2f2f2,
       text_size: 22,
       padding_top: 8,
       padding_left: 16,
@@ -86,16 +82,33 @@ class W3DHub
       border_color: Gosu::Color::NONE,
       background: 0xff_0074e0,
       hover: {
-        text_color: 0xff_f2f2f2,
+        color: 0xff_f2f2f2,
         background: 0xff_004c94,
         border_color: 0xff_0074e0
       },
       active: {
-        text_color: 0xff_aaaaaa,
+        color: 0xff_aaaaaa,
         background: 0xff_005aad,
         border_color: 0xff_0074e0
       }
     },
+    EditLine: {
+      font: REGULAR_FONT,
+      color: 0xff_f2f2f2,
+      background: 0xff_383838,
+      border_thickness: 2,
+      border_color: 0xff_0074e0,
+      hover: {
+        color: 0xff_f2f2f2,
+        background: 0xff_323232,
+        border_color: 0xff_0074e0
+      },
+      active: {
+        color: 0xff_f2f2f2,
+        background: 0xff_4b4b4b,
+        border_color: 0xff_0074e0
+      }
+    },
     ToggleButton: {
       padding_left: 8,
       padding_right: 8,