Update app.py

app.py

@@ -9,37 +9,54 @@ body {
     font-family: Arial, sans-serif;
     background-color: #f0f0f9;
 }
-
 h4 {
     color: #333;
 }
-
 iframe {
     border: 2px solid #007bff;
     border-radius: 8px;
-    width: 100%; /* IFrame의 너비를 컬럼의 너비에 맞추도록 설정 */
-    height: 700px; /* 높이 설정은 그대로 유지 */
+    width: 100%;
+    height: 700px;
 }
-
 .gr-column {
     padding: 10px;
-    width: 50%; /* 각 컬럼이 전체 너비의 50%를 차지하도록 설정 */
+    width: 50%;
+}
+/* '코드' 포함 결과에 대한 스타일 */
+.code-result {
+    background-color: black;
+    color: white;
+    padding: 10px;
+    border-radius: 8px;
 }
+"""
 
-/* 마크다운 및 HTML 컴포넌트의 스타일을 추가 정의할 수 있음 */
+# JavaScript로 '코드' 포함 결과 감지 및 처리 로직
+javascript = """
+document.addEventListener('DOMContentLoaded', (event) => {
+    const results = document.querySelectorAll('.gr-output');
+    results.forEach((result) => {
+        if (result.innerText.includes('코드')) {
+            result.classList.add('code-result');
+            const copyButton = document.createElement('button');
+            copyButton.innerText = 'Copy';
+            copyButton.onclick = function() {
+                navigator.clipboard.writeText(result.innerText);
+            };
+            result.appendChild(copyButton);
+        }
+    });
+});
 """
 
 def app():
-    # Gradio 인터페이스 구성
-    with gr.Blocks(css=css_style) as demo:
+    with gr.Blocks(css=css_style, js=javascript) as demo:
         gr.Markdown("# AIQ Codepilot TEST", elem_id="main-title")
         with gr.Row():
-            # 첫 번째 HTML 컴포넌트로 IFrame 구현
             with gr.Column():
                 gr.Markdown("### AIQ Codepilot", elem_id="title-1")
                 gr.HTML(value='<iframe src="https://www.chatbase.co/chatbot-iframe/100-daum-net-eurma-q2o"></iframe>')
             
-            # 두 번째 HTML 컴포넌트로 IFrame 구현
             with gr.Column():
                 gr.Markdown("### 웹서비스 동작 화면", elem_id="title-2")
                 gr.HTML(value='<iframe src="https://seawolf2357-frametest1.hf.space"></iframe>')
@@ -48,4 +65,3 @@ def app():
 
 demo = app()
 demo.launch(auth=("arxiv", "gpt"))
-