change background

app.py

@@ -3,7 +3,10 @@ import csv
 import json
 from datetime import datetime
 import gradio as gr
+from gradio.themes.base import Base
+from gradio.themes.utils import colors, fonts, sizes
 import openai
+from typing import Iterable
 from context import system_prompt
 openai.api_key = "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"
 # openai.api_key = os.getenv('OPENAI_API_KEY')
@@ -26,6 +29,59 @@ status_msgs = dict(
     cleared="Status: Conversation Cleared. Waiting"
 )
 
+class Seafoam(Base):
+    def __init__(
+        self,
+        *,
+        primary_hue: colors.Color | str = colors.emerald,
+        secondary_hue: colors.Color | str = colors.blue,
+        neutral_hue: colors.Color | str = colors.blue,
+        spacing_size: sizes.Size | str = sizes.spacing_md,
+        radius_size: sizes.Size | str = sizes.radius_md,
+        text_size: sizes.Size | str = sizes.text_lg,
+        font: fonts.Font
+        | str
+        | Iterable[fonts.Font | str] = (
+            fonts.GoogleFont("Quicksand"),
+            "ui-sans-serif",
+            "sans-serif",
+        ),
+        font_mono: fonts.Font
+        | str
+        | Iterable[fonts.Font | str] = (
+            fonts.GoogleFont("IBM Plex Mono"),
+            "ui-monospace",
+            "monospace",
+        ),
+    ):
+        super().__init__(
+            primary_hue=primary_hue,
+            secondary_hue=secondary_hue,
+            neutral_hue=neutral_hue,
+            spacing_size=spacing_size,
+            radius_size=radius_size,
+            text_size=text_size,
+            font=font,
+            font_mono=font_mono,
+        )
+        super().set(
+            body_background_fill="repeating-linear-gradient(45deg, *primary_200, *primary_200 10px, *primary_50 10px, *primary_50 20px)",
+            body_background_fill_dark="repeating-linear-gradient(45deg, *primary_800, *primary_800 10px, *primary_900 10px, *primary_900 20px)",
+            button_primary_background_fill="linear-gradient(90deg, *primary_300, *secondary_400)",
+            button_primary_background_fill_hover="linear-gradient(90deg, *primary_200, *secondary_300)",
+            button_primary_text_color="white",
+            button_primary_background_fill_dark="linear-gradient(90deg, *primary_600, *secondary_800)",
+            slider_color="*secondary_300",
+            slider_color_dark="*secondary_600",
+            block_title_text_weight="600",
+            block_border_width="3px",
+            block_shadow="*shadow_drop_lg",
+            button_shadow="*shadow_drop_lg",
+            button_large_padding="32px",
+        )
+
+
+seafoam = Seafoam()
 
 def make_dir():
     """Build directory for storing chat logs and update session_vars['path_filename']."""
@@ -137,7 +193,7 @@ with open("custom.css", "r", encoding="utf-8") as f:
 
 # TODO: how to do about launching unique sessions and logging chats without interference?
 # Gradio App
-with gr.Blocks(css=customCSS) as demo:
+with gr.Blocks(theme=seafoam, css=customCSS) as demo:
     # SETUP
     # Session variables
     session_vars = dict(