Add Black (OLED) editor theme preset

This preset uses a fully black background to reduce power usage on OLED
displays, leading to increased battery life on laptops with OLED displays.

This preset is also useful for late night sessions, as OLED displays
have a near-infinite contrast ratio.

This also adds a Draw Extra Borders editor setting which draws borders
around some interactive nodes. This setting is required for good
usability of a theme with a fully black background.

Visibility of disabled text (including unselected tab names) has been
slightly increased for better accessibility, regardless of the editor
theme preset in use.

4 files changed, 69 insertions, 14 deletions

diff --git a/doc/classes/EditorSettings.xml b/doc/classes/EditorSettings.xml
index 818dda59bc..944ad120b6 100644
--- a/doc/classes/EditorSettings.xml
+++ b/doc/classes/EditorSettings.xml
@@ -592,6 +592,9 @@
 		<member name="interface/theme/custom_theme" type="String" setter="" getter="">
 			The custom theme resource to use for the editor. Must be a Godot theme resource in [code].tres[/code] or [code].res[/code] format.
 		</member>
+		<member name="interface/theme/draw_extra_borders" type="bool" setter="" getter="">
+			If [code]true[/code], draws additional borders around interactive UI elements in the editor. This is automatically enabled when using the [b]Black (OLED)[/b] theme preset, as this theme preset uses a fully black background.
+		</member>
 		<member name="interface/theme/icon_and_font_color" type="int" setter="" getter="">
 			The icon and font color scheme to use in the editor.
 			- [b]Auto[/b] determines the color scheme to use automatically based on [member interface/theme/base_color].
diff --git a/editor/editor_settings.cpp b/editor/editor_settings.cpp
index 5bdfd8d377..e7ba33d7ab 100644
--- a/editor/editor_settings.cpp
+++ b/editor/editor_settings.cpp
@@ -452,11 +452,12 @@ void EditorSettings::_load_defaults(Ref<ConfigFile> p_extra_config) {
 	EDITOR_SETTING(Variant::BOOL, PROPERTY_HINT_NONE, "interface/inspector/show_low_level_opentype_features", false, "")
 
 	// Theme
-	EDITOR_SETTING(Variant::STRING, PROPERTY_HINT_ENUM, "interface/theme/preset", "Default", "Default,Breeze Dark,Godot 2,Gray,Light,Solarized (Dark),Solarized (Light),Custom")
+	EDITOR_SETTING(Variant::STRING, PROPERTY_HINT_ENUM, "interface/theme/preset", "Default", "Default,Breeze Dark,Godot 2,Gray,Light,Solarized (Dark),Solarized (Light),Black (OLED),Custom")
 	EDITOR_SETTING(Variant::INT, PROPERTY_HINT_ENUM, "interface/theme/icon_and_font_color", 0, "Auto,Dark,Light")
 	EDITOR_SETTING(Variant::COLOR, PROPERTY_HINT_NONE, "interface/theme/base_color", Color(0.2, 0.23, 0.31), "")
 	EDITOR_SETTING(Variant::COLOR, PROPERTY_HINT_NONE, "interface/theme/accent_color", Color(0.41, 0.61, 0.91), "")
 	EDITOR_SETTING(Variant::FLOAT, PROPERTY_HINT_RANGE, "interface/theme/contrast", 0.3, "-1,1,0.01")
+	EDITOR_SETTING(Variant::BOOL, PROPERTY_HINT_NONE, "interface/theme/draw_extra_borders", false, "")
 	EDITOR_SETTING(Variant::FLOAT, PROPERTY_HINT_RANGE, "interface/theme/icon_saturation", 1.0, "0,2,0.01")
 	EDITOR_SETTING(Variant::FLOAT, PROPERTY_HINT_RANGE, "interface/theme/relationship_line_opacity", 0.1, "0.00,1,0.01")
 	EDITOR_SETTING(Variant::INT, PROPERTY_HINT_RANGE, "interface/theme/border_size", 0, "0,2,1")
diff --git a/editor/editor_settings_dialog.cpp b/editor/editor_settings_dialog.cpp
index db501aac03..1b904b7ccd 100644
--- a/editor/editor_settings_dialog.cpp
+++ b/editor/editor_settings_dialog.cpp
@@ -61,7 +61,7 @@ void EditorSettingsDialog::_settings_changed() {
 void EditorSettingsDialog::_settings_property_edited(const String &p_name) {
 	String full_name = inspector->get_full_item_path(p_name);
 
-	if (full_name == "interface/theme/accent_color" || full_name == "interface/theme/base_color" || full_name == "interface/theme/contrast") {
+	if (full_name == "interface/theme/accent_color" || full_name == "interface/theme/base_color" || full_name == "interface/theme/contrast" || full_name == "interface/theme/draw_extra_borders") {
 		EditorSettings::get_singleton()->set_manually("interface/theme/preset", "Custom"); // set preset to Custom
 	} else if (full_name.begins_with("text_editor/theme/highlighting")) {
 		EditorSettings::get_singleton()->set_manually("text_editor/theme/color_theme", "Custom");
diff --git a/editor/editor_themes.cpp b/editor/editor_themes.cpp
index 1d9e320be1..f589f0f714 100644
--- a/editor/editor_themes.cpp
+++ b/editor/editor_themes.cpp
@@ -392,6 +392,7 @@ Ref<Theme> create_editor_theme(const Ref<Theme> p_theme) {
 	Color accent_color = EDITOR_GET("interface/theme/accent_color");
 	Color base_color = EDITOR_GET("interface/theme/base_color");
 	float contrast = EDITOR_GET("interface/theme/contrast");
+	bool draw_extra_borders = EDITOR_GET("interface/theme/draw_extra_borders");
 	float icon_saturation = EDITOR_GET("interface/theme/icon_saturation");
 	float relationship_line_opacity = EDITOR_GET("interface/theme/relationship_line_opacity");
 
@@ -403,6 +404,7 @@ Ref<Theme> create_editor_theme(const Ref<Theme> p_theme) {
 	Color preset_accent_color;
 	Color preset_base_color;
 	float preset_contrast = 0;
+	bool preset_draw_extra_borders = false;
 
 	const float default_contrast = 0.3;
 
@@ -439,6 +441,12 @@ Ref<Theme> create_editor_theme(const Ref<Theme> p_theme) {
 		preset_base_color = Color(0.89, 0.86, 0.79);
 		// A negative contrast rate looks better for light themes, since it better follows the natural order of UI "elevation".
 		preset_contrast = -0.08;
+	} else if (preset == "Black (OLED)") {
+		preset_accent_color = Color(0.45, 0.75, 1.0);
+		preset_base_color = Color(0, 0, 0);
+		// The contrast rate value is irrelevant on a fully black theme.
+		preset_contrast = 0.0;
+		preset_draw_extra_borders = true;
 	} else { // Default
 		preset_accent_color = Color(0.44, 0.73, 0.98);
 		preset_base_color = Color(0.21, 0.24, 0.29);
@@ -449,15 +457,18 @@ Ref<Theme> create_editor_theme(const Ref<Theme> p_theme) {
 		accent_color = preset_accent_color;
 		base_color = preset_base_color;
 		contrast = preset_contrast;
+		draw_extra_borders = preset_draw_extra_borders;
 		EditorSettings::get_singleton()->set_initial_value("interface/theme/accent_color", accent_color);
 		EditorSettings::get_singleton()->set_initial_value("interface/theme/base_color", base_color);
 		EditorSettings::get_singleton()->set_initial_value("interface/theme/contrast", contrast);
+		EditorSettings::get_singleton()->set_initial_value("interface/theme/draw_extra_borders", draw_extra_borders);
 	}
 
 	EditorSettings::get_singleton()->set_manually("interface/theme/preset", preset);
 	EditorSettings::get_singleton()->set_manually("interface/theme/accent_color", accent_color);
 	EditorSettings::get_singleton()->set_manually("interface/theme/base_color", base_color);
 	EditorSettings::get_singleton()->set_manually("interface/theme/contrast", contrast);
+	EditorSettings::get_singleton()->set_manually("interface/theme/draw_extra_borders", draw_extra_borders);
 
 	// Colors
 	bool dark_theme = EditorSettings::get_singleton()->is_dark_theme();
@@ -476,6 +487,10 @@ Ref<Theme> create_editor_theme(const Ref<Theme> p_theme) {
 	const Color dark_color_2 = base_color.lerp(Color(0, 0, 0, 1), contrast * 1.5).clamp();
 	const Color dark_color_3 = base_color.lerp(Color(0, 0, 0, 1), contrast * 2).clamp();
 
+	// Only used when the Draw Extra Borders editor setting is enabled.
+	const Color extra_border_color_1 = Color(0.5, 0.5, 0.5);
+	const Color extra_border_color_2 = dark_theme ? Color(0.3, 0.3, 0.3) : Color(0.7, 0.7, 0.7);
+
 	const Color background_color = dark_color_2;
 
 	// White (dark theme) or black (light theme), will be used to generate the rest of the colors
@@ -488,7 +503,7 @@ Ref<Theme> create_editor_theme(const Ref<Theme> p_theme) {
 	const Color font_hover_color = mono_color.lerp(base_color, 0.125);
 	const Color font_focus_color = mono_color.lerp(base_color, 0.125);
 	const Color font_hover_pressed_color = font_hover_color.lerp(accent_color, 0.74);
-	const Color font_disabled_color = Color(mono_color.r, mono_color.g, mono_color.b, 0.3);
+	const Color font_disabled_color = Color(mono_color.r, mono_color.g, mono_color.b, 0.35);
 	const Color font_readonly_color = Color(mono_color.r, mono_color.g, mono_color.b, 0.65);
 	const Color font_placeholder_color = Color(mono_color.r, mono_color.g, mono_color.b, 0.6);
 	const Color selection_color = accent_color * Color(1, 1, 1, 0.4);
@@ -633,10 +648,19 @@ Ref<Theme> create_editor_theme(const Ref<Theme> p_theme) {
 	Ref<StyleBoxFlat> style_widget = style_default->duplicate();
 	style_widget->set_default_margin_individual(widget_default_margin.x, widget_default_margin.y, widget_default_margin.x, widget_default_margin.y);
 	style_widget->set_bg_color(dark_color_1);
-	style_widget->set_border_color(dark_color_2);
+	if (draw_extra_borders) {
+		style_widget->set_border_width_all(Math::round(EDSCALE));
+		style_widget->set_border_color(extra_border_color_1);
+	} else {
+		style_widget->set_border_color(dark_color_2);
+	}
 
 	Ref<StyleBoxFlat> style_widget_disabled = style_widget->duplicate();
-	style_widget_disabled->set_border_color(disabled_color);
+	if (draw_extra_borders) {
+		style_widget_disabled->set_border_color(extra_border_color_2);
+	} else {
+		style_widget_disabled->set_border_color(disabled_color);
+	}
 	style_widget_disabled->set_bg_color(disabled_bg_color);
 
 	Ref<StyleBoxFlat> style_widget_focus = style_widget->duplicate();
@@ -649,7 +673,11 @@ Ref<Theme> create_editor_theme(const Ref<Theme> p_theme) {
 
 	Ref<StyleBoxFlat> style_widget_hover = style_widget->duplicate();
 	style_widget_hover->set_bg_color(mono_color * Color(1, 1, 1, 0.11));
-	style_widget_hover->set_border_color(mono_color * Color(1, 1, 1, 0.05));
+	if (draw_extra_borders) {
+		style_widget_hover->set_border_color(extra_border_color_1);
+	} else {
+		style_widget_hover->set_border_color(mono_color * Color(1, 1, 1, 0.05));
+	}
 
 	// Style for windows, popups, etc..
 	Ref<StyleBoxFlat> style_popup = style_default->duplicate();
@@ -990,7 +1018,11 @@ Ref<Theme> create_editor_theme(const Ref<Theme> p_theme) {
 	style_popup_menu->set_default_margin_individual(EDSCALE, 2 * EDSCALE, EDSCALE, 2 * EDSCALE);
 	// Always display a border for PopupMenus so they can be distinguished from their background.
 	style_popup_menu->set_border_width_all(EDSCALE);
-	style_popup_menu->set_border_color(dark_color_2);
+	if (draw_extra_borders) {
+		style_popup_menu->set_border_color(extra_border_color_2);
+	} else {
+		style_popup_menu->set_border_color(dark_color_2);
+	}
 	theme->set_stylebox("panel", "PopupMenu", style_popup_menu);
 
 	Ref<StyleBoxFlat> style_menu_hover = style_widget_hover->duplicate();
@@ -1110,7 +1142,13 @@ Ref<Theme> create_editor_theme(const Ref<Theme> p_theme) {
 	Ref<StyleBoxFlat> style_tree_bg = style_default->duplicate();
 	// Make Trees easier to distinguish from other controls by using a darker background color.
 	style_tree_bg->set_bg_color(dark_color_1.lerp(dark_color_2, 0.5));
-	style_tree_bg->set_border_color(dark_color_3);
+	if (draw_extra_borders) {
+		style_tree_bg->set_border_width_all(Math::round(EDSCALE));
+		style_tree_bg->set_border_color(extra_border_color_2);
+	} else {
+		style_tree_bg->set_border_color(dark_color_3);
+	}
+
 	theme->set_stylebox("panel", "Tree", style_tree_bg);
 
 	// Tree
@@ -1206,8 +1244,14 @@ Ref<Theme> create_editor_theme(const Ref<Theme> p_theme) {
 	// ItemList
 	Ref<StyleBoxFlat> style_itemlist_bg = style_default->duplicate();
 	style_itemlist_bg->set_bg_color(dark_color_1);
-	style_itemlist_bg->set_border_width_all(border_width);
-	style_itemlist_bg->set_border_color(dark_color_3);
+
+	if (draw_extra_borders) {
+		style_itemlist_bg->set_border_width_all(Math::round(EDSCALE));
+		style_itemlist_bg->set_border_color(extra_border_color_2);
+	} else {
+		style_itemlist_bg->set_border_width_all(border_width);
+		style_itemlist_bg->set_border_color(dark_color_3);
+	}
 
 	Ref<StyleBoxFlat> style_itemlist_cursor = style_default->duplicate();
 	style_itemlist_cursor->set_draw_center(false);
@@ -1325,14 +1369,21 @@ Ref<Theme> create_editor_theme(const Ref<Theme> p_theme) {
 	// The original style_widget style has an extra 1 pixel offset that makes LineEdits not align with Buttons,
 	// so this compensates for that.
 	style_line_edit->set_default_margin(SIDE_TOP, style_line_edit->get_default_margin(SIDE_TOP) - 1 * EDSCALE);
-	// Add a bottom line to make LineEdits more visible, especially in sectioned inspectors
-	// such as the Project Settings.
-	style_line_edit->set_border_width(SIDE_BOTTOM, Math::round(2 * EDSCALE));
-	style_line_edit->set_border_color(dark_color_2);
+
 	// Don't round the bottom corner to make the line look sharper.
 	style_tab_selected->set_corner_radius(CORNER_BOTTOM_LEFT, 0);
 	style_tab_selected->set_corner_radius(CORNER_BOTTOM_RIGHT, 0);
 
+	if (draw_extra_borders) {
+		style_line_edit->set_border_width_all(Math::round(EDSCALE));
+		style_line_edit->set_border_color(extra_border_color_1);
+	} else {
+		// Add a bottom line to make LineEdits more visible, especially in sectioned inspectors
+		// such as the Project Settings.
+		style_line_edit->set_border_width(SIDE_BOTTOM, Math::round(2 * EDSCALE));
+		style_line_edit->set_border_color(dark_color_2);
+	}
+
 	Ref<StyleBoxFlat> style_line_edit_disabled = style_line_edit->duplicate();
 	style_line_edit_disabled->set_border_color(disabled_color);
 	style_line_edit_disabled->set_bg_color(disabled_bg_color);