Update theme.py

theme.py

@@ -1,30 +1,14 @@
 from gradio.themes.base import Base
-from gradio.themes.utils.colors import Color
 from gradio.themes.utils import colors, fonts, sizes
 from typing import Iterable
 
-light_grey = Color(
-    name="light_grey",
-    c50="#e0e0e0",
-    c100="#e0e0e0",
-    c200="#e0e0e0",
-    c300="#e0e0e0",
-    c400="#e0e0e0",
-    c500="#e0e0e0",
-    c600="#e0e0e0",
-    c700="#e0e0e0",
-    c800="#e0e0e0",
-    c900="#e0e0e0",
-    c950="#e0e0e0",
-)
-
 class Style(Base):
     def __init__(
         self,
         *,
-        primary_hue: colors.Color | str = light_grey,
-        secondary_hue: colors.Color | str = light_grey,
-        neutral_hue: colors.Color | str = light_grey,
+        primary_hue: colors.Color | str = colors.neutral,
+        secondary_hue: colors.Color | str = colors.neutral,
+        neutral_hue: colors.Color | str = colors.neutral,
         spacing_size: sizes.Size | str = sizes.spacing_md,
         radius_size: sizes.Size | str = sizes.radius_md,
         text_size: sizes.Size | str = sizes.text_md,
@@ -46,63 +30,61 @@ class Style(Base):
             font_mono=font_mono,
         )
         super().set(
-            background_fill_primary="#050f19", #The color of the background of blocks
-            background_fill_primary_dark="#050f19",
-            background_fill_secondary="#081527",
-            background_fill_secondary_dark="#081527",
-            block_background_fill="#050f19", #The color of the background of blocks
-            block_background_fill_dark="#050f19",
+            background_fill_primary="#f8f9fa",  # Very light gray background color
+            background_fill_primary_dark="#f8f9fa",  # Very light gray background color
+            background_fill_secondary="#e9ecef",  # Light gray background color
+            background_fill_secondary_dark="#e9ecef",  # Light gray background color
+            block_background_fill="#f8f9fa",  # Very light gray background color
+            block_background_fill_dark="#f8f9fa",  # Very light gray background color
             
-            border_color_primary="#050f19", #The border of a block such as dropdown 
-            border_color_primary_dark="#050f19",
+            border_color_primary="#ced4da",  # Light border color
+            border_color_primary_dark="#ced4da",  # Light border color
             
-            link_text_color="#f0ba2d", #The color for links
-            link_text_color_dark="#f0ba2d",
+            link_text_color="#6c757d",  # Subdued gray link color
+            link_text_color_dark="#6c757d",  # Subdued gray link color
             
-            block_info_text_color="ffffff",
-            block_info_text_color_dark="ffffff",
+            block_info_text_color="#212529",  # Dark text color
+            block_info_text_color_dark="#ffffff",  # White text color
             
-            block_border_color="#050f19", #The border color around an item (e.g. Accordion)
-            block_border_color_dark="#050f19",
+            block_border_color="#ced4da",  # Light border color
+            block_border_color_dark="#ced4da",  # Light border color
             block_shadow="*shadow_drop_lg",
-            #form_gap_width="*spacing_md", #The border gap between form elements, (e.g. consecutive textboxes)
             
-            input_background_fill="#081527", #The background of an input field
-            input_background_fill_dark="#081527", 
-            input_border_color="#050f19",
-            input_border_color_dark="#050f19",
-            input_border_width="2px", 
+            input_background_fill="#ffffff",  # Light background color
+            input_background_fill_dark="#ffffff",  # Light background color
+            input_border_color="#ced4da",  # Light border color
+            input_border_color_dark="#ced4da",  # Light border color
+            input_border_width="2px",
             
-            block_label_background_fill="#050f19",
-            block_label_background_fill_dark="#050f19",
-            block_label_border_color=None,
-            block_label_border_color_dark=None,
-            block_label_text_color="#050f19",
-            block_label_text_color_dark="#050f19",
+            block_label_background_fill="#f8f9fa",  # Very light gray background color
+            block_label_background_fill_dark="#f8f9fa",  # Very light gray background color
+            block_label_text_color="#212529",  # Dark text color
+            block_label_text_color_dark="#212529",  # Dark text color
             
-            button_primary_background_fill="#ffffff",
-            button_primary_border_color="#ffffff",
-            button_primary_text_color="#050f19",
+            button_primary_background_fill="#343a40",  # Dark gray background color
+            button_primary_border_color="#343a40",  # Dark gray border color
+            button_primary_text_color="#ffffff",  # Light text color
             button_shadow="*shadow_drop_lg",
             
-            block_title_background_fill="#f0ba2d", #The background of the title of a form element (e.g. textbox).
-            block_title_background_fill_dark="#f0ba2d", 
-            block_title_radius="*radius_sm",#The corner radius of the title of a form element (e.g. textbox).
-            block_title_text_color="#050f19", #The text color of the title of a form element (e.g. textbox).
-            block_title_text_color_dark="#050f19",
+            block_title_background_fill="#f8f9fa",  # Very light gray background color
+            block_title_background_fill_dark="#f8f9fa",  # Very light gray background color
+            block_title_radius="*radius_sm",
+            block_title_text_color="#212529",  # Dark text color
+            block_title_text_color_dark="#212529",  # Dark text color
             block_title_text_size="*text_lg",
-            block_title_border_width="2px", #The border around the title of a form element (e.g. textbox)
-            block_title_border_width_dark="2px",
-            block_title_border_color="#f0ba2d",
-            block_title_border_color_dark="#f0ba2d",
+            block_title_border_width="0px",  # Border width
+            block_title_border_width_dark="0px",  # Border width
+            block_title_border_color="#ced4da",  # Light border color
+            block_title_border_color_dark="#ced4da",  # Light border color
+            block_title_text_weight="600",
             
-            body_background_fill="#050f19",
-            body_background_fill_dark="#050f19",
-            body_text_color="#ffffff", #The default text color.
-            body_text_color_dark="#ffffff",
-            body_text_color_subdued="#ffffff",
-            body_text_color_subdued_dark="#ffffff",
+            body_background_fill="#f8f9fa",  # Very light gray background color
+            body_background_fill_dark="#f8f9fa",  # Very light gray background color
+            body_text_color="#212529",  # Dark text color
+            body_text_color_dark="#212529",  # Dark text color
+            body_text_color_subdued="#6c757d",  # Subdued gray text color
+            body_text_color_subdued_dark="#6c757d",  # Subdued gray text color
             
-            slider_color="*secondary_300",
-            slider_color_dark="*secondary_600",
+            slider_color="#6c757d",  # Subdued gray slider color
+            slider_color_dark="#6c757d",  # Subdued gray slider color
         )