Spaces:

Renderlib-dev
/

CodeVed

Sleeping

App Files Files Community

Vedika commited on Jun 30

Commit

3d8753e

verified ·

1 Parent(s): fd37cb3

Update index.html

Browse files

Files changed (1) hide show

index.html +27 -15

index.html CHANGED Viewed

@@ -1,5 +1,3 @@
-<!DOCTYPE html>
 <html lang="en">
 <head>
     <meta charset="UTF-8">
@@ -118,7 +116,7 @@
         .main-area { flex: 1; display: flex; flex-direction: column; position: relative; transition: 0.3s; height: 100%; overflow: hidden; }
         .chat-container {
-            flex: 1; overflow-y: auto; padding: 60px 20px 180px;
             display: flex; flex-direction: column; align-items: center;
             scroll-behavior: smooth;
         }
@@ -148,7 +146,7 @@
             word-wrap: break-word; overflow-wrap: break-word;
         }
-        /* ---------- BUG FIX: VERTICAL TEXT ---------- */
         .bot-message {
             align-self: flex-start;
             max-width: 100%;
@@ -172,8 +170,9 @@
         .bot-content-wrapper {
             flex: 1 1 0%;
-            min-width: 0;
             width: 100%;
         }
         .bot-content {
@@ -181,27 +180,30 @@
             line-height: 1.7;
             color: var(--text-primary);
             word-wrap: break-word;
-            overflow-wrap: anywhere;
-            word-break: normal;
-            white-space: normal;
         }
         .bot-content p { margin-bottom: 16px; }
         .bot-content p:last-child { margin-bottom: 0; }
         .bot-content strong { font-weight: 600; color: #000; }
-        .bot-content code { font-family: var(--font-code); background: rgba(31,31,31,0.05); padding: 3px 6px; border-radius: 6px; font-size: 0.9em; color: #0284c7; }
         .bot-content pre {
             background: #0d1117; padding: 40px 16px 16px; border-radius: var(--radius-md);
             overflow-x: auto; margin: 16px 0; box-shadow: 0 4px 16px rgba(0,0,0,0.1);
-            position: relative; white-space: pre;
         }
         .bot-content pre::before {
             content: ''; position: absolute; top: 14px; left: 16px;
             width: 12px; height: 12px; border-radius: 50%;
             background: #ff5f56; box-shadow: 20px 0 0 #ffbd2e, 40px 0 0 #27c93f;
         }
-        .bot-content pre code { background: none; padding: 0; color: #e2e8f0; font-size: 13.5px; text-shadow: none; white-space: pre;}
         .chat-attachment-container { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 12px; }
         .chat-file-pill { display: inline-flex; align-items: center; gap: 8px; background: rgba(255,255,255,0.8); backdrop-filter: blur(8px); border: 1px solid var(--border-light); padding: 8px 14px; border-radius: var(--radius-lg); font-size: 13px; font-weight: 500; box-shadow: 0 2px 6px rgba(0,0,0,0.03); }
@@ -860,7 +862,7 @@
                                 TTSManager.autoPrepare(msgId, msg.content, botObj.listenBtn);
                             }
                         }
-                        setTimeout(UI.scrollToBottom, 200);
                         if(window.innerWidth <= 900) UI.toggleSidebar();
                     }
                 } catch(e) {}
@@ -1098,17 +1100,27 @@
                         signal: State.abortController.signal
                     });
                     if(!res.ok) throw new Error("API Offline");
                     const reader = res.body.getReader(), decoder = new TextDecoder();
                     while(true) {
                         const {done, value} = await reader.read();
                         if(done) break;
-                        const chunk = decoder.decode(value, {stream: true});
-                        const lines = chunk.split('\n');
                         for(let line of lines) {
                             if(line.startsWith('data: ')) {
                                 const dataStr = line.substring(6).trim();
                                 if(dataStr === '[DONE]') continue;
-                                try { const json = JSON.parse(dataStr); if(json.choices && json.choices[0].delta.content) fullText += json.choices[0].delta.content; }
                                 catch(e) {}
                                 Chat.parseAndRender(fullText, false, true, botObj.contentDiv);
                                 UI.scrollToBottom();

 <html lang="en">
 <head>
     <meta charset="UTF-8">
         .main-area { flex: 1; display: flex; flex-direction: column; position: relative; transition: 0.3s; height: 100%; overflow: hidden; }
         .chat-container {
+            flex: 1; overflow-x: hidden; overflow-y: auto; padding: 60px 20px 180px;
             display: flex; flex-direction: column; align-items: center;
             scroll-behavior: smooth;
         }
             word-wrap: break-word; overflow-wrap: break-word;
         }
+        /* ---------- CRITICAL BUG FIX: VERTICAL TEXT ---------- */
         .bot-message {
             align-self: flex-start;
             max-width: 100%;
         .bot-content-wrapper {
             flex: 1 1 0%;
+            min-width: 0; /* Prevents flexbox shrinking issues */
             width: 100%;
+            overflow: hidden; /* Contains any overflowing elements */
         }
         .bot-content {
             line-height: 1.7;
             color: var(--text-primary);
             word-wrap: break-word;
+            overflow-wrap: break-word;
+            word-break: break-word;
+            white-space: normal; /* CRITICAL: Using 'normal' instead of 'pre-wrap' prevents ladder effect */
+            width: 100%;
+            max-width: 100%;
         }
+        .bot-content * { max-width: 100%; }
         .bot-content p { margin-bottom: 16px; }
         .bot-content p:last-child { margin-bottom: 0; }
         .bot-content strong { font-weight: 600; color: #000; }
+        .bot-content code { font-family: var(--font-code); background: rgba(31,31,31,0.05); padding: 3px 6px; border-radius: 6px; font-size: 0.9em; color: #0284c7; white-space: pre-wrap; word-break: break-word; }
         .bot-content pre {
             background: #0d1117; padding: 40px 16px 16px; border-radius: var(--radius-md);
             overflow-x: auto; margin: 16px 0; box-shadow: 0 4px 16px rgba(0,0,0,0.1);
+            position: relative; white-space: pre-wrap; word-break: break-word;
         }
         .bot-content pre::before {
             content: ''; position: absolute; top: 14px; left: 16px;
             width: 12px; height: 12px; border-radius: 50%;
             background: #ff5f56; box-shadow: 20px 0 0 #ffbd2e, 40px 0 0 #27c93f;
         }
+        .bot-content pre code { background: none; padding: 0; color: #e2e8f0; font-size: 13.5px; text-shadow: none; white-space: pre-wrap; }
         .chat-attachment-container { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 12px; }
         .chat-file-pill { display: inline-flex; align-items: center; gap: 8px; background: rgba(255,255,255,0.8); backdrop-filter: blur(8px); border: 1px solid var(--border-light); padding: 8px 14px; border-radius: var(--radius-lg); font-size: 13px; font-weight: 500; box-shadow: 0 2px 6px rgba(0,0,0,0.03); }
                                 TTSManager.autoPrepare(msgId, msg.content, botObj.listenBtn);
                             }
                         }
+                        setTimeout(() => UI.scrollToBottom(true), 200);
                         if(window.innerWidth <= 900) UI.toggleSidebar();
                     }
                 } catch(e) {}
                         signal: State.abortController.signal
                     });
                     if(!res.ok) throw new Error("API Offline");
                     const reader = res.body.getReader(), decoder = new TextDecoder();
+                    let buffer = '';
                     while(true) {
                         const {done, value} = await reader.read();
                         if(done) break;
+                        buffer += decoder.decode(value, {stream: true});
+                        const lines = buffer.split('\n');
+                        buffer = lines.pop(); // Keep incomplete lines in the buffer
                         for(let line of lines) {
                             if(line.startsWith('data: ')) {
                                 const dataStr = line.substring(6).trim();
                                 if(dataStr === '[DONE]') continue;
+                                try {
+                                    const json = JSON.parse(dataStr);
+                                    if(json.choices && json.choices[0].delta.content) {
+                                        fullText += json.choices[0].delta.content;
+                                    }
+                                }
                                 catch(e) {}
                                 Chat.parseAndRender(fullText, false, true, botObj.contentDiv);
                                 UI.scrollToBottom();