Update app.py

app.py

@@ -51,7 +51,7 @@ def process_message(file_path):
             messages = json.load(f)
         
         # 创建HTML输出
-        html_output = ""
+        html_output = '<div style="color: black;">'  # 添加一个包裹所有内容的div，设置文本颜色为黑色
         
         for message_item in messages:
             role = message_item['role']
@@ -59,11 +59,11 @@ def process_message(file_path):
             
             # 根据角色设置样式
             if role == "user" or role == "human":
-                html_output += f'<div style="background-color: #f0f0f0; padding: 10px; margin: 10px 0; border-radius: 10px;"><strong>User:</strong><br>'
+                html_output += f'<div style="background-color: #f0f0f0; padding: 10px; margin: 10px 0; border-radius: 10px; color: black;"><strong>User:</strong><br>'
             elif role == "assistant":
-                html_output += f'<div style="background-color: #e6f7ff; padding: 10px; margin: 10px 0; border-radius: 10px;"><strong>Assistant:</strong><br>'
+                html_output += f'<div style="background-color: #e6f7ff; padding: 10px; margin: 10px 0; border-radius: 10px; color: black;"><strong>Assistant:</strong><br>'
             else:
-                html_output += f'<div style="background-color: #f9f9f9; padding: 10px; margin: 10px 0; border-radius: 10px;"><strong>{role.capitalize()}:</strong><br>'
+                html_output += f'<div style="background-color: #f9f9f9; padding: 10px; margin: 10px 0; border-radius: 10px; color: black;"><strong>{role.capitalize()}:</strong><br>'
             
             # 处理内容
             for content_item in content:
@@ -73,7 +73,7 @@ def process_message(file_path):
                     # 将Markdown文本转换为HTML
                     md_text = content_item['text']
                     html_text = markdown.markdown(md_text, extensions=['fenced_code', 'codehilite'])
-                    html_output += html_text
+                    html_output += f'<div style="color: black;">{html_text}</div>'
                 
                 elif content_type == "image_url":
                     content_value = content_item['image_url']['url']
@@ -85,6 +85,7 @@ def process_message(file_path):
             
             html_output += '</div>'
         
+        html_output += '</div>'  # 关闭最外层div
         return html_output
     
     except Exception as e:
@@ -137,7 +138,7 @@ def setup_example_file():
 setup_example_file()
 
 # 创建Gradio界面
-with gr.Blocks(title="ChatGPT Conversation Visualizer") as demo:
+with gr.Blocks(title="ChatGPT Conversation Visualizer", css="div.prose * {color: black !important;}") as demo:
     gr.Markdown("# ChatGPT 对话可视化工具")
     gr.Markdown("上传一个包含ChatGPT对话记录的JSON文件，或使用示例文件查看可视化结果")