commit 000379

static/style.css

@@ -197,4 +197,26 @@
   white-space: pre-wrap;
 }
 
+.code-block-wrapper {
+  position: relative;
+  margin: 16px 0;
+  border-radius: 8px;
+  overflow: hidden;
+}
+
+.language-label {
+  position: absolute;
+  top: 8px;
+  left: 12px;
+  background: #333;
+  color: #fff;
+  font-size: 12px;
+  padding: 2px 8px;
+  border-radius: 4px;
+  z-index: 1;
+  pointer-events: none;
+  opacity: 0.85;
+  font-family: monospace;
+}
+
 

templates/index.html

@@ -69,26 +69,26 @@
   for (let i = 0; i < codeBlocks.length; i++) {
     if (i % 2 === 1) {
       const lines = codeBlocks[i].split('\n');
-      const langGuess = /^[a-zA-Z]+$/.test(lines[0]) ? lines[0] : '';
+      const langGuess = /^[a-zA-Z]+$/.test(lines[0]) ? lines[0].trim() : '';
       const codeLines = langGuess ? lines.slice(1) : lines;
+      const rawCode = codeLines.join('\n');
 
       const highlightedBlock = langGuess
-  ? hljs.highlight(codeLines.join('\n'), { language: langGuess, ignoreIllegals: true }).value
-  : hljs.highlightAuto(codeLines.join('\n')).value;
-
-const numberedLines = highlightedBlock
-  .split('\n')
-  .map((line, i) => `
-    <div class="code-line">
-      <span class="line-number">${i + 1}</span>
-      <span class="line-content">${line || '&nbsp;'}</span>
-    </div>
-  `).join('');
-
-      const rawCode = codeLines.join('\n');
+        ? hljs.highlight(rawCode, { language: langGuess, ignoreIllegals: true }).value
+        : hljs.highlightAuto(rawCode).value;
+
+      const numberedLines = highlightedBlock
+        .split('\n')
+        .map((line, i) => `
+          <div class="code-line">
+            <span class="line-number">${i + 1}</span>
+            <span class="line-content">${line || '&nbsp;'}</span>
+          </div>
+        `).join('');
 
       output += `
-        <div class="code-block">
+        <div class="code-block-wrapper">
+          <div class="language-label">${langGuess || 'Code'}</div>
           <button class="copy-btn" onclick="copyToClipboard(\`${rawCode.replace(/\\/g, '\\\\').replace(/`/g, '\\`')}\`, this)">Copy</button>
           <pre><code class="hljs">${numberedLines}</code></pre>
         </div>