with gr.Blocks(js=JS, css=CSS) as demo:

app.py

@@ -811,20 +811,19 @@ def next_slide():
 def get_video_id():
     return VIDEO_ID
 
-HEAD = """
-  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <style>
+JS = """
+  <script src="https://cdn.jsdelivr.net/npm/markmap-[email protected]"></script>
+"""
+
+CSS = """
     svg.markmap {{
       width: 100%;
       height: 100vh;
     }}
-  </style>
-  <script src="https://cdn.jsdelivr.net/npm/[email protected]"></script>
 """
 
 
-with gr.Blocks(head=HEAD) as demo:
+with gr.Blocks(js=JS, css=CSS) as demo:
     with gr.Row():
         with gr.Column():
             file_upload = gr.File(label="Upload your CSV or Word file", visible=False)
@@ -836,7 +835,7 @@ with gr.Blocks(head=HEAD) as demo:
             send_button = gr.Button("Send")
 
         with gr.Column():
-            with gr.Tab("截圖與逐字稿"):
+            with gr.Tab("圖文"):
                 transcript_html = gr.HTML(label="YouTube Transcript and Video") 
             with gr.Tab("投影片"):
                 slide_image = gr.Image()
@@ -846,11 +845,11 @@ with gr.Blocks(head=HEAD) as demo:
                     next_button = gr.Button("Next")
                 prev_button.click(fn=prev_slide, inputs=[], outputs=[slide_image, slide_text])
                 next_button.click(fn=next_slide, inputs=[], outputs=[slide_image, slide_text])         
-            with gr.Tab("資料本文"):
+            with gr.Tab("本文"):
                 df_string_output = gr.Textbox(lines=40, label="Data Text")
-            with gr.Tab("重點整理"):
+            with gr.Tab("重點"):
                 df_summarise = gr.Textbox(container=True, show_copy_button=True, lines=40)    
-            with gr.Tab("常用問題"):
+            with gr.Tab("問題"):
                 gr.Markdown("## 常用問題")
                 btn_1 = gr.Button()
                 btn_2 = gr.Button()