Add colored margin in Inspector for arrays and dictionaries.

Apply suggestions from code review

Co-Authored-By: A Thousand Ships <96648715+AThousandShips@users.noreply.github.com>
Co-Authored-By: Tomek <kobewi4e@gmail.com>

8 files changed, 181 insertions, 116 deletions

diff --git a/editor/editor_inspector.cpp b/editor/editor_inspector.cpp
index f1e487d79b..845ca9b26d 100644
--- a/editor/editor_inspector.cpp
+++ b/editor/editor_inspector.cpp
@@ -489,6 +489,49 @@ StringName EditorProperty::_get_revert_property() const {
 	return property;
 }
 
+void EditorProperty::_update_property_bg() {
+	// This function is to be called on EditorPropertyResource, EditorPropertyArray, and EditorPropertyDictionary.
+	// Behavior is undetermined on any other EditorProperty.
+	if (!is_inside_tree()) {
+		return;
+	}
+
+	begin_bulk_theme_override();
+
+	if (bottom_editor) {
+		ColorationMode nested_color_mode = (ColorationMode)(int)EDITOR_GET("interface/inspector/nested_color_mode");
+		bool delimitate_all_container_and_resources = EDITOR_GET("interface/inspector/delimitate_all_container_and_resources");
+		int count_subinspectors = 0;
+		if (is_colored(nested_color_mode)) {
+			Node *n = this;
+			while (n) {
+				EditorProperty *ep = Object::cast_to<EditorProperty>(n);
+				if (ep && ep->is_colored(nested_color_mode)) {
+					count_subinspectors++;
+				}
+				n = n->get_parent();
+			}
+			count_subinspectors = MIN(16, count_subinspectors);
+		}
+		add_theme_style_override(SNAME("DictionaryAddItem"), get_theme_stylebox("DictionaryAddItem" + itos(count_subinspectors), EditorStringName(EditorStyles)));
+		add_theme_constant_override("v_separation", 0);
+		if (delimitate_all_container_and_resources || is_colored(nested_color_mode)) {
+			add_theme_style_override("bg_selected", get_theme_stylebox("sub_inspector_property_bg" + itos(count_subinspectors), EditorStringName(EditorStyles)));
+			add_theme_style_override("bg", get_theme_stylebox("sub_inspector_property_bg" + itos(count_subinspectors), EditorStringName(EditorStyles)));
+			add_theme_color_override("property_color", get_theme_color(SNAME("sub_inspector_property_color"), EditorStringName(EditorStyles)));
+			bottom_editor->add_theme_style_override("panel", get_theme_stylebox("sub_inspector_bg" + itos(count_subinspectors), EditorStringName(EditorStyles)));
+		} else {
+			bottom_editor->add_theme_style_override("panel", get_theme_stylebox("sub_inspector_bg_no_border", EditorStringName(EditorStyles)));
+		}
+	} else {
+		remove_theme_style_override("bg_selected");
+		remove_theme_style_override("bg");
+		remove_theme_color_override("property_color");
+	}
+	end_bulk_theme_override();
+	queue_redraw();
+}
+
 void EditorProperty::update_editor_property_status() {
 	if (property == StringName()) {
 		return; //no property, so nothing to do
@@ -3481,8 +3524,8 @@ void EditorInspector::edit(Object *p_object) {
 
 	next_object = p_object; // Some plugins need to know the next edited object when clearing the inspector.
 	if (object) {
-		_clear();
 		object->disconnect("property_list_changed", callable_mp(this, &EditorInspector::_changed_callback));
+		_clear();
 	}
 	per_array_page.clear();
 
@@ -3676,30 +3719,11 @@ void EditorInspector::set_use_wide_editors(bool p_enable) {
 	wide_editors = p_enable;
 }
 
-void EditorInspector::_update_inspector_bg() {
-	if (sub_inspector) {
-		int count_subinspectors = 0;
-		Node *n = get_parent();
-		while (n) {
-			EditorInspector *ei = Object::cast_to<EditorInspector>(n);
-			if (ei && ei->sub_inspector) {
-				count_subinspectors++;
-			}
-			n = n->get_parent();
-		}
-		count_subinspectors = MIN(15, count_subinspectors);
-		add_theme_style_override("panel", get_theme_stylebox("sub_inspector_bg" + itos(count_subinspectors), EditorStringName(Editor)));
-	} else {
-		add_theme_style_override("panel", get_theme_stylebox(SNAME("panel"), SNAME("Tree")));
-	}
-}
 void EditorInspector::set_sub_inspector(bool p_enable) {
 	sub_inspector = p_enable;
 	if (!is_inside_tree()) {
 		return;
 	}
-
-	_update_inspector_bg();
 }
 
 void EditorInspector::set_use_deletable_properties(bool p_enabled) {
@@ -4014,7 +4038,7 @@ void EditorInspector::_notification(int p_what) {
 		case NOTIFICATION_READY: {
 			EditorFeatureProfileManager::get_singleton()->connect("current_feature_profile_changed", callable_mp(this, &EditorInspector::_feature_profile_changed));
 			set_process(is_visible_in_tree());
-			_update_inspector_bg();
+			add_theme_style_override("panel", get_theme_stylebox(SNAME("panel"), SNAME("Tree")));
 		} break;
 
 		case NOTIFICATION_ENTER_TREE: {
@@ -4088,10 +4112,6 @@ void EditorInspector::_notification(int p_what) {
 		} break;
 
 		case EditorSettings::NOTIFICATION_EDITOR_SETTINGS_CHANGED: {
-			if (EditorThemeManager::is_generated_theme_outdated()) {
-				_update_inspector_bg();
-			}
-
 			bool needs_update = false;
 
 			if (use_settings_name_style && EditorSettings::get_singleton()->check_changed_settings_in_group("interface/editor/localize_settings")) {
@@ -4101,6 +4121,7 @@ void EditorInspector::_notification(int p_what) {
 					needs_update = true;
 				}
 			}
+
 			if (EditorSettings::get_singleton()->check_changed_settings_in_group("interface/inspector")) {
 				needs_update = true;
 			}
diff --git a/editor/editor_inspector.h b/editor/editor_inspector.h
index cf3bf89e09..b052693524 100644
--- a/editor/editor_inspector.h
+++ b/editor/editor_inspector.h
@@ -67,6 +67,12 @@ public:
 		MENU_OPEN_DOCUMENTATION,
 	};
 
+	enum ColorationMode {
+		COLORATION_CONTAINER_RESOURCE,
+		COLORATION_RESOURCE,
+		COLORATION_EXTERNAL,
+	};
+
 private:
 	String label;
 	int text_size;
@@ -141,6 +147,8 @@ protected:
 	virtual Variant _get_cache_value(const StringName &p_prop, bool &r_valid) const;
 	virtual StringName _get_revert_property() const;
 
+	void _update_property_bg();
+
 public:
 	void emit_changed(const StringName &p_property, const Variant &p_value, const StringName &p_field = StringName(), bool p_changing = false);
 
@@ -177,6 +185,8 @@ public:
 	void set_keying(bool p_keying);
 	bool is_keying() const;
 
+	virtual bool is_colored(ColorationMode p_mode) { return false; }
+
 	void set_deletable(bool p_enable);
 	bool is_deletable() const;
 	void add_focusable(Control *p_control);
@@ -557,8 +567,6 @@ class EditorInspector : public ScrollContainer {
 
 	bool _is_property_disabled_by_feature_profile(const StringName &p_property);
 
-	void _update_inspector_bg();
-
 	ConfirmationDialog *add_meta_dialog = nullptr;
 	LineEdit *add_meta_name = nullptr;
 	OptionButton *add_meta_type = nullptr;
diff --git a/editor/editor_properties.cpp b/editor/editor_properties.cpp
index 2964fb364b..f34994a10d 100644
--- a/editor/editor_properties.cpp
+++ b/editor/editor_properties.cpp
@@ -48,6 +48,7 @@
 #include "editor/property_selector.h"
 #include "editor/scene_tree_dock.h"
 #include "editor/themes/editor_scale.h"
+#include "editor/themes/editor_theme_manager.h"
 #include "scene/2d/gpu_particles_2d.h"
 #include "scene/3d/fog_volume.h"
 #include "scene/3d/gpu_particles_3d.h"
@@ -3220,42 +3221,6 @@ void EditorPropertyResource::_open_editor_pressed() {
 	}
 }
 
-void EditorPropertyResource::_update_property_bg() {
-	if (!is_inside_tree()) {
-		return;
-	}
-
-	updating_theme = true;
-
-	begin_bulk_theme_override();
-	if (sub_inspector != nullptr) {
-		int count_subinspectors = 0;
-		Node *n = get_parent();
-		while (n) {
-			EditorInspector *ei = Object::cast_to<EditorInspector>(n);
-			if (ei && ei->is_sub_inspector()) {
-				count_subinspectors++;
-			}
-			n = n->get_parent();
-		}
-		count_subinspectors = MIN(15, count_subinspectors);
-
-		add_theme_color_override("property_color", get_theme_color(SNAME("sub_inspector_property_color"), EditorStringName(Editor)));
-		add_theme_style_override("bg_selected", get_theme_stylebox("sub_inspector_property_bg" + itos(count_subinspectors), EditorStringName(Editor)));
-		add_theme_style_override("bg", get_theme_stylebox("sub_inspector_property_bg" + itos(count_subinspectors), EditorStringName(Editor)));
-		add_theme_constant_override("v_separation", 0);
-	} else {
-		add_theme_color_override("property_color", get_theme_color(SNAME("property_color"), SNAME("EditorProperty")));
-		add_theme_style_override("bg_selected", get_theme_stylebox(SNAME("bg_selected"), SNAME("EditorProperty")));
-		add_theme_style_override("bg", get_theme_stylebox(SNAME("bg"), SNAME("EditorProperty")));
-		add_theme_constant_override("v_separation", get_theme_constant(SNAME("v_separation"), SNAME("EditorProperty")));
-	}
-	end_bulk_theme_override();
-
-	updating_theme = false;
-	queue_redraw();
-}
-
 void EditorPropertyResource::_update_preferred_shader() {
 	Node *parent = get_parent();
 	EditorProperty *parent_property = nullptr;
@@ -3362,12 +3327,10 @@ void EditorPropertyResource::update_property() {
 				sub_inspector->set_read_only(is_read_only());
 				sub_inspector->set_use_folding(is_using_folding());
 
-				sub_inspector_vbox = memnew(VBoxContainer);
-				sub_inspector_vbox->set_mouse_filter(MOUSE_FILTER_STOP);
-				add_child(sub_inspector_vbox);
-				set_bottom_editor(sub_inspector_vbox);
+				sub_inspector->set_mouse_filter(MOUSE_FILTER_STOP);
+				add_child(sub_inspector);
+				set_bottom_editor(sub_inspector);
 
-				sub_inspector_vbox->add_child(sub_inspector);
 				resource_picker->set_toggle_pressed(true);
 
 				Array editor_list;
@@ -3383,20 +3346,18 @@ void EditorPropertyResource::update_property() {
 					_open_editor_pressed();
 					opened_editor = true;
 				}
-
-				_update_property_bg();
 			}
 
 			if (res.ptr() != sub_inspector->get_edited_object()) {
 				sub_inspector->edit(res.ptr());
+				_update_property_bg();
 			}
 
 		} else {
 			if (sub_inspector) {
 				set_bottom_editor(nullptr);
-				memdelete(sub_inspector_vbox);
+				memdelete(sub_inspector);
 				sub_inspector = nullptr;
-				sub_inspector_vbox = nullptr;
 
 				if (opened_editor) {
 					EditorNode::get_singleton()->hide_unused_editors();
@@ -3442,10 +3403,26 @@ void EditorPropertyResource::fold_resource() {
 	}
 }
 
+bool EditorPropertyResource::is_colored(ColorationMode p_mode) {
+	switch (p_mode) {
+		case COLORATION_CONTAINER_RESOURCE:
+			return sub_inspector != nullptr;
+		case COLORATION_RESOURCE:
+			return true;
+		case COLORATION_EXTERNAL:
+			if (sub_inspector) {
+				Resource *edited_resource = Object::cast_to<Resource>(sub_inspector->get_edited_object());
+				return edited_resource && !edited_resource->is_built_in();
+			}
+			break;
+	}
+	return false;
+}
+
 void EditorPropertyResource::_notification(int p_what) {
 	switch (p_what) {
 		case NOTIFICATION_THEME_CHANGED: {
-			if (!updating_theme) {
+			if (EditorThemeManager::is_generated_theme_outdated()) {
 				_update_property_bg();
 			}
 		} break;
diff --git a/editor/editor_properties.h b/editor/editor_properties.h
index ce164733fe..d16c80bfc4 100644
--- a/editor/editor_properties.h
+++ b/editor/editor_properties.h
@@ -699,8 +699,6 @@ class EditorPropertyResource : public EditorProperty {
 
 	bool use_sub_inspector = false;
 	EditorInspector *sub_inspector = nullptr;
-	VBoxContainer *sub_inspector_vbox = nullptr;
-	bool updating_theme = false;
 	bool opened_editor = false;
 
 	void _resource_selected(const Ref<Resource> &p_resource, bool p_inspect);
@@ -713,7 +711,6 @@ class EditorPropertyResource : public EditorProperty {
 	void _sub_inspector_object_id_selected(int p_id);
 
 	void _open_editor_pressed();
-	void _update_property_bg();
 	void _update_preferred_shader();
 
 protected:
@@ -731,6 +728,8 @@ public:
 	void set_use_sub_inspector(bool p_enable);
 	void fold_resource();
 
+	virtual bool is_colored(ColorationMode p_mode) override;
+
 	EditorPropertyResource();
 };
 
diff --git a/editor/editor_properties_array_dict.cpp b/editor/editor_properties_array_dict.cpp
index da072744b8..c3142b4cd0 100644
--- a/editor/editor_properties_array_dict.cpp
+++ b/editor/editor_properties_array_dict.cpp
@@ -39,6 +39,7 @@
 #include "editor/gui/editor_spin_slider.h"
 #include "editor/inspector_dock.h"
 #include "editor/themes/editor_scale.h"
+#include "editor/themes/editor_theme_manager.h"
 #include "scene/gui/button.h"
 #include "scene/gui/margin_container.h"
 #include "scene/resources/packed_scene.h"
@@ -353,8 +354,7 @@ void EditorPropertyArray::update_property() {
 		updating = true;
 
 		if (!container) {
-			container = memnew(MarginContainer);
-			container->set_theme_type_variation("MarginContainer4px");
+			container = memnew(PanelContainer);
 			container->set_mouse_filter(MOUSE_FILTER_STOP);
 			add_child(container);
 			set_bottom_editor(container);
@@ -391,6 +391,8 @@ void EditorPropertyArray::update_property() {
 			paginator->connect("page_changed", callable_mp(this, &EditorPropertyArray::_page_changed));
 			vbox->add_child(paginator);
 
+			_update_property_bg();
+
 			for (int i = 0; i < page_length; i++) {
 				_create_new_property_slot();
 			}
@@ -452,6 +454,7 @@ void EditorPropertyArray::update_property() {
 			memdelete(container);
 			button_add_item = nullptr;
 			container = nullptr;
+			_update_property_bg();
 			slots.clear();
 		}
 	}
@@ -625,6 +628,10 @@ Node *EditorPropertyArray::get_base_node() {
 void EditorPropertyArray::_notification(int p_what) {
 	switch (p_what) {
 		case NOTIFICATION_THEME_CHANGED:
+			if (EditorThemeManager::is_generated_theme_outdated()) {
+				_update_property_bg();
+			}
+			[[fallthrough]];
 		case NOTIFICATION_ENTER_TREE: {
 			change_type->clear();
 			for (int i = 0; i < Variant::VARIANT_MAX; i++) {
@@ -815,6 +822,10 @@ void EditorPropertyArray::_reorder_button_up() {
 	_page_changed(page_index);
 }
 
+bool EditorPropertyArray::is_colored(ColorationMode p_mode) {
+	return p_mode == COLORATION_CONTAINER_RESOURCE;
+}
+
 void EditorPropertyArray::_bind_methods() {
 }
 
@@ -974,8 +985,7 @@ void EditorPropertyDictionary::update_property() {
 		updating = true;
 
 		if (!container) {
-			container = memnew(MarginContainer);
-			container->set_theme_type_variation("MarginContainer4px");
+			container = memnew(PanelContainer);
 			container->set_mouse_filter(MOUSE_FILTER_STOP);
 			add_child(container);
 			set_bottom_editor(container);
@@ -990,6 +1000,7 @@ void EditorPropertyDictionary::update_property() {
 			paginator = memnew(EditorPaginator);
 			paginator->connect("page_changed", callable_mp(this, &EditorPropertyDictionary::_page_changed));
 			vbox->add_child(paginator);
+			_update_property_bg();
 
 			for (int i = 0; i < page_length; i++) {
 				_create_new_property_slot(slots.size());
@@ -997,7 +1008,7 @@ void EditorPropertyDictionary::update_property() {
 
 			add_panel = memnew(PanelContainer);
 			property_vbox->add_child(add_panel);
-			add_panel->add_theme_style_override(SNAME("panel"), get_theme_stylebox(SNAME("DictionaryAddItem"), EditorStringName(EditorStyles)));
+			add_panel->add_theme_style_override(SNAME("panel"), get_theme_stylebox(SNAME("DictionaryAddItem")));
 			VBoxContainer *add_vbox = memnew(VBoxContainer);
 			add_panel->add_child(add_vbox);
 
@@ -1064,6 +1075,7 @@ void EditorPropertyDictionary::update_property() {
 			memdelete(container);
 			button_add_item = nullptr;
 			container = nullptr;
+			_update_property_bg();
 			add_panel = nullptr;
 			slots.clear();
 		}
@@ -1077,6 +1089,10 @@ void EditorPropertyDictionary::_object_id_selected(const StringName &p_property,
 void EditorPropertyDictionary::_notification(int p_what) {
 	switch (p_what) {
 		case NOTIFICATION_THEME_CHANGED:
+			if (EditorThemeManager::is_generated_theme_outdated()) {
+				_update_property_bg();
+			}
+			[[fallthrough]];
 		case NOTIFICATION_ENTER_TREE: {
 			change_type->clear();
 			for (int i = 0; i < Variant::VARIANT_MAX; i++) {
@@ -1127,6 +1143,10 @@ void EditorPropertyDictionary::_page_changed(int p_page) {
 void EditorPropertyDictionary::_bind_methods() {
 }
 
+bool EditorPropertyDictionary::is_colored(ColorationMode p_mode) {
+	return p_mode == COLORATION_CONTAINER_RESOURCE;
+}
+
 EditorPropertyDictionary::EditorPropertyDictionary() {
 	object.instantiate();
 	page_length = int(EDITOR_GET("interface/inspector/max_array_dictionary_items_per_page"));
diff --git a/editor/editor_properties_array_dict.h b/editor/editor_properties_array_dict.h
index b00f85c93c..8b939ab0b0 100644
--- a/editor/editor_properties_array_dict.h
+++ b/editor/editor_properties_array_dict.h
@@ -113,7 +113,7 @@ class EditorPropertyArray : public EditorProperty {
 	int page_index = 0;
 	int changing_type_index;
 	Button *edit = nullptr;
-	MarginContainer *container = nullptr;
+	PanelContainer *container = nullptr;
 	VBoxContainer *property_vbox = nullptr;
 	EditorSpinSlider *size_slider = nullptr;
 	Button *button_add_item = nullptr;
@@ -165,6 +165,7 @@ protected:
 public:
 	void setup(Variant::Type p_array_type, const String &p_hint_string = "");
 	virtual void update_property() override;
+	virtual bool is_colored(ColorationMode p_mode) override;
 	EditorPropertyArray();
 };
 
@@ -207,7 +208,7 @@ class EditorPropertyDictionary : public EditorProperty {
 	int page_index = 0;
 	int changing_type_index;
 	Button *edit = nullptr;
-	MarginContainer *container = nullptr;
+	PanelContainer *container = nullptr;
 	VBoxContainer *property_vbox = nullptr;
 	PanelContainer *add_panel = nullptr;
 	EditorSpinSlider *size_sliderv = nullptr;
@@ -233,6 +234,7 @@ protected:
 public:
 	void setup(PropertyHint p_hint);
 	virtual void update_property() override;
+	virtual bool is_colored(ColorationMode p_mode) override;
 	EditorPropertyDictionary();
 };
 
diff --git a/editor/editor_settings.cpp b/editor/editor_settings.cpp
index 03745c10f7..f3c5bf2ea8 100644
--- a/editor/editor_settings.cpp
+++ b/editor/editor_settings.cpp
@@ -479,6 +479,8 @@ void EditorSettings::_load_defaults(Ref<ConfigFile> p_extra_config) {
 	EDITOR_SETTING(Variant::INT, PROPERTY_HINT_RANGE, "interface/inspector/max_array_dictionary_items_per_page", 20, "10,100,1")
 	EDITOR_SETTING(Variant::BOOL, PROPERTY_HINT_NONE, "interface/inspector/show_low_level_opentype_features", false, "")
 	EDITOR_SETTING(Variant::FLOAT, PROPERTY_HINT_RANGE, "interface/inspector/float_drag_speed", 5.0, "0.1,100,0.01")
+	EDITOR_SETTING(Variant::INT, PROPERTY_HINT_ENUM, "interface/inspector/nested_color_mode", 0, "Containers & Resources,Resources,External Resources")
+	EDITOR_SETTING(Variant::BOOL, PROPERTY_HINT_NONE, "interface/inspector/delimitate_all_container_and_resources", true, "")
 	EDITOR_SETTING_USAGE(Variant::INT, PROPERTY_HINT_ENUM, "interface/inspector/default_property_name_style", EditorPropertyNameProcessor::STYLE_CAPITALIZED, "Raw,Capitalized,Localized", PROPERTY_USAGE_DEFAULT | PROPERTY_USAGE_RESTART_IF_CHANGED);
 	// The lowest value is equal to the minimum float step for 32-bit floats.
 	// The step must be set manually, as changing this setting should not change the step here.
diff --git a/editor/themes/editor_theme_manager.cpp b/editor/themes/editor_theme_manager.cpp
index 6151cb4b74..ddacce6270 100644
--- a/editor/themes/editor_theme_manager.cpp
+++ b/editor/themes/editor_theme_manager.cpp
@@ -2036,36 +2036,6 @@ void EditorThemeManager::_populate_editor_styles(const Ref<EditorTheme> &p_theme
 
 	// Editor inspector.
 	{
-		// Sub-inspectors.
-		for (int i = 0; i < 16; i++) {
-			Color si_base_color = p_config.accent_color;
-
-			float hue_rotate = (i * 2 % 16) / 16.0;
-			si_base_color.set_hsv(Math::fmod(float(si_base_color.get_h() + hue_rotate), float(1.0)), si_base_color.get_s(), si_base_color.get_v());
-			si_base_color = p_config.accent_color.lerp(si_base_color, p_config.subresource_hue_tint);
-
-			// Sub-inspector background.
-			Ref<StyleBoxFlat> sub_inspector_bg = p_config.base_style->duplicate();
-			sub_inspector_bg->set_bg_color(p_config.dark_color_1.lerp(si_base_color, 0.08));
-			sub_inspector_bg->set_border_width_all(2 * EDSCALE);
-			sub_inspector_bg->set_border_color(si_base_color * Color(0.7, 0.7, 0.7, 0.8));
-			sub_inspector_bg->set_content_margin_all(4 * EDSCALE);
-			sub_inspector_bg->set_corner_radius(CORNER_TOP_LEFT, 0);
-			sub_inspector_bg->set_corner_radius(CORNER_TOP_RIGHT, 0);
-
-			p_theme->set_stylebox("sub_inspector_bg" + itos(i), EditorStringName(Editor), sub_inspector_bg);
-
-			// EditorProperty background while it has a sub-inspector open.
-			Ref<StyleBoxFlat> bg_color = make_flat_stylebox(si_base_color * Color(0.7, 0.7, 0.7, 0.8), 0, 0, 0, 0, p_config.corner_radius);
-			bg_color->set_anti_aliased(false);
-			bg_color->set_corner_radius(CORNER_BOTTOM_LEFT, 0);
-			bg_color->set_corner_radius(CORNER_BOTTOM_RIGHT, 0);
-
-			p_theme->set_stylebox("sub_inspector_property_bg" + itos(i), EditorStringName(Editor), bg_color);
-		}
-
-		p_theme->set_color("sub_inspector_property_color", EditorStringName(Editor), p_config.dark_theme ? Color(1, 1, 1, 1) : Color(0, 0, 0, 1));
-
 		// EditorProperty.
 
 		Ref<StyleBoxFlat> style_property_bg = p_config.base_style->duplicate();
@@ -2125,13 +2095,79 @@ void EditorThemeManager::_populate_editor_styles(const Ref<EditorTheme> &p_theme
 
 		p_theme->set_constant("inspector_margin", EditorStringName(Editor), 12 * EDSCALE);
 
+		// Colored EditorProperty.
+		for (int i = 0; i < 16; i++) {
+			Color si_base_color = p_config.accent_color;
+
+			float hue_rotate = (i * 2 % 16) / 16.0;
+			si_base_color.set_hsv(Math::fmod(float(si_base_color.get_h() + hue_rotate), float(1.0)), si_base_color.get_s(), si_base_color.get_v());
+			si_base_color = p_config.accent_color.lerp(si_base_color, p_config.subresource_hue_tint);
+
+			// Sub-inspector background.
+			Ref<StyleBoxFlat> sub_inspector_bg = p_config.base_style->duplicate();
+			sub_inspector_bg->set_bg_color(p_config.dark_color_1.lerp(si_base_color, 0.08));
+			sub_inspector_bg->set_border_width_all(2 * EDSCALE);
+			sub_inspector_bg->set_border_color(si_base_color * Color(0.7, 0.7, 0.7, 0.8));
+			sub_inspector_bg->set_content_margin_all(4 * EDSCALE);
+			sub_inspector_bg->set_corner_radius(CORNER_TOP_LEFT, 0);
+			sub_inspector_bg->set_corner_radius(CORNER_TOP_RIGHT, 0);
+
+			p_theme->set_stylebox("sub_inspector_bg" + itos(i + 1), EditorStringName(EditorStyles), sub_inspector_bg);
+
+			// EditorProperty background while it has a sub-inspector open.
+			Ref<StyleBoxFlat> bg_color = make_flat_stylebox(si_base_color * Color(0.7, 0.7, 0.7, 0.8), 0, 0, 0, 0, p_config.corner_radius);
+			bg_color->set_anti_aliased(false);
+			bg_color->set_corner_radius(CORNER_BOTTOM_LEFT, 0);
+			bg_color->set_corner_radius(CORNER_BOTTOM_RIGHT, 0);
+
+			p_theme->set_stylebox("sub_inspector_property_bg" + itos(i + 1), EditorStringName(EditorStyles), bg_color);
+
+			// Dictionary editor add item.
+			// Expand to the left and right by 4px to compensate for the dictionary editor margins.
+
+			Color style_dictionary_bg_color = p_config.dark_color_3.lerp(si_base_color, 0.08);
+			Ref<StyleBoxFlat> style_dictionary_add_item = make_flat_stylebox(style_dictionary_bg_color, 0, 4, 0, 4, p_config.corner_radius);
+			style_dictionary_add_item->set_expand_margin(SIDE_LEFT, 2 * EDSCALE);
+			style_dictionary_add_item->set_expand_margin(SIDE_RIGHT, 2 * EDSCALE);
+			p_theme->set_stylebox("DictionaryAddItem" + itos(i + 1), EditorStringName(EditorStyles), style_dictionary_add_item);
+		}
+		Color si_base_color = p_config.accent_color;
+
+		// Sub-inspector background.
+		Ref<StyleBoxFlat> sub_inspector_bg = p_config.base_style->duplicate();
+		sub_inspector_bg->set_bg_color(Color(1, 1, 1, 0));
+		sub_inspector_bg->set_border_width_all(2 * EDSCALE);
+		sub_inspector_bg->set_border_color(p_config.dark_color_1.lerp(si_base_color, 0.15));
+		sub_inspector_bg->set_content_margin_all(4 * EDSCALE);
+		sub_inspector_bg->set_corner_radius(CORNER_TOP_LEFT, 0);
+		sub_inspector_bg->set_corner_radius(CORNER_TOP_RIGHT, 0);
+
+		p_theme->set_stylebox("sub_inspector_bg0", EditorStringName(EditorStyles), sub_inspector_bg);
+
+		// Sub-inspector background no border.
+
+		Ref<StyleBoxFlat> sub_inspector_bg_no_border = p_config.base_style->duplicate();
+		sub_inspector_bg_no_border->set_content_margin_all(2 * EDSCALE);
+		sub_inspector_bg_no_border->set_bg_color(p_config.dark_color_2.lerp(p_config.dark_color_3, 0.15));
+		p_theme->set_stylebox("sub_inspector_bg_no_border", EditorStringName(EditorStyles), sub_inspector_bg_no_border);
+
+		// EditorProperty background while it has a sub-inspector open.
+		Ref<StyleBoxFlat> bg_color = make_flat_stylebox(p_config.dark_color_1.lerp(si_base_color, 0.15), 0, 0, 0, 0, p_config.corner_radius);
+		bg_color->set_anti_aliased(false);
+		bg_color->set_corner_radius(CORNER_BOTTOM_LEFT, 0);
+		bg_color->set_corner_radius(CORNER_BOTTOM_RIGHT, 0);
+
+		p_theme->set_stylebox("sub_inspector_property_bg0", EditorStringName(EditorStyles), bg_color);
+
+		p_theme->set_color("sub_inspector_property_color", EditorStringName(EditorStyles), p_config.dark_theme ? Color(1, 1, 1, 1) : Color(0, 0, 0, 1));
+
 		// Dictionary editor.
 
 		// Expand to the left and right by 4px to compensate for the dictionary editor margins.
 		Ref<StyleBoxFlat> style_dictionary_add_item = make_flat_stylebox(prop_subsection_color, 0, 4, 0, 4, p_config.corner_radius);
-		style_dictionary_add_item->set_expand_margin(SIDE_LEFT, 4 * EDSCALE);
-		style_dictionary_add_item->set_expand_margin(SIDE_RIGHT, 4 * EDSCALE);
-		p_theme->set_stylebox("DictionaryAddItem", EditorStringName(EditorStyles), style_dictionary_add_item);
+		style_dictionary_add_item->set_expand_margin(SIDE_LEFT, 2 * EDSCALE);
+		style_dictionary_add_item->set_expand_margin(SIDE_RIGHT, 2 * EDSCALE);
+		p_theme->set_stylebox("DictionaryAddItem0", EditorStringName(EditorStyles), style_dictionary_add_item);
 	}
 
 	// Editor help.