Update app.py

app.py

@@ -77,51 +77,51 @@ def draw_bar_chart(data: dict[str, list[str | float]]):
     return plt
 
 
-css = """
-.main-title {
-    font-size: 24px;
-    font-weight: bold;
-    text-align: center;
-    margin-bottom: 20px;
-}
-.reference {
-    text-align: center;
-    font-size: 1.2em;
-    color: #d1d5db;
-    margin-bottom: 20px;
-}
-.reference a {
-    color: #FB923C;
-    text-decoration: none;
-}
-.reference a:hover {
-    text-decoration: underline;
-    color: #FB923C;
-}
-.title {
-    border-bottom: 1px solid;
-}
-.footer {
-    text-align: center;
-    margin-top: 30px;
-    padding-top: 20px;
-    border-top: 1px solid #ddd;
-    color: #d1d5db;
-    font-size: 14px;
-}
-"""
-# theme = gr.themes.Base(
-#     primary_hue="orange",
-#     secondary_hue="orange",
-#     neutral_hue="gray",
-#     font=gr.themes.GoogleFont("Source Sans Pro"),
-# ).set(
-#     background_fill_primary="*neutral_950",  # 主背景色（深黑）
-#     button_primary_background_fill="*primary_500",  # 按鈕顏色（橘色）
-#     body_text_color="*neutral_200",  # 文字顏色（淺色）
-# )
 def get_layout():
-    with gr.Blocks(css=None, theme='gstaff/xkcd') as demo:
+    css = """
+    .main-title {
+        font-size: 24px;
+        font-weight: bold;
+        text-align: center;
+        margin-bottom: 20px;
+    }
+    .reference {
+        text-align: center;
+        font-size: 1.2em;
+        color: #d1d5db;
+        margin-bottom: 20px;
+    }
+    .reference a {
+        color: #FB923C;
+        text-decoration: none;
+    }
+    .reference a:hover {
+        text-decoration: underline;
+        color: #FB923C;
+    }
+    .title {
+        border-bottom: 1px solid;
+    }
+    .footer {
+        text-align: center;
+        margin-top: 30px;
+        padding-top: 20px;
+        border-top: 1px solid #ddd;
+        color: #d1d5db;
+        font-size: 14px;
+    }
+    """
+    theme = gr.themes.Base(
+        primary_hue="orange",
+        secondary_hue="orange",
+        neutral_hue="gray",
+        font=gr.themes.GoogleFont("Source Sans Pro"),
+    ).set(
+        background_fill_primary="*neutral_950",  # 主背景色（深黑）
+        button_primary_background_fill="*primary_500",  # 按鈕顏色（橘色）
+        body_text_color="*neutral_200",  # 文字顏色（淺色）
+    )
+    with gr.Blocks(css=css, theme=theme) as demo:
         with gr.Column():
             gr.HTML(
                 value=(
@@ -137,17 +137,16 @@ def get_layout():
             with gr.Row(equal_height=True):
                 image_input = gr.Image(label="上傳影像", type="pil")
                 bar_chart = gr.Plot(label="分類結果")
+
             start_button = gr.Button("開始分類", variant="primary")
-    
+            gr.HTML(
+                '<div class="footer">© 2024 LCL 版權所有<br>開發者：何立智、楊哲睿</div>',
+            )
             start_button.click(
                 fn=Classifier().predict,
                 inputs=image_input,
                 outputs=bar_chart,
             )
-    
-            gr.HTML(
-                '<div class="footer">© 2024 LCL 版權所有<br>開發者：何立智、楊哲睿</div>',
-            )
 
     return demo