Update roop/ui.json

roop/ui.json

@@ -1,139 +1,139 @@
 {
   "CTk": {
-    "fg_color": ["gray95", "gray10"]
+    "fg_color": ["gray95", "gray10"]  // Background color for the main container
   },
   "CTkToplevel": {
-    "fg_color": ["gray95", "gray10"]
+    "fg_color": ["gray95", "gray10"]  // Background color for top-level windows
   },
   "CTkFrame": {
     "corner_radius": 6,
     "border_width": 0,
-    "fg_color": ["gray90", "gray13"],
-    "top_fg_color": ["gray85", "gray16"],
-    "border_color": ["gray65", "gray28"]
+    "fg_color": ["gray90", "gray13"],  // Background color for frames
+    "top_fg_color": ["gray85", "gray16"],  // Color for the top part of frames
+    "border_color": ["gray65", "gray28"]  // Border color for frames
   },
   "CTkButton": {
     "corner_radius": 6,
     "border_width": 0,
-    "fg_color": ["#3a7ebf", "#1f538d"],
-    "hover_color": ["#325882", "#14375e"],
-    "border_color": ["#3E454A", "#949A9F"],
-    "text_color": ["#DCE4EE", "#DCE4EE"],
-    "text_color_disabled": ["gray74", "gray60"]
+    "fg_color": ["#3a7ebf", "#1f538d"],  // Background color for buttons
+    "hover_color": ["#325882", "#14375e"],  // Background color when hovered
+    "border_color": ["#3E454A", "#949A9F"],  // Border color for buttons
+    "text_color": ["#DCE4EE", "#DCE4EE"],  // Text color for buttons
+    "text_color_disabled": ["gray74", "gray60"]  // Text color for disabled buttons
   },
   "CTkLabel": {
     "corner_radius": 0,
-    "fg_color": "transparent",
-    "text_color": ["gray14", "gray84"]
+    "fg_color": "transparent",  // Background color for labels
+    "text_color": ["gray14", "gray84"]  // Text color for labels
   },
   "CTkEntry": {
     "corner_radius": 6,
     "border_width": 2,
-    "fg_color": ["#F9F9FA", "#343638"],
-    "border_color": ["#979DA2", "#565B5E"],
-    "text_color": ["gray14", "gray84"],
-    "placeholder_text_color": ["gray52", "gray62"]
+    "fg_color": ["#F9F9FA", "#343638"],  // Background color for entry fields
+    "border_color": ["#979DA2", "#565B5E"],  // Border color for entry fields
+    "text_color": ["gray14", "gray84"],  // Text color for entry fields
+    "placeholder_text_color": ["gray52", "gray62"]  // Placeholder text color
   },
   "CTkCheckbox": {
     "corner_radius": 6,
     "border_width": 3,
-    "fg_color": ["#3a7ebf", "#1f538d"],
-    "border_color": ["#3E454A", "#949A9F"],
-    "hover_color": ["#325882", "#14375e"],
-    "checkmark_color": ["#DCE4EE", "gray90"],
-    "text_color": ["gray14", "gray84"],
-    "text_color_disabled": ["gray60", "gray45"]
+    "fg_color": ["#3a7ebf", "#1f538d"],  // Background color for checkboxes
+    "border_color": ["#3E454A", "#949A9F"],  // Border color for checkboxes
+    "hover_color": ["#325882", "#14375e"],  // Background color when hovered
+    "checkmark_color": ["#DCE4EE", "gray90"],  // Checkmark color
+    "text_color": ["gray14", "gray84"],  // Text color for checkboxes
+    "text_color_disabled": ["gray60", "gray45"]  // Text color for disabled checkboxes
   },
   "CTkSwitch": {
     "corner_radius": 1000,
     "border_width": 3,
     "button_length": 0,
-    "fg_color": ["#939BA2", "#4A4D50"],
-    "progress_color": ["#3a7ebf", "#1f538d"],
-    "button_color": ["gray36", "#D5D9DE"],
-    "button_hover_color": ["gray20", "gray100"],
-    "text_color": ["gray14", "gray84"],
-    "text_color_disabled": ["gray60", "gray45"]
+    "fg_color": ["#939BA2", "#4A4D50"],  // Background color for switches
+    "progress_color": ["#3a7ebf", "#1f538d"],  // Color when switched on
+    "button_color": ["gray36", "#D5D9DE"],  // Color of the switch button
+    "button_hover_color": ["gray20", "gray100"],  // Color when button is hovered
+    "text_color": ["gray14", "gray84"],  // Text color for switches
+    "text_color_disabled": ["gray60", "gray45"]  // Text color for disabled switches
   },
   "CTkRadiobutton": {
     "corner_radius": 1000,
     "border_width_checked": 6,
     "border_width_unchecked": 3,
-    "fg_color": ["#3a7ebf", "#1f538d"],
-    "border_color": ["#3E454A", "#949A9F"],
-    "hover_color": ["#325882", "#14375e"],
-    "text_color": ["gray14", "gray84"],
-    "text_color_disabled": ["gray60", "gray45"]
+    "fg_color": ["#3a7ebf", "#1f538d"],  // Background color for radio buttons
+    "border_color": ["#3E454A", "#949A9F"],  // Border color for radio buttons
+    "hover_color": ["#325882", "#14375e"],  // Background color when hovered
+    "text_color": ["gray14", "gray84"],  // Text color for radio buttons
+    "text_color_disabled": ["gray60", "gray45"]  // Text color for disabled radio buttons
   },
   "CTkProgressBar": {
     "corner_radius": 1000,
     "border_width": 0,
-    "fg_color": ["#939BA2", "#4A4D50"],
-    "progress_color": ["#3a7ebf", "#1f538d"],
-    "border_color": ["gray", "gray"]
+    "fg_color": ["#939BA2", "#4A4D50"],  // Background color for progress bars
+    "progress_color": ["#3a7ebf", "#1f538d"],  // Color of the progress indicator
+    "border_color": ["gray", "gray"]  // Border color for progress bars
   },
   "CTkSlider": {
     "corner_radius": 1000,
     "button_corner_radius": 1000,
     "border_width": 6,
     "button_length": 0,
-    "fg_color": ["#939BA2", "#4A4D50"],
-    "progress_color": ["gray40", "#AAB0B5"],
-    "button_color": ["#3a7ebf", "#1f538d"],
-    "button_hover_color": ["#325882", "#14375e"]
+    "fg_color": ["#939BA2", "#4A4D50"],  // Background color for sliders
+    "progress_color": ["gray40", "#AAB0B5"],  // Color of the slider progress
+    "button_color": ["#3a7ebf", "#1f538d"],  // Color of the slider button
+    "button_hover_color": ["#325882", "#14375e"]  // Color when slider button is hovered
   },
   "CTkOptionMenu": {
     "corner_radius": 6,
-    "fg_color": ["#3a7ebf", "#1f538d"],
-    "button_color": ["#325882", "#14375e"],
-    "button_hover_color": ["#234567", "#1e2c40"],
-    "text_color": ["#DCE4EE", "#DCE4EE"],
-    "text_color_disabled": ["gray74", "gray60"]
+    "fg_color": ["#3a7ebf", "#1f538d"],  // Background color for option menus
+    "button_color": ["#325882", "#14375e"],  // Color of option menu buttons
+    "button_hover_color": ["#234567", "#1e2c40"],  // Color when button is hovered
+    "text_color": ["#DCE4EE", "#DCE4EE"],  // Text color for option menus
+    "text_color_disabled": ["gray74", "gray60"]  // Text color for disabled option menus
   },
   "CTkComboBox": {
     "corner_radius": 6,
     "border_width": 2,
-    "fg_color": ["#F9F9FA", "#343638"],
-    "border_color": ["#979DA2", "#565B5E"],
-    "button_color": ["#979DA2", "#565B5E"],
-    "button_hover_color": ["#6E7174", "#7A848D"],
-    "text_color": ["gray14", "gray84"],
-    "text_color_disabled": ["gray50", "gray45"]
+    "fg_color": ["#F9F9FA", "#343638"],  // Background color for combo boxes
+    "border_color": ["#979DA2", "#565B5E"],  // Border color for combo boxes
+    "button_color": ["#979DA2", "#565B5E"],  // Color of combo box buttons
+    "button_hover_color": ["#6E7174", "#7A848D"],  // Color when button is hovered
+    "text_color": ["gray14", "gray84"],  // Text color for combo boxes
+    "text_color_disabled": ["gray50", "gray45"]  // Text color for disabled combo boxes
   },
   "CTkScrollbar": {
     "corner_radius": 1000,
     "border_spacing": 4,
-    "fg_color": "transparent",
-    "button_color": ["gray55", "gray41"],
-    "button_hover_color": ["gray40", "gray53"]
+    "fg_color": "transparent",  // Background color for scrollbars
+    "button_color": ["gray55", "gray41"],  // Color of scrollbar buttons
+    "button_hover_color": ["gray40", "gray53"]  // Color when scrollbar button is hovered
   },
   "CTkSegmentedButton": {
     "corner_radius": 6,
     "border_width": 2,
-    "fg_color": ["#979DA2", "gray29"],
-    "selected_color": ["#3a7ebf", "#1f538d"],
-    "selected_hover_color": ["#325882", "#14375e"],
-    "unselected_color": ["#979DA2", "gray29"],
-    "unselected_hover_color": ["gray70", "gray41"],
-    "text_color": ["#DCE4EE", "#DCE4EE"],
-    "text_color_disabled": ["gray74", "gray60"]
+    "fg_color": ["#979DA2", "gray29"],  // Background color for segmented buttons
+    "selected_color": ["#3a7ebf", "#1f538d"],  // Color for selected state
+    "selected_hover_color": ["#325882", "#14375e"],  // Color when selected button is hovered
+    "unselected_color": ["#979DA2", "gray29"],  // Color for unselected state
+    "unselected_hover_color": ["gray70", "gray41"],  // Color when unselected button is hovered
+    "text_color": ["#DCE4EE", "#DCE4EE"],  // Text color for segmented buttons
+    "text_color_disabled": ["gray74", "gray60"]  // Text color for disabled segmented buttons
   },
   "CTkTextbox": {
     "corner_radius": 6,
     "border_width": 0,
-    "fg_color": ["gray100", "gray20"],
-    "border_color": ["#979DA2", "#565B5E"],
-    "text_color": ["gray14", "gray84"],
-    "scrollbar_button_color": ["gray55", "gray41"],
-    "scrollbar_button_hover_color": ["gray40", "gray53"]
+    "fg_color": ["gray100", "gray20"],  // Background color for text boxes
+    "border_color": ["#979DA2", "#565B5E"],  // Border color for text boxes
+    "text_color": ["gray14", "gray84"],  // Text color for text boxes
+    "scrollbar_button_color": ["gray55", "gray41"],  // Color of scrollbar buttons in text boxes
+    "scrollbar_button_hover_color": ["gray40", "gray53"]  // Color when scrollbar button is hovered
   },
   "CTkScrollableFrame": {
-    "label_fg_color": ["gray80", "gray21"]
+    "label_fg_color": ["gray80", "gray21"]  // Label color in scrollable frames
   },
   "DropdownMenu": {
-    "fg_color": ["gray90", "gray20"],
-    "hover_color": ["gray75", "gray28"],
-    "text_color": ["gray14", "gray84"]
+    "fg_color": ["gray90", "gray20"],  // Background color for dropdown menus
+    "hover_color": ["gray75", "gray28"],  // Background color when hovered
+    "text_color": ["gray14", "gray84"]  // Text color for dropdown menus
   },
   "CTkFont": {
     "macOS": {
@@ -153,6 +153,6 @@
     }
   },
   "RoopDonate": {
-    "text_color": ["#3a7ebf", "gray60"]
+    "text_color": ["#3a7ebf", "gray60"]  // Text color for RoopDonate component
   }
 }