improved inverted colour scheme to allow for more readable backgrounds regardless of theme colour chosen

project.godot

@@ -40,6 +40,7 @@ window/per_pixel_transparency/allowed=true
 
 outputnode="Controls from the output node"
 inputnode="input file controls"
+invertable_background=""
 
 [gui]
 

scenes/Nodes/valueslider.tscn

@@ -1,7 +1,8 @@
-[gd_scene load_steps=3 format=3 uid="uid://dya5kxx132fgp"]
+[gd_scene load_steps=4 format=3 uid="uid://dya5kxx132fgp"]
 
 [ext_resource type="Script" uid="uid://bco7hof3wqck4" path="res://scenes/Nodes/valueslider.gd" id="1_4kxw6"]
 [ext_resource type="Script" uid="uid://duykdpsfmfw38" path="res://scenes/Nodes/breakfilemaker.gd" id="2_6ltu5"]
+[ext_resource type="Script" uid="uid://c503vew41pw80" path="res://scenes/main/scripts/color_rect_theme_invert.gd" id="2_du0of"]
 
 [node name="VBoxContainer" type="VBoxContainer"]
 custom_minimum_size = Vector2(270, 0)
@@ -59,13 +60,14 @@ text = "Double click to add/remove automation"
 horizontal_alignment = 2
 vertical_alignment = 1
 
-[node name="ColorRect" type="ColorRect" parent="BreakFileMaker"]
+[node name="ColorRect" type="ColorRect" parent="BreakFileMaker" groups=["invertable_background"]]
 offset_left = -20.0
 offset_top = 255.0
 offset_right = 716.0
 offset_bottom = 300.0
 mouse_filter = 2
 color = Color(0.101961, 0.101961, 0.101961, 0.329412)
+script = ExtResource("2_du0of")
 
 [node name="AutomationEditor" type="Control" parent="BreakFileMaker"]
 layout_mode = 3

scenes/main/audio_settings.tscn

@@ -1,6 +1,7 @@
-[gd_scene load_steps=2 format=3 uid="uid://dta7rfalv4uvd"]
+[gd_scene load_steps=3 format=3 uid="uid://dta7rfalv4uvd"]
 
 [ext_resource type="Script" uid="uid://c7krcoq5poxdn" path="res://scenes/main/scripts/audiosettings.gd" id="2_7qbns"]
+[ext_resource type="Script" uid="uid://c503vew41pw80" path="res://scenes/main/scripts/color_rect_theme_invert.gd" id="2_am4qw"]
 
 [node name="AudioSettings" type="Window"]
 title = "Audio Settings"
@@ -11,10 +12,11 @@ unresizable = true
 always_on_top = true
 script = ExtResource("2_7qbns")
 
-[node name="ColorRect" type="ColorRect" parent="."]
+[node name="ColorRect" type="ColorRect" parent="." groups=["invertable_background"]]
 offset_right = 604.0
 offset_bottom = 204.0
 color = Color(0.101961, 0.101961, 0.101961, 0.6)
+script = ExtResource("2_am4qw")
 
 [node name="VBoxContainer" type="VBoxContainer" parent="."]
 offset_left = 12.0

scenes/main/control.tscn

@@ -1,9 +1,10 @@
-[gd_scene load_steps=11 format=3 uid="uid://bcs87y7ptx3ke"]
+[gd_scene load_steps=12 format=3 uid="uid://bcs87y7ptx3ke"]
 
 [ext_resource type="Script" uid="uid://bdlfvuljckmu1" path="res://scenes/main/scripts/control.gd" id="1_2f0aq"]
 [ext_resource type="Script" uid="uid://l2yejnjysupr" path="res://scenes/main/scripts/graph_edit.gd" id="2_3ioqo"]
 [ext_resource type="PackedScene" uid="uid://b0wdj8v6o0wq0" path="res://scenes/menu/menu.tscn" id="3_dtf4o"]
 [ext_resource type="Texture2D" uid="uid://cdwux1smquvpi" path="res://theme/images/logo.png" id="4_3ioqo"]
+[ext_resource type="Script" uid="uid://c503vew41pw80" path="res://scenes/main/scripts/color_rect_theme_invert.gd" id="4_mg8al"]
 [ext_resource type="PackedScene" uid="uid://dta7rfalv4uvd" path="res://scenes/main/audio_settings.tscn" id="5_dtf4o"]
 [ext_resource type="Script" uid="uid://cyhaucukdha8a" path="res://scenes/main/scripts/console.gd" id="5_fbaj0"]
 [ext_resource type="Script" uid="uid://wja0lo4nobh1" path="res://scenes/main/scripts/about_menu.gd" id="5_yf4wl"]
@@ -51,6 +52,12 @@ unresizable = true
 borderless = true
 popup_window = true
 
+[node name="ColorRect" type="ColorRect" parent="NoLocationPopup" groups=["invertable_background"]]
+offset_right = 459.0
+offset_bottom = 514.0
+color = Color(0.101961, 0.101961, 0.101961, 0.6)
+script = ExtResource("4_mg8al")
+
 [node name="TextureRect" type="TextureRect" parent="NoLocationPopup"]
 offset_left = -6.0
 offset_top = 16.0
@@ -98,6 +105,12 @@ unresizable = true
 borderless = true
 popup_window = true
 
+[node name="ColorRect" type="ColorRect" parent="NoInputPopup" groups=["invertable_background"]]
+offset_right = 506.0
+offset_bottom = 421.0
+color = Color(0.101961, 0.101961, 0.101961, 0.6)
+script = ExtResource("4_mg8al")
+
 [node name="Label" type="Label" parent="NoInputPopup"]
 offset_left = 14.0
 offset_top = 7.0
@@ -130,6 +143,12 @@ unresizable = true
 borderless = true
 popup_window = true
 
+[node name="ColorRect" type="ColorRect" parent="WrongFolderPopup" groups=["invertable_background"]]
+offset_right = 506.0
+offset_bottom = 421.0
+color = Color(0.101961, 0.101961, 0.101961, 0.6)
+script = ExtResource("4_mg8al")
+
 [node name="Label" type="Label" parent="WrongFolderPopup"]
 offset_left = 14.0
 offset_top = 13.0
@@ -169,6 +188,12 @@ exclusive = true
 unresizable = true
 popup_window = true
 
+[node name="ColorRect" type="ColorRect" parent="AudioDevicePopup" groups=["invertable_background"]]
+offset_right = 506.0
+offset_bottom = 421.0
+color = Color(0.101961, 0.101961, 0.101961, 0.6)
+script = ExtResource("4_mg8al")
+
 [node name="Label" type="Label" parent="AudioDevicePopup"]
 offset_left = 14.0
 offset_top = 7.0
@@ -198,6 +223,12 @@ unresizable = true
 borderless = true
 popup_window = true
 
+[node name="ColorRect" type="ColorRect" parent="MultipleConnectionsPopup" groups=["invertable_background"]]
+offset_right = 506.0
+offset_bottom = 421.0
+color = Color(0.101961, 0.101961, 0.101961, 0.6)
+script = ExtResource("4_mg8al")
+
 [node name="Label" type="Label" parent="MultipleConnectionsPopup"]
 offset_left = 14.0
 offset_top = 10.0
@@ -268,13 +299,13 @@ item_0/id = 0
 item_1/text = "Copy"
 item_1/id = 1
 
-[node name="ColorRect" type="ColorRect" parent="."]
+[node name="MenuBarBackground" type="ColorRect" parent="."]
 layout_mode = 1
 anchors_preset = 10
 anchor_right = 1.0
 offset_bottom = 35.0
 grow_horizontal = 2
-color = Color(0.0646965, 0.0646965, 0.0646965, 1)
+color = Color(0.93408, 0.93408, 0.93408, 1)
 
 [node name="MenuBar" type="MenuBar" parent="."]
 layout_mode = 1
@@ -373,6 +404,12 @@ unresizable = true
 borderless = true
 popup_window = true
 
+[node name="ColorRect" type="ColorRect" parent="SaveChangesPopup" groups=["invertable_background"]]
+offset_right = 369.0
+offset_bottom = 114.0
+color = Color(0.101961, 0.101961, 0.101961, 0.6)
+script = ExtResource("4_mg8al")
+
 [node name="Label" type="Label" parent="SaveChangesPopup"]
 offset_left = -1.0
 offset_top = 21.0
@@ -447,6 +484,12 @@ exclusive = true
 unresizable = true
 popup_window = true
 
+[node name="ColorRect" type="ColorRect" parent="CheckForUpdates/UpdatePopup" groups=["invertable_background"]]
+offset_right = 398.0
+offset_bottom = 313.0
+color = Color(0.101961, 0.101961, 0.101961, 0.6)
+script = ExtResource("4_mg8al")
+
 [node name="Label" type="Label" parent="CheckForUpdates/UpdatePopup"]
 offset_left = 14.0
 offset_top = 6.0
@@ -483,6 +526,12 @@ transient = true
 exclusive = true
 borderless = true
 
+[node name="ColorRect" type="ColorRect" parent="ProgressWindow" groups=["invertable_background"]]
+offset_right = 613.0
+offset_bottom = 121.0
+color = Color(0.101961, 0.101961, 0.101961, 0.6)
+script = ExtResource("4_mg8al")
+
 [node name="ProgressBar" type="ProgressBar" parent="ProgressWindow"]
 offset_left = 10.0
 offset_top = 11.0

scenes/main/scripts/color_rect_theme_invert.gd

@@ -0,0 +1,11 @@
+extends ColorRect
+
+
+# Called when the node enters the scene tree for the first time.
+func _ready() -> void:
+	var interface_settings = ConfigHandler.load_interface_settings()
+	#check if the theme is inverted
+	if interface_settings.invert_theme:
+		color = Color(0.898, 0.898, 0.898, 0.6)
+	else:
+		color = Color(0.102, 0.102, 0.102, 0.6)

scenes/main/scripts/color_rect_theme_invert.gd.uid

@@ -0,0 +1 @@
+uid://c503vew41pw80

scenes/main/scripts/control.gd

@@ -83,6 +83,7 @@ func make_signal_connections():
 	get_node("mainmenu").open_help.connect(open_help.show_help_for_node)
 	get_node("Settings").open_cdp_location.connect(show_cdp_location)
 	get_node("Settings").console_on_top.connect(change_console_settings)
+	get_node("Settings").invert_ui.connect(invert_theme_toggled)
 	
 func hidpi_adjustment():
 	#checks if display is hidpi and scales ui accordingly hidpi - 144
@@ -183,11 +184,8 @@ func check_user_preferences():
 			RenderingServer.set_default_clear_color(Color(interface_settings.theme_custom_colour))
 			
 	#set the theme to either the main theme or inverted theme depending on user preferences
-	if interface_settings.invert_theme:
-		var inverted = $Settings.invert_theme(main_theme)
-		get_tree().root.theme = inverted
-	else:
-		get_tree().root.theme = main_theme
+	invert_theme_toggled(interface_settings.invert_theme)
+
 		
 func show_cdp_location():
 	$CdpLocationDialog.show()
@@ -667,3 +665,45 @@ func change_console_settings(toggled: bool):
 
 func _on_kill_process_button_down() -> void:
 	run_thread._on_kill_process_button_down()
+
+func invert_theme_toggled(toggled: bool):
+	if toggled:
+		var inverted = invert_theme(main_theme)
+		get_tree().root.theme = inverted # force refresh
+		$MenuBarBackground.color = Color(0.934, 0.934, 0.934)
+		for color_rect in get_tree().get_nodes_in_group("invertable_background"):
+			if color_rect is ColorRect:
+				color_rect.color = Color(0.898, 0.898, 0.898, 0.6)
+		
+	else:
+		get_tree().root.theme = main_theme # force refresheme = main_theme
+		$MenuBarBackground.color = Color(0.065, 0.065, 0.065)
+		
+		for color_rect in get_tree().get_nodes_in_group("invertable_background"):
+			if color_rect is ColorRect:
+				color_rect.color = Color(0.102, 0.102, 0.102, 0.6)
+		
+func invert_theme(theme: Theme) -> Theme:
+	var inverted_theme = theme.duplicate(true) # deep copy
+
+	# Check all types and color names in the theme
+	var types = inverted_theme.get_type_list()
+	for type in types:
+		var color_names = inverted_theme.get_color_list(type)
+		for cname in color_names:
+			var col = inverted_theme.get_color(cname, type)
+			var inverted = Color(1.0 - col.r, 1.0 - col.g, 1.0 - col.b, col.a)
+			inverted_theme.set_color(cname, type, inverted)
+
+		var style_names = inverted_theme.get_stylebox_list(type)
+		for sname in style_names:
+			if type == "GraphEdit" and sname == "panel":
+				continue
+			var sb = inverted_theme.get_stylebox(sname, type)
+			var new_sb = sb.duplicate()
+			if new_sb is StyleBoxFlat:
+				var col = new_sb.bg_color
+				new_sb.bg_color = Color(1.0 - col.r, 1.0 - col.g, 1.0 - col.b, col.a)
+			inverted_theme.set_stylebox(sname, type, new_sb)
+	
+	return inverted_theme

scenes/main/scripts/settings.gd

@@ -4,6 +4,8 @@ signal console_on_top
 var interface_settings
 var main_theme = preload("res://theme/main_theme.tres")
 
+signal invert_ui
+
 # Called when the node enters the scene tree for the first time.
 func _ready() -> void:
 	pass
@@ -65,37 +67,7 @@ func _on_custom_colour_picker_color_changed(color: Color) -> void:
 	if $VBoxContainer/HBoxContainer5/ThemeList.is_selected(3):
 		RenderingServer.set_default_clear_color(color)
 		
-func invert_theme(theme: Theme) -> Theme:
-	var inverted_theme = theme.duplicate(true) # deep copy
-
-	# Check all types and color names in the theme
-	var types = inverted_theme.get_type_list()
-	for type in types:
-		var color_names = inverted_theme.get_color_list(type)
-		for cname in color_names:
-			var col = inverted_theme.get_color(cname, type)
-			var inverted = Color(1.0 - col.r, 1.0 - col.g, 1.0 - col.b, col.a)
-			inverted_theme.set_color(cname, type, inverted)
-
-		var style_names = inverted_theme.get_stylebox_list(type)
-		for sname in style_names:
-			if type == "GraphEdit" and sname == "panel":
-				continue
-			var sb = inverted_theme.get_stylebox(sname, type)
-			var new_sb = sb.duplicate()
-			if new_sb is StyleBoxFlat:
-				var col = new_sb.bg_color
-				new_sb.bg_color = Color(1.0 - col.r, 1.0 - col.g, 1.0 - col.b, col.a)
-			inverted_theme.set_stylebox(sname, type, new_sb)
-	
-	return inverted_theme
-	
 
 func _on_invert_ui_toggled(toggled_on: bool) -> void:
 	ConfigHandler.save_interface_settings("invert_theme", toggled_on)
-	if toggled_on:
-		print("invert toggled on")
-		var inverted = invert_theme(main_theme)
-		get_tree().root.theme = inverted # force refresh
-	else:
-		get_tree().root.theme = main_theme # force refresheme = main_theme
+	invert_ui.emit(toggled_on)

scenes/main/settings.tscn

@@ -1,6 +1,7 @@
-[gd_scene load_steps=2 format=3 uid="uid://c1a6elrpk4eks"]
+[gd_scene load_steps=3 format=3 uid="uid://c1a6elrpk4eks"]
 
 [ext_resource type="Script" uid="uid://co12pspac25gq" path="res://scenes/main/scripts/settings.gd" id="1_uey6c"]
+[ext_resource type="Script" uid="uid://c503vew41pw80" path="res://scenes/main/scripts/color_rect_theme_invert.gd" id="2_bym2s"]
 
 [node name="Settings" type="Window"]
 auto_translate_mode = 1
@@ -12,10 +13,11 @@ unresizable = true
 always_on_top = true
 script = ExtResource("1_uey6c")
 
-[node name="ColorRect" type="ColorRect" parent="."]
+[node name="ColorRect" type="ColorRect" parent="." groups=["invertable_background"]]
 offset_right = 506.0
 offset_bottom = 421.0
 color = Color(0.101961, 0.101961, 0.101961, 0.6)
+script = ExtResource("2_bym2s")
 
 [node name="VBoxContainer" type="VBoxContainer" parent="."]
 offset_left = 12.0

theme/main_theme.tres

@@ -1,4 +1,4 @@
-[gd_resource type="Theme" load_steps=153 format=3 uid="uid://cefwkdcoxihro"]
+[gd_resource type="Theme" load_steps=157 format=3 uid="uid://cefwkdcoxihro"]
 
 [ext_resource type="FontFile" uid="uid://cc7mj053bhfvh" path="res://theme/WorkSans-Regular.otf" id="1_4xa5k"]
 [ext_resource type="Texture2D" uid="uid://b4o8vm5o4uptk" path="res://theme/images/toggle_checked.png" id="1_cibxr"]
@@ -647,6 +647,54 @@ border_color = Color(0, 0, 0, 0.6)
 corner_detail = 5
 shadow_color = Color(0, 0, 0, 0)
 
+[sub_resource type="StyleBoxFlat" id="StyleBoxFlat_1i8tr"]
+content_margin_left = 4.0
+content_margin_top = 4.0
+content_margin_right = 4.0
+content_margin_bottom = 4.0
+bg_color = Color(0.1, 0.1, 0.1, 0.3)
+corner_radius_top_left = 3
+corner_radius_top_right = 3
+corner_radius_bottom_right = 3
+corner_radius_bottom_left = 3
+corner_detail = 5
+
+[sub_resource type="StyleBoxFlat" id="StyleBoxFlat_twywa"]
+content_margin_left = 4.0
+content_margin_top = 4.0
+content_margin_right = 4.0
+content_margin_bottom = 4.0
+bg_color = Color(0.225, 0.225, 0.225, 0.6)
+corner_radius_top_left = 3
+corner_radius_top_right = 3
+corner_radius_bottom_right = 3
+corner_radius_bottom_left = 3
+corner_detail = 5
+
+[sub_resource type="StyleBoxFlat" id="StyleBoxFlat_h6rxs"]
+content_margin_left = 4.0
+content_margin_top = 4.0
+content_margin_right = 4.0
+content_margin_bottom = 4.0
+bg_color = Color(0.1, 0.1, 0.1, 0.6)
+corner_radius_top_left = 3
+corner_radius_top_right = 3
+corner_radius_bottom_right = 3
+corner_radius_bottom_left = 3
+corner_detail = 5
+
+[sub_resource type="StyleBoxFlat" id="StyleBoxFlat_kbb3a"]
+content_margin_left = 4.0
+content_margin_top = 4.0
+content_margin_right = 4.0
+content_margin_bottom = 4.0
+bg_color = Color(0, 0, 0, 0.6)
+corner_radius_top_left = 3
+corner_radius_top_right = 3
+corner_radius_bottom_right = 3
+corner_radius_bottom_left = 3
+corner_detail = 5
+
 [sub_resource type="StyleBoxFlat" id="StyleBoxFlat_5mqb0"]
 content_margin_left = 0.0
 content_margin_top = 0.0
@@ -1268,6 +1316,21 @@ LineEdit/icons/clear = SubResource("ImageTexture_qw5ey")
 LineEdit/styles/focus = SubResource("StyleBoxFlat_7hjjl")
 LineEdit/styles/normal = SubResource("StyleBoxFlat_wnmfn")
 LineEdit/styles/read_only = SubResource("StyleBoxFlat_qnold")
+MenuBar/colors/font_color = Color(0.875, 0.875, 0.875, 1)
+MenuBar/colors/font_disabled_color = Color(0.875, 0.875, 0.875, 0.5)
+MenuBar/colors/font_focus_color = Color(0.95, 0.95, 0.95, 1)
+MenuBar/colors/font_hover_color = Color(0.95, 0.95, 0.95, 1)
+MenuBar/colors/font_hover_pressed_color = Color(1, 1, 1, 1)
+MenuBar/colors/font_outline_color = Color(0, 0, 0, 1)
+MenuBar/colors/font_pressed_color = Color(1, 1, 1, 1)
+MenuBar/constants/h_separation = 4
+MenuBar/constants/outline_size = 0
+MenuBar/font_sizes/font_size = 16
+MenuBar/fonts/font = ExtResource("1_4xa5k")
+MenuBar/styles/disabled = SubResource("StyleBoxFlat_1i8tr")
+MenuBar/styles/hover = SubResource("StyleBoxFlat_twywa")
+MenuBar/styles/normal = SubResource("StyleBoxFlat_h6rxs")
+MenuBar/styles/pressed = SubResource("StyleBoxFlat_kbb3a")
 Panel/styles/panel = SubResource("StyleBoxFlat_5mqb0")
 PopupMenu/colors/font_accelerator_color = Color(0.7, 0.7, 0.7, 0.8)
 PopupMenu/colors/font_color = Color(0.875, 0.875, 0.875, 1)