added theming

app.py

@@ -1,6 +1,11 @@
 import gradio as gr
 from huggingface_hub import from_pretrained_fastai
 import os
+from __future__ import annotations
+from typing import Iterable
+from gradio.themes.base import Base
+from gradio.themes.utils import colors, fonts, sizes
+
 os.environ["HF_ENDPOINT"] = "https://huggingface.co"
 
 materials_model = from_pretrained_fastai("pyesonekyaw/recycletree_materials")
@@ -33,7 +38,7 @@ material_num_name_dict = {
 plastic_item_num_dict = {
   "CD Disk": ["Yes", "Nil"],
   "Straw": ["No, dispose as general waste","Nil"],
-  "Plastic Bag": ["Yes, if they are not oxo- and bio- degradable bags", "Contaminated with food waste/liquid waste/other forms of waste "],
+  "Plastic Bag": ["Yes, if they are not oxo- and bio- degradable bags", "Contaminated with food waste/liquid waste/other forms of waste. Please refer to RecycleHowAh for more information"],
   "Clothes Hanger": ["Yes", "Made up of more than one plastic, if unsure, just dispose as normal waste "],
   "Plastic Container or Bottle": ["Yes", "When they are not emptied or not rinsed "],
   "Disposable Cutlery": ["No, dispose as general waste", "Nil"],
@@ -52,9 +57,9 @@ metal_item_num_dict = {
   "Metal Can or Container": ["Yes","If there is any residue "]
 }
 others_item_num_dict = {
-  "Battery": ["No, rechargeable batteries can be recycled through specific collection points (e-waste collection)", "Nil"],
-  "Electronic Waste": ["Yes","Can be recycled through specific collection points (e-waste collection)"],
-  "Stationery": ["No","No, donate if can be reused"]
+  "battery": ["Battery","No, rechargeable batteries can be recycled through specific collection points (e-waste collection)", "Nil"],
+  "electronic_waste": ["Electronic Waste","Can be recycled through specific collection points (e-waste collection). Please refer to RecycleHowAh for more information"],
+  "stationery": ["Stationery","No, donate if can be reused"]
 }
 paper_item_num_dict = {
   "Beverage Carton": ["Yes, rinsed and flattened","Nil"],
@@ -71,7 +76,65 @@ paper_item_num_dict = {
   "Tissue Paper": ["No, dispose as general waste","Nil"]
 }
 
-
+class Seafoam(Base):
+    def __init__(
+        self,
+        *,
+        primary_hue: colors.Color | str = colors.emerald,
+        secondary_hue: colors.Color | str = colors.teal,
+        neutral_hue: colors.Color | str = colors.teal,
+        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="linear-gradient(45deg, *primary_200, *primary_200 10px, *primary_50 10px, *primary_50 20px)",
+            body_background_fill_dark="linear-gradient(45deg, *primary_200, *primary_200 10px, *primary_50 10px, *primary_50 20px)",
+            stat_background_fill_dark="linear-gradient(to right, *primary_400, *primary_200)",
+            error_background_fill_dark=f"linear-gradient(to right, {colors.red.c100}, *background_fill_secondary)",
+            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_background_fill_hover_dark="linear-gradient(90deg, *primary_200, *secondary_300)",
+            button_primary_text_color="white",
+            button_primary_background_fill_dark="linear-gradient(90deg, *primary_300, *secondary_400)",
+            slider_color="*secondary_300",
+            slider_color_dark="*secondary_300",
+            block_title_text_weight="600",
+            block_border_width="3px",
+            block_shadow="*shadow_drop_lg",
+            button_shadow="*shadow_drop_lg",
+            button_large_padding="32px",
+        )
+        for k in list(self.__dict__.keys()):
+            if '_dark' in k:
+                setattr(self,k,None)
+
+seafoam = Seafoam()
 
 def predict_image(inp):
     """
@@ -121,7 +184,7 @@ def predict_image(inp):
       raise Exception("Invalid file format! Please only upload .jpg or .png files!")
 
 
-with gr.Blocks(title="Trash Classification", css="#custom_header {min-height: 3rem} #custom_title {min-height: 3rem; text-align: center}") as demo:
+with gr.Blocks(title="Trash Classification", css="#custom_header {min-height: 3rem} #custom_title {min-height: 3rem; text-align: center}", theme=seafoam) as demo:
     gr.Markdown("# Check whether your trash is recyclable or not!", elem_id="custom_title")
     gr.Markdown("Gradio Inference interface for classification of trash and recyclables. To use it, simply upload your image, or click one of the examples to load them. Images uploaded are never saved or indexed.", elem_id="custom_title")