Spaces:
Running
Running
Update index.html
Browse files- index.html +6 -19
index.html
CHANGED
|
@@ -24,18 +24,16 @@
|
|
| 24 |
--font-sans: 'Inter', system-ui, sans-serif;
|
| 25 |
}
|
| 26 |
|
| 27 |
-
html
|
| 28 |
height: 100%;
|
|
|
|
| 29 |
}
|
| 30 |
|
| 31 |
body {
|
|
|
|
| 32 |
background: var(--bg);
|
| 33 |
-
display: flex;
|
| 34 |
-
align-items: center;
|
| 35 |
-
justify-content: center;
|
| 36 |
-
min-height: 100vh;
|
| 37 |
font-family: var(--font-sans);
|
| 38 |
-
padding:
|
| 39 |
}
|
| 40 |
|
| 41 |
/* ── Widget Shell ── */
|
|
@@ -114,7 +112,6 @@
|
|
| 114 |
|
| 115 |
/* ── Log ── */
|
| 116 |
#hc-log {
|
| 117 |
-
flex: 1;
|
| 118 |
min-height: 340px;
|
| 119 |
max-height: 440px;
|
| 120 |
overflow-y: auto;
|
|
@@ -126,12 +123,7 @@
|
|
| 126 |
scrollbar-color: var(--border) transparent;
|
| 127 |
}
|
| 128 |
|
| 129 |
-
|
| 130 |
-
.hc-row {
|
| 131 |
-
display: flex;
|
| 132 |
-
flex-direction: column;
|
| 133 |
-
}
|
| 134 |
-
|
| 135 |
.hc-row.user { align-items: flex-end; }
|
| 136 |
.hc-row.bot { align-items: flex-start; }
|
| 137 |
|
|
@@ -234,9 +226,8 @@
|
|
| 234 |
text-align: center;
|
| 235 |
}
|
| 236 |
|
| 237 |
-
/* ── Mobile ── */
|
| 238 |
@media (max-width: 480px) {
|
| 239 |
-
body { padding: 12px;
|
| 240 |
.hc-bubble { max-width: 92%; font-size: 14px; }
|
| 241 |
#hc-log { max-height: 380px; }
|
| 242 |
}
|
|
@@ -245,7 +236,6 @@
|
|
| 245 |
<body>
|
| 246 |
|
| 247 |
<div id="hc-chat">
|
| 248 |
-
<!-- Header -->
|
| 249 |
<div id="hc-header">
|
| 250 |
<div class="hc-avatar">🎵</div>
|
| 251 |
<div>
|
|
@@ -260,16 +250,13 @@
|
|
| 260 |
</div>
|
| 261 |
</div>
|
| 262 |
|
| 263 |
-
<!-- Message log -->
|
| 264 |
<div id="hc-log"></div>
|
| 265 |
|
| 266 |
-
<!-- Input -->
|
| 267 |
<div id="hc-bar">
|
| 268 |
<input id="hc-input" type="text" placeholder="Ask about chords, mixing, arrangement…" autocomplete="off" />
|
| 269 |
<button id="hc-send">Send</button>
|
| 270 |
</div>
|
| 271 |
|
| 272 |
-
<!-- Footer -->
|
| 273 |
<div id="hc-footer">
|
| 274 |
CODETTE-LLAMA · LLAMA 3.2-1B · NO CHAT HISTORY SAVED
|
| 275 |
</div>
|
|
|
|
| 24 |
--font-sans: 'Inter', system-ui, sans-serif;
|
| 25 |
}
|
| 26 |
|
| 27 |
+
html {
|
| 28 |
height: 100%;
|
| 29 |
+
background: var(--bg);
|
| 30 |
}
|
| 31 |
|
| 32 |
body {
|
| 33 |
+
min-height: 100%;
|
| 34 |
background: var(--bg);
|
|
|
|
|
|
|
|
|
|
|
|
|
| 35 |
font-family: var(--font-sans);
|
| 36 |
+
padding: 40px 20px;
|
| 37 |
}
|
| 38 |
|
| 39 |
/* ── Widget Shell ── */
|
|
|
|
| 112 |
|
| 113 |
/* ── Log ── */
|
| 114 |
#hc-log {
|
|
|
|
| 115 |
min-height: 340px;
|
| 116 |
max-height: 440px;
|
| 117 |
overflow-y: auto;
|
|
|
|
| 123 |
scrollbar-color: var(--border) transparent;
|
| 124 |
}
|
| 125 |
|
| 126 |
+
.hc-row { display: flex; flex-direction: column; }
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 127 |
.hc-row.user { align-items: flex-end; }
|
| 128 |
.hc-row.bot { align-items: flex-start; }
|
| 129 |
|
|
|
|
| 226 |
text-align: center;
|
| 227 |
}
|
| 228 |
|
|
|
|
| 229 |
@media (max-width: 480px) {
|
| 230 |
+
body { padding: 16px 12px; }
|
| 231 |
.hc-bubble { max-width: 92%; font-size: 14px; }
|
| 232 |
#hc-log { max-height: 380px; }
|
| 233 |
}
|
|
|
|
| 236 |
<body>
|
| 237 |
|
| 238 |
<div id="hc-chat">
|
|
|
|
| 239 |
<div id="hc-header">
|
| 240 |
<div class="hc-avatar">🎵</div>
|
| 241 |
<div>
|
|
|
|
| 250 |
</div>
|
| 251 |
</div>
|
| 252 |
|
|
|
|
| 253 |
<div id="hc-log"></div>
|
| 254 |
|
|
|
|
| 255 |
<div id="hc-bar">
|
| 256 |
<input id="hc-input" type="text" placeholder="Ask about chords, mixing, arrangement…" autocomplete="off" />
|
| 257 |
<button id="hc-send">Send</button>
|
| 258 |
</div>
|
| 259 |
|
|
|
|
| 260 |
<div id="hc-footer">
|
| 261 |
CODETTE-LLAMA · LLAMA 3.2-1B · NO CHAT HISTORY SAVED
|
| 262 |
</div>
|