Update app.py

app.py

@@ -211,17 +211,12 @@ def respond(
 def create_ui():
     try:
         css = """
-        body, .gradio-container {
-            background-color: #f8f9fa !important;
-            color: #333333 !important;
-        }
         footer {visibility: hidden;}
         .output-group {
-            border: 1px solid #dee2e6;
+            border: 1px solid #ddd;
             border-radius: 5px;
             padding: 10px;
             margin-bottom: 20px;
-            background-color: #ffffff;
         }
         .scroll-lock {
             overflow-y: auto !important;
@@ -241,8 +236,6 @@ def create_ui():
             white-space: pre !important;
             word-wrap: normal !important;
             height: 100% !important;
-            background-color: #f8f9fa !important;
-            border: 1px solid #dee2e6 !important;
         }
         .code-box > div {
             min-width: 100% !important;
@@ -252,13 +245,13 @@ def create_ui():
             overflow-wrap: normal !important;
         }
         .tab-nav {
-            background-color: #e9ecef;
+            background-color: #2c3e50;
             border-radius: 5px 5px 0 0;
             overflow: hidden;
         }
         .tab-nav button {
-            color: #495057 !important;
-            background-color: #e9ecef;
+            color: #ecf0f1 !important;
+            background-color: #34495e;
             border: none;
             padding: 10px 20px;
             margin: 0;
@@ -267,91 +260,19 @@ def create_ui():
             font-weight: bold;
         }
         .tab-nav button:hover {
-            background-color: #dee2e6;
+            background-color: #2980b9;
         }
         .tab-nav button.selected {
-            color: #212529 !important;
-            background-color: #ffffff;
+            color: #2c3e50 !important;
+            background-color: #ecf0f1;
         }
         input[type="text"], textarea {
-            color: #495057 !important;
-            background-color: #ffffff !important;
-            border: 1px solid #ced4da !important;
-        }
-        
-        /* AI 코딩 탭의 Chatbot 스타일 수정 */
-        .chatbot, .chatbot *, .wrap, .wrap * {
-            color: #212529 !important;
-            background-color: #ffffff !important;
-        }
-        .chatbot .message, .chatbot .user-message, .chatbot .bot-message {
-            color: #212529 !important;
-            padding: 10px 15px;
-            margin: 5px 0;
-            border-radius: 5px;
-            background-color: #f8f9fa !important;
-        }
-        .chatbot .user-message {
-            border-left: 4px solid #28a745 !important;
-        }
-        .chatbot .bot-message {
-            border-left: 4px solid #007bff !important;
-        }
-        .chatbot pre {
-            background-color: #f1f3f5 !important;
-            border: 1px solid #dee2e6 !important;
-            border-radius: 4px;
-            padding: 10px;
-            overflow-x: auto;
-            color: #212529 !important;
-        }
-        .chatbot code {
-            background-color: #e9ecef !important;
-            padding: 2px 4px;
-            border-radius: 4px;
-            font-family: monospace;
-            color: #212529 !important;
-        }
-        .chatbot p, .chatbot span, .chatbot div {
-            color: #212529 !important;
-            margin: 5px 0;
-        }
-        .chatbot * {
-            word-wrap: break-word !important;
-            white-space: pre-wrap !important;
-        }
-        .chatbot h1, .chatbot h2, .chatbot h3, .chatbot h4, .chatbot h5, .chatbot h6 {
-            color: #212529 !important;
-        }
-        .chatbot a {
-            color: #007bff !important;
-            text-decoration: underline !important;
-        }
-        .chatbot ul, .chatbot ol {
-            color: #212529 !important;
-            padding-left: 20px !important;
-        }
-        .chatbot li {
-            margin-bottom: 5px !important;
-            color: #212529 !important;
-        }
-        .chatbot table {
-            border-collapse: collapse !important;
-            width: 100% !important;
-        }
-        .chatbot th, .chatbot td {
-            border: 1px solid #dee2e6 !important;
-            padding: 8px !important;
-            text-align: left !important;
-            color: #212529 !important;
-        }
-        .chatbot th {
-            background-color: #e9ecef !important;
-            font-weight: bold !important;
+            color: #2c3e50 !important;
+            background-color: #ecf0f1 !important;
         }
         """
 
-        with gr.Blocks(theme='huggingface',css=css) as demo:
+        with gr.Blocks(theme="Nymbo/Nymbo_Theme", css=css) as demo:
             gr.Markdown("# Mouse: HuggingFace")
             
             with gr.Tabs() as tabs: