Collection Manager: Fix Override Display. Task: T69577

Fix the layout and display of theme overrides for the
OpenGL move widget in the preferences.

2 files changed, 158 insertions, 108 deletions

diff --git a/object_collection_manager/__init__.py b/object_collection_manager/__init__.py
index bc62e947..9ccc3d45 100644
--- a/object_collection_manager/__init__.py
+++ b/object_collection_manager/__init__.py
@@ -22,7 +22,7 @@ bl_info = {
     "name": "Collection Manager",
     "description": "Manage collections and their objects",
     "author": "Ryan Inch",
-    "version": (2, 17, 1),
+    "version": (2, 17, 2),
     "blender": (2, 80, 0),
     "location": "View3D - Object Mode (Shortcut - M)",
     "warning": '',  # used for warning icon and text in addons panel
diff --git a/object_collection_manager/preferences.py b/object_collection_manager/preferences.py
index d155b9ce..de9e7d65 100644
--- a/object_collection_manager/preferences.py
+++ b/object_collection_manager/preferences.py
@@ -436,59 +436,81 @@ class CMPreferences(AddonPreferences):
 
         box.row().label(text="QCD Move Widget")
 
+        # TOOL OVERRIDES
         tool_box = box.box()
         tool_box.row().label(text="Tool Theme Overrides:")
-        tool_box.use_property_split = True
-
-        flow = tool_box.grid_flow(row_major=False, columns=2, even_columns=True, even_rows=False, align=False)
-
-        col = flow.column()
-        col.alignment = 'LEFT'
-
-        row = col.row(align=True)
-        row.alignment = 'RIGHT'
-        row.prop(self, "tool_text_override")
-        row = row.row(align=True)
-        row.alignment = 'RIGHT'
-        row.enabled = self.tool_text_override
-        row.prop(self, "qcd_ogl_widget_tool_text")
-
-        row = col.row(align=True)
-        row.alignment = 'RIGHT'
-        row.prop(self, "tool_text_sel_override")
-        row = row.row(align=True)
-        row.alignment = 'RIGHT'
-        row.enabled = self.tool_text_sel_override
-        row.prop(self, "qcd_ogl_widget_tool_text_sel")
-
-        col = flow.column()
+
+        overrides = tool_box.split(align=True)
+
+        # Column 1
+        col = overrides.column()
+        col.alignment = 'RIGHT'
+
+        # Text
+        override = col.row(align=True)
+        override.alignment = 'RIGHT'
+        checkbox = override.row(align=True)
+        checkbox.alignment = 'RIGHT'
+        checkbox.label(text="Text")
+        checkbox.prop(self, "tool_text_override", text="")
+        color_picker = override.row(align=True)
+        color_picker.alignment = 'RIGHT'
+        color_picker.enabled = self.tool_text_override
+        color_picker.prop(self, "qcd_ogl_widget_tool_text")
+
+        # Text Selection
+        override = col.row(align=True)
+        override.alignment = 'RIGHT'
+        checkbox = override.row(align=True)
+        checkbox.alignment = 'RIGHT'
+        checkbox.label(text="Selection")
+        checkbox.prop(self, "tool_text_sel_override", text="")
+        color_picker = override.row(align=True)
+        color_picker.alignment = 'RIGHT'
+        color_picker.enabled = self.tool_text_sel_override
+        color_picker.prop(self, "qcd_ogl_widget_tool_text_sel")
+
+        # Column 2
+        col = overrides.column()
         col.alignment = 'RIGHT'
 
-        row = col.row()
-        row.alignment = 'RIGHT'
-        row.prop(self, "tool_inner_override")
-        row = row.row(align=True)
-        row.alignment = 'RIGHT'
-        row.enabled = self.tool_inner_override
-        row.prop(self, "qcd_ogl_widget_tool_inner")
-
-        row = col.row()
-        row.alignment = 'RIGHT'
-        row.prop(self, "tool_inner_sel_override")
-        row = row.row(align=True)
-        row.alignment = 'RIGHT'
-        row.enabled = self.tool_inner_sel_override
-        row.prop(self, "qcd_ogl_widget_tool_inner_sel")
-
-        row = col.row()
-        row.alignment = 'RIGHT'
-        row.prop(self, "tool_outline_override")
-        row = row.row(align=True)
-        row.alignment = 'RIGHT'
-        row.enabled = self.tool_outline_override
-        row.prop(self, "qcd_ogl_widget_tool_outline")
-
-        tool_box.use_property_split = False
+        # Inner
+        override = col.row(align=True)
+        override.alignment = 'RIGHT'
+        checkbox = override.row(align=True)
+        checkbox.alignment = 'RIGHT'
+        checkbox.label(text="Inner")
+        checkbox.prop(self, "tool_inner_override", text="")
+        color_picker = override.row(align=True)
+        color_picker.alignment = 'RIGHT'
+        color_picker.enabled = self.tool_inner_override
+        color_picker.prop(self, "qcd_ogl_widget_tool_inner")
+
+        # Inner Selection
+        override = col.row(align=True)
+        override.alignment = 'RIGHT'
+        checkbox = override.row(align=True)
+        checkbox.alignment = 'RIGHT'
+        checkbox.label(text="Selection")
+        checkbox.prop(self, "tool_inner_sel_override", text="")
+        color_picker = override.row(align=True)
+        color_picker.alignment = 'RIGHT'
+        color_picker.enabled = self.tool_inner_sel_override
+        color_picker.prop(self, "qcd_ogl_widget_tool_inner_sel")
+
+        # Outline
+        override = col.row(align=True)
+        override.alignment = 'RIGHT'
+        checkbox = override.row(align=True)
+        checkbox.alignment = 'RIGHT'
+        checkbox.label(text="Outline")
+        checkbox.prop(self, "tool_outline_override", text="")
+        color_picker = override.row(align=True)
+        color_picker.alignment = 'RIGHT'
+        color_picker.enabled = self.tool_outline_override
+        color_picker.prop(self, "qcd_ogl_widget_tool_outline")
+
+        # Icon Alpha
         tool_box.row().label(text="Icon Alpha:")
         icon_fade_row = tool_box.row()
         icon_fade_row.alignment = 'EXPAND'
@@ -496,75 +518,103 @@ class CMPreferences(AddonPreferences):
         icon_fade_row.prop(self, "qcd_ogl_objects_icon_alpha", text="Objects")
 
 
+        # MENU BACK OVERRIDES
         menu_back_box = box.box()
-        menu_back_box.use_property_split = True
         menu_back_box.row().label(text="Menu Back Theme Overrides:")
 
-        flow = menu_back_box.grid_flow(row_major=False, columns=2, even_columns=True, even_rows=False, align=False)
-
-        col = flow.column()
-        col.alignment = 'LEFT'
-
-        row = col.row(align=True)
-        row.alignment = 'RIGHT'
-        row.prop(self, "menu_back_text_override")
-        row = row.row(align=True)
-        row.alignment = 'RIGHT'
-        row.enabled = self.menu_back_text_override
-        row.prop(self, "qcd_ogl_widget_menu_back_text")
+        overrides = menu_back_box.split(align=True)
 
-        col = flow.column()
+        # Column 1
+        col = overrides.column()
         col.alignment = 'RIGHT'
 
-        row = col.row()
-        row.alignment = 'RIGHT'
-        row.prop(self, "menu_back_inner_override")
-        row = row.row(align=True)
-        row.alignment = 'RIGHT'
-        row.enabled = self.menu_back_inner_override
-        row.prop(self, "qcd_ogl_widget_menu_back_inner")
-
-        row = col.row()
-        row.alignment = 'RIGHT'
-        row.prop(self, "menu_back_outline_override")
-        row = row.row(align=True)
-        row.alignment = 'RIGHT'
-        row.enabled = self.menu_back_outline_override
-        row.prop(self, "qcd_ogl_widget_menu_back_outline")
-
+        # Text
+        override = col.row(align=True)
+        override.alignment = 'RIGHT'
+        checkbox = override.row(align=True)
+        checkbox.alignment = 'RIGHT'
+        checkbox.label(text="Text")
+        checkbox.prop(self, "menu_back_text_override", text="")
+        color_picker = override.row(align=True)
+        color_picker.alignment = 'RIGHT'
+        color_picker.enabled = self.menu_back_text_override
+        color_picker.prop(self, "qcd_ogl_widget_menu_back_text")
+
+        # Column 2
+        col = overrides.column()
+        col.alignment = 'RIGHT'
 
+        # Inner
+        override = col.row(align=True)
+        override.alignment = 'RIGHT'
+        checkbox = override.row(align=True)
+        checkbox.alignment = 'RIGHT'
+        checkbox.label(text="Inner")
+        checkbox.prop(self, "menu_back_inner_override", text="")
+        color_picker = override.row(align=True)
+        color_picker.alignment = 'RIGHT'
+        color_picker.enabled = self.menu_back_inner_override
+        color_picker.prop(self, "qcd_ogl_widget_menu_back_inner")
+
+        # Outline
+        override = col.row(align=True)
+        override.alignment = 'RIGHT'
+        checkbox = override.row(align=True)
+        checkbox.alignment = 'RIGHT'
+        checkbox.label(text="Outline")
+        checkbox.prop(self, "menu_back_outline_override", text="")
+        color_picker = override.row(align=True)
+        color_picker.alignment = 'RIGHT'
+        color_picker.enabled = self.menu_back_outline_override
+        color_picker.prop(self, "qcd_ogl_widget_menu_back_outline")
+
+
+        # TOOLTIP OVERRIDES
         tooltip_box = box.box()
-        tooltip_box.use_property_split = True
         tooltip_box.row().label(text="Tooltip Theme Overrides:")
 
-        flow = tooltip_box.grid_flow(row_major=False, columns=2, even_columns=True, even_rows=False, align=False)
+        overrides = tooltip_box.split(align=True)
 
-        col = flow.column()
-        col.alignment = 'LEFT'
-
-        row = col.row(align=True)
-        row.alignment = 'RIGHT'
-        row.prop(self, "tooltip_text_override")
-        row = row.row(align=True)
-        row.alignment = 'RIGHT'
-        row.enabled = self.tooltip_text_override
-        row.prop(self, "qcd_ogl_widget_tooltip_text")
+        # Column 1
+        col = overrides.column()
+        col.alignment = 'RIGHT'
 
-        col = flow.column()
+        # Text
+        override = col.row(align=True)
+        override.alignment = 'RIGHT'
+        checkbox = override.row(align=True)
+        checkbox.alignment = 'RIGHT'
+        checkbox.label(text="Text")
+        checkbox.prop(self, "tooltip_text_override", text="")
+        color_picker = override.row(align=True)
+        color_picker.alignment = 'RIGHT'
+        color_picker.enabled = self.tooltip_text_override
+        color_picker.prop(self, "qcd_ogl_widget_tooltip_text")
+
+        # Column 2
+        col = overrides.column()
         col.alignment = 'RIGHT'
 
-        row = col.row()
-        row.alignment = 'RIGHT'
-        row.prop(self, "tooltip_inner_override")
-        row = row.row(align=True)
-        row.alignment = 'RIGHT'
-        row.enabled = self.tooltip_inner_override
-        row.prop(self, "qcd_ogl_widget_tooltip_inner")
-
-        row = col.row()
-        row.alignment = 'RIGHT'
-        row.prop(self, "tooltip_outline_override")
-        row = row.row(align=True)
-        row.alignment = 'RIGHT'
-        row.enabled = self.tooltip_outline_override
-        row.prop(self, "qcd_ogl_widget_tooltip_outline")
+        # Inner
+        override = col.row(align=True)
+        override.alignment = 'RIGHT'
+        checkbox = override.row(align=True)
+        checkbox.alignment = 'RIGHT'
+        checkbox.label(text="Inner")
+        checkbox.prop(self, "tooltip_inner_override", text="")
+        color_picker = override.row(align=True)
+        color_picker.alignment = 'RIGHT'
+        color_picker.enabled = self.tooltip_inner_override
+        color_picker.prop(self, "qcd_ogl_widget_tooltip_inner")
+
+        # Outline
+        override = col.row(align=True)
+        override.alignment = 'RIGHT'
+        checkbox = override.row(align=True)
+        checkbox.alignment = 'RIGHT'
+        checkbox.label(text="Outline")
+        checkbox.prop(self, "tooltip_outline_override", text="")
+        color_picker = override.row(align=True)
+        color_picker.alignment = 'RIGHT'
+        color_picker.enabled = self.tooltip_outline_override
+        color_picker.prop(self, "qcd_ogl_widget_tooltip_outline")