merge changes

theme/common.js

@@ -0,0 +1,47 @@
+function ChatBotHeight() {
+    function update_height(){
+        var { panel_height_target, chatbot_height, chatbot } = get_elements();
+        if (panel_height_target!=chatbot_height)
+        {
+            var pixelString = panel_height_target.toString() + 'px';
+            chatbot.style.maxHeight = pixelString; chatbot.style.height = pixelString; 
+        }
+    }
+
+    function update_height_slow(){
+        var { panel_height_target, chatbot_height, chatbot } = get_elements();
+        if (panel_height_target!=chatbot_height)
+        {
+            new_panel_height = (panel_height_target - chatbot_height)*0.5 + chatbot_height;
+            if (Math.abs(new_panel_height - panel_height_target) < 10){
+                new_panel_height = panel_height_target;
+            }
+            // console.log(chatbot_height, panel_height_target, new_panel_height);
+            var pixelString = new_panel_height.toString() + 'px';
+            chatbot.style.maxHeight = pixelString; chatbot.style.height = pixelString; 
+        }
+    }
+
+    update_height();
+    setInterval(function() {
+        update_height_slow()
+    }, 50); // 每100毫秒执行一次
+}
+
+function get_elements() {
+    var chatbot = document.querySelector('#gpt-chatbot > div.wrap.svelte-18telvq');
+    if (!chatbot) {
+        chatbot = document.querySelector('#gpt-chatbot');
+    }
+    const panel1 = document.querySelector('#input-panel');
+    const panel2 = document.querySelector('#basic-panel');
+    const panel3 = document.querySelector('#plugin-panel');
+    const panel4 = document.querySelector('#interact-panel');
+    const panel5 = document.querySelector('#input-panel2');
+    const panel_active = document.querySelector('#state-panel');
+    var panel_height_target = (20-panel_active.offsetHeight) + panel1.offsetHeight + panel2.offsetHeight + panel3.offsetHeight + panel4.offsetHeight + panel5.offsetHeight + 21;
+    var panel_height_target = parseInt(panel_height_target);
+    var chatbot_height = chatbot.style.height;
+    var chatbot_height = parseInt(chatbot_height);
+    return { panel_height_target, chatbot_height, chatbot };
+}

theme/default.py

@@ -1,33 +1,6 @@
-"""
-gradio可用颜色列表
-gr.themes.utils.colors.slate (石板色)
-gr.themes.utils.colors.gray (灰色)
-gr.themes.utils.colors.zinc (锌色)
-gr.themes.utils.colors.neutral (中性色)
-gr.themes.utils.colors.stone (石头色)
-gr.themes.utils.colors.red (红色)
-gr.themes.utils.colors.orange (橙色)
-gr.themes.utils.colors.amber (琥珀色)
-gr.themes.utils.colors.yellow (黄色)
-gr.themes.utils.colors.lime (酸橙色)
-gr.themes.utils.colors.green (绿色)
-gr.themes.utils.colors.emerald (祖母绿)
-gr.themes.utils.colors.teal (青蓝色)
-gr.themes.utils.colors.cyan (青色)
-gr.themes.utils.colors.sky (天蓝色)
-gr.themes.utils.colors.blue (蓝色)
-gr.themes.utils.colors.indigo (靛蓝色)
-gr.themes.utils.colors.violet (紫罗兰色)
-gr.themes.utils.colors.purple (紫色)
-gr.themes.utils.colors.fuchsia (洋红色)
-gr.themes.utils.colors.pink (粉红色)
-gr.themes.utils.colors.rose (玫瑰色)
-"""
-
-
 import gradio as gr
 from toolbox import get_conf
-CODE_HIGHLIGHT, ADD_WAIFU = get_conf('CODE_HIGHLIGHT', 'ADD_WAIFU')
+CODE_HIGHLIGHT, ADD_WAIFU, LAYOUT = get_conf('CODE_HIGHLIGHT', 'ADD_WAIFU', 'LAYOUT')
 
 def adjust_theme():
 
@@ -36,7 +9,8 @@ def adjust_theme():
         set_theme = gr.themes.Default(
             primary_hue=gr.themes.utils.colors.orange,
             neutral_hue=gr.themes.utils.colors.gray,
-            font=["sans-serif", "Microsoft YaHei", "ui-sans-serif", "system-ui"],
+            font=["sans-serif", "Microsoft YaHei", "ui-sans-serif", "system-ui",
+                  "sans-serif", gr.themes.utils.fonts.GoogleFont("Source Sans Pro")],
             font_mono=["ui-monospace", "Consolas", "monospace", gr.themes.utils.fonts.GoogleFont("IBM Plex Mono")])
         set_theme.set(
             # Colors
@@ -84,20 +58,26 @@ def adjust_theme():
             button_cancel_text_color_dark="white",
         )
 
+        if LAYOUT=="TOP-DOWN": 
+            js = ""
+        else:
+            with open('theme/common.js', 'r', encoding='utf8') as f: 
+                js = f"<script>{f.read()}</script>"
+            
         # 添加一个萌萌的看板娘
         if ADD_WAIFU:
-            js = """
+            js += """
                 <script src="file=docs/waifu_plugin/jquery.min.js"></script>
                 <script src="file=docs/waifu_plugin/jquery-ui.min.js"></script>
                 <script src="file=docs/waifu_plugin/autoload.js"></script>
             """
-            gradio_original_template_fn = gr.routes.templates.TemplateResponse
-            def gradio_new_template_fn(*args, **kwargs):
-                res = gradio_original_template_fn(*args, **kwargs)
-                res.body = res.body.replace(b'</html>', f'{js}</html>'.encode("utf8"))
-                res.init_headers()
-                return res
-            gr.routes.templates.TemplateResponse = gradio_new_template_fn   # override gradio template
+        gradio_original_template_fn = gr.routes.templates.TemplateResponse
+        def gradio_new_template_fn(*args, **kwargs):
+            res = gradio_original_template_fn(*args, **kwargs)
+            res.body = res.body.replace(b'</html>', f'{js}</html>'.encode("utf8"))
+            res.init_headers()
+            return res
+        gr.routes.templates.TemplateResponse = gradio_new_template_fn   # override gradio template
     except:
         set_theme = None
         print('gradio版本较旧, 不能自定义字体和颜色')

theme/green.py

@@ -1,6 +1,6 @@
 import gradio as gr
 from toolbox import get_conf
-CODE_HIGHLIGHT, ADD_WAIFU = get_conf('CODE_HIGHLIGHT', 'ADD_WAIFU')
+CODE_HIGHLIGHT, ADD_WAIFU, LAYOUT = get_conf('CODE_HIGHLIGHT', 'ADD_WAIFU', 'LAYOUT')
 
 def adjust_theme():
     try:
@@ -72,7 +72,14 @@ def adjust_theme():
             chatbot_code_background_color="*neutral_950",
             chatbot_code_background_color_dark="*neutral_950",
         )
+
         js = ''
+        if LAYOUT=="TOP-DOWN":
+            js = ""
+        else:
+            with open('theme/common.js', 'r', encoding='utf8') as f:
+                js = f"<script>{f.read()}</script>"
+
         # 添加一个萌萌的看板娘
         if ADD_WAIFU:
             js += """