fixed syntax issues

src/css/bundle.css

@@ -455,10 +455,16 @@
     --hl-inserted-bg: rgba(0, 255, 204, 0.2);
 }
 
+html.banner-dismissed,
 body.banner-dismissed {
     --header-height: 109px;
 }
 
+html.banner-dismissed #banner,
+body.banner-dismissed #banner {
+    display: none !important;
+}
+
 * {
     box-sizing: border-box;
 }
@@ -963,8 +969,6 @@ footer#site-footer {
     padding: 8px;
     border-radius: 16px;
     background: var(--bg-menu);
-    border: 1px solid var(--border);
-    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.5);
     z-index: 50;
     opacity: 0;
     visibility: hidden;
@@ -2303,6 +2307,41 @@ main.prose h4 {
 }
 
 /* --- features.css --- */
+.eyebrow-actions {
+    display: inline-flex;
+    align-items: center;
+    gap: 4px;
+}
+
+.copy-md-btn {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 30px;
+    height: 30px;
+    padding: 0;
+    border: none;
+    border-radius: 50%;
+    background: none;
+    color: var(--muted);
+    cursor: pointer;
+    transition: color 0.15s ease, background 0.15s ease;
+}
+
+.copy-md-btn .ico {
+    width: 17px;
+    height: 17px;
+}
+
+.copy-md-btn:hover {
+    background: var(--hover-bg);
+    color: var(--text);
+}
+
+.copy-md-btn.copied {
+    color: #10b981;
+}
+
 .bm-btn {
     display: flex;
     align-items: center;
@@ -3729,6 +3768,85 @@ aside#toc li a.active {
     }
 }
 
+/* --- highlight.css --- */
+pre[class*="language-"],
+code[class*="language-"] {
+  color: var(--code-text);
+}
+
+.token.comment,
+.token.prolog,
+.token.doctype,
+.token.cdata {
+  color: var(--hl-comment) !important;
+  font-style: italic;
+}
+
+.token.punctuation {
+  color: var(--hl-punct) !important;
+}
+
+.token.namespace {
+  opacity: 0.7;
+}
+
+.token.property,
+.token.tag,
+.token.boolean,
+.token.number,
+.token.constant,
+.token.symbol,
+.token.deleted {
+  color: var(--hl-num) !important;
+}
+
+.token.selector,
+.token.attr-name,
+.token.string,
+.token.char,
+.token.builtin,
+.token.inserted {
+  color: var(--hl-string) !important;
+}
+
+.token.operator,
+.token.entity,
+.token.url,
+.language-css .token.string,
+.style .token.string {
+  color: var(--hl-op) !important;
+}
+
+.token.atrule,
+.token.attr-value,
+.token.keyword {
+  color: var(--hl-keyword) !important;
+  font-weight: 600;
+}
+
+.token.function,
+.token.function-name,
+.token.class-name {
+  color: var(--hl-func) !important;
+  font-weight: 500;
+}
+
+.token.regex,
+.token.important,
+.token.variable,
+.token.parameter {
+  color: var(--hl-var) !important;
+}
+
+.token.bold {
+  font-weight: 700;
+}
+
+.token.italic {
+  font-style: italic;
+}
+
+
 /* --- 404.css --- */
 body.is-404 #sidebar,
 body.is-404 #toc,

src/css/features.css

@@ -1,3 +1,38 @@
+.eyebrow-actions {
+    display: inline-flex;
+    align-items: center;
+    gap: 4px;
+}
+
+.copy-md-btn {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 30px;
+    height: 30px;
+    padding: 0;
+    border: none;
+    border-radius: 50%;
+    background: none;
+    color: var(--muted);
+    cursor: pointer;
+    transition: color 0.15s ease, background 0.15s ease;
+}
+
+.copy-md-btn .ico {
+    width: 17px;
+    height: 17px;
+}
+
+.copy-md-btn:hover {
+    background: var(--hover-bg);
+    color: var(--text);
+}
+
+.copy-md-btn.copied {
+    color: #10b981;
+}
+
 .bm-btn {
     display: flex;
     align-items: center;

src/css/highlight.css

@@ -7,66 +7,70 @@ code[class*="language-"] {
 .token.prolog,
 .token.doctype,
 .token.cdata {
-  color: var(--hl-comment);
+  color: var(--hl-comment) !important;
   font-style: italic;
 }
 
 .token.punctuation {
-  color: var(--hl-punct);
+  color: var(--hl-punct) !important;
 }
 
-.token.function,
-.token.function-name {
-  color: var(--hl-func);
-  font-weight: 500;
+.token.namespace {
+  opacity: 0.7;
 }
 
-.token.keyword,
-.token.selector {
-  color: var(--hl-keyword);
-  font-weight: 600;
+.token.property,
+.token.tag,
+.token.boolean,
+.token.number,
+.token.constant,
+.token.symbol,
+.token.deleted {
+  color: var(--hl-num) !important;
 }
 
-.token.string,
-.token.url {
-  color: var(--hl-string);
-}
-
-.token.variable,
+.token.selector,
 .token.attr-name,
-.token.property {
-  color: var(--hl-var);
+.token.string,
+.token.char,
+.token.builtin,
+.token.inserted {
+  color: var(--hl-string) !important;
 }
 
 .token.operator,
-.token.entity {
-  color: var(--hl-op);
+.token.entity,
+.token.url,
+.language-css .token.string,
+.style .token.string {
+  color: var(--hl-op) !important;
 }
 
-.token.number,
-.token.boolean,
-.token.constant {
-  color: var(--hl-num);
-}
-
-.token.parameter {
-  color: var(--hl-param);
+.token.atrule,
+.token.attr-value,
+.token.keyword {
+  color: var(--hl-keyword) !important;
+  font-weight: 600;
 }
 
+.token.function,
+.token.function-name,
 .token.class-name {
-  color: var(--hl-class);
+  color: var(--hl-func) !important;
+  font-weight: 500;
 }
 
-.token.tag {
-  color: var(--hl-tag);
+.token.regex,
+.token.important,
+.token.variable,
+.token.parameter {
+  color: var(--hl-var) !important;
 }
 
-.token.deleted {
-  color: var(--hl-deleted-color);
-  background-color: var(--hl-deleted-bg);
+.token.bold {
+  font-weight: 700;
 }
 
-.token.inserted {
-  color: var(--hl-inserted-color);
-  background-color: var(--hl-inserted-bg);
-}
+.token.italic {
+  font-style: italic;
+}

src/css/layout.css

@@ -443,8 +443,6 @@ footer#site-footer {
     padding: 8px;
     border-radius: 16px;
     background: var(--bg-menu);
-    border: 1px solid var(--border);
-    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.5);
     z-index: 50;
     opacity: 0;
     visibility: hidden;

src/css/roots.css

@@ -454,10 +454,16 @@
     --hl-inserted-bg: rgba(0, 255, 204, 0.2);
 }
 
+html.banner-dismissed,
 body.banner-dismissed {
     --header-height: 109px;
 }
 
+html.banner-dismissed #banner,
+body.banner-dismissed #banner {
+    display: none !important;
+}
+
 * {
     box-sizing: border-box;
 }

src/js/main.js

@@ -487,7 +487,11 @@ function cgSwitch(btn) {
     t.classList.toggle("active", t === btn);
   });
   group.querySelectorAll(".code-group-panel").forEach(function (p, i) {
-    p.classList.toggle("active", String(i) === index);
+    var on = String(i) === index;
+    p.classList.toggle("active", on);
+    if (on && window.Prism) {
+      window.Prism.highlightAllUnder(p);
+    }
   });
   window.dispatchEvent(new Event("resize"));
 }
@@ -663,6 +667,63 @@ function isBookmarked(href) {
   return getBookmarks().some(function (b) { return b.href === href; });
 }
 
+function buildCopyMarkdownButton(rawMd) {
+  var b = document.createElement("button");
+  b.type = "button";
+  b.className = "copy-md-btn";
+  b.setAttribute("aria-label", "Copy Markdown");
+  b.title = "Copy page as Markdown";
+  b.innerHTML = icon("copy");
+  b.addEventListener("click", function (e) {
+    e.stopPropagation();
+    var text = rawMd || "";
+    var onSuccess = function () {
+      b.innerHTML = icon("check");
+      b.classList.add("copied");
+      setTimeout(function () {
+        b.innerHTML = icon("copy");
+        b.classList.remove("copied");
+      }, 2000);
+    };
+    if (navigator.clipboard && navigator.clipboard.writeText) {
+      navigator.clipboard.writeText(text).then(onSuccess).catch(function () {
+        fallbackCopyText(text, onSuccess);
+      });
+    } else {
+      fallbackCopyText(text, onSuccess);
+    }
+  });
+  return b;
+}
+
+function fallbackCopyText(text, cb) {
+  var ta = document.createElement("textarea");
+  ta.value = text;
+  ta.style.position = "fixed";
+  ta.style.opacity = "0";
+  document.body.appendChild(ta);
+  ta.focus();
+  ta.select();
+  try {
+    document.execCommand("copy");
+    if (cb) cb();
+  } catch (e) { }
+  document.body.removeChild(ta);
+}
+
+function highlightAllCode(container) {
+  var target = container || document;
+  if (window.Prism && typeof window.Prism.highlightAllUnder === "function") {
+    window.Prism.highlightAllUnder(target);
+  } else {
+    setTimeout(function () {
+      if (window.Prism && typeof window.Prism.highlightAllUnder === "function") {
+        window.Prism.highlightAllUnder(target);
+      }
+    }, 60);
+  }
+}
+
 function buildBookmarkButton(route) {
   var b = document.createElement("button");
   b.type = "button";
@@ -858,6 +919,7 @@ function parseMarkdown(md) {
   var inCodeGroup = false;
   var codeGroupTabs = [];
   var codeGroupPanels = [];
+  var pendingTabTitle = "";
 
   function flushList() {
     if (inList) {
@@ -921,9 +983,24 @@ function parseMarkdown(md) {
       inCodeGroup = true;
       codeGroupTabs = [];
       codeGroupPanels = [];
+      pendingTabTitle = "";
       continue;
     }
 
+    if (inCodeGroup && !inPre) {
+      var tabCommentMatch = line.match(/<!--\s*tab:\s*([^-]+?)\s*-->/i);
+      if (tabCommentMatch) {
+        pendingTabTitle = tabCommentMatch[1].trim();
+        continue;
+      }
+      if (line.trim().startsWith("<!--") && line.trim().endsWith("-->")) {
+        continue;
+      }
+      if (line.trim().length === 0) {
+        continue;
+      }
+    }
+
     if (inCodeGroup && line === ":::") {
       flushList();
       flushTable();
@@ -936,13 +1013,14 @@ function parseMarkdown(md) {
       codeGroupPanels.forEach(function (panel, idx) {
         var activeClass = idx === 0 ? " active" : "";
         var langClass = panel.lang ? ' class="language-' + panel.lang + '"' : ' class="language-none"';
-        cgHtml += '<div class="code-group-panel' + activeClass + '"><pre><code' + langClass + '>' + esc(panel.code) + '</code></pre></div>';
+        cgHtml += '<div class="code-group-panel' + activeClass + '"><pre' + langClass + '><code' + langClass + '>' + esc(panel.code) + '</code></pre></div>';
       });
       cgHtml += '</div></div>';
       out.push(cgHtml);
       inCodeGroup = false;
       codeGroupTabs = [];
       codeGroupPanels = [];
+      pendingTabTitle = "";
       continue;
     }
 
@@ -953,27 +1031,37 @@ function parseMarkdown(md) {
         inPre = true;
         var info = line.slice(3).trim();
         var tabMatch = info.match(/\[([^\]]+)\]/);
-        var tabTitle = tabMatch ? tabMatch[1] : "";
+        var tabTitle = tabMatch ? tabMatch[1] : (pendingTabTitle || "");
+        pendingTabTitle = "";
         preLang = info.replace(/\[([^\]]+)\]/, "").trim();
-        if (inCodeGroup && tabTitle) {
-          codeGroupTabs.push(tabTitle);
+        if (inCodeGroup) {
+          codeGroupTabs.push(tabTitle || preLang || ("Tab " + (codeGroupTabs.length + 1)));
         }
         preCode = [];
       } else {
         inPre = false;
         var codeContent = preCode.join("\n");
-        var resolvedLang = preLang;
+        var resolvedLang = (preLang || "").toLowerCase().trim();
+        if (resolvedLang === "js") resolvedLang = "javascript";
+        else if (resolvedLang === "ts") resolvedLang = "typescript";
+        else if (resolvedLang === "sh" || resolvedLang === "shell" || resolvedLang === "zsh") resolvedLang = "bash";
+        else if (resolvedLang === "ps" || resolvedLang === "ps1") resolvedLang = "powershell";
+        else if (resolvedLang === "py") resolvedLang = "python";
+        else if (resolvedLang === "rs") resolvedLang = "rust";
+        else if (resolvedLang === "kt") resolvedLang = "kotlin";
+        else if (resolvedLang === "yml") resolvedLang = "yaml";
+        else if (resolvedLang === "md") resolvedLang = "markdown";
         if (!resolvedLang) {
           if (codeContent.trim().startsWith("{") || codeContent.trim().startsWith("[")) resolvedLang = "json";
           else if (codeContent.indexOf("=") !== -1 && !codeContent.includes("function") && !codeContent.includes(";")) resolvedLang = "ini";
-          else if (codeContent.startsWith("http://") || codeContent.startsWith("https://")) resolvedLang = "http";
+          else if (codeContent.startsWith("http://") || codeContent.startsWith("https://") || codeContent.startsWith("GET ") || codeContent.startsWith("POST ")) resolvedLang = "http";
           else resolvedLang = "bash";
         }
         if (inCodeGroup) {
           codeGroupPanels.push({ lang: resolvedLang, code: codeContent });
         } else {
           var langClass = resolvedLang ? ' class="language-' + resolvedLang + '"' : ' class="language-none"';
-          out.push('<div class="code-wrap"><pre><code' + langClass + ">" + esc(codeContent) + "</code></pre></div>");
+          out.push('<div class="code-wrap"><pre' + langClass + '><code' + langClass + ">" + esc(codeContent) + "</code></pre></div>");
         }
       }
       continue;
@@ -1685,16 +1773,18 @@ function loadPage() {
         var hasApiToken = md.indexOf("YOUR_API_URL") !== -1;
         contentEl.innerHTML = parseMarkdown(personalize(md));
 
-        if (window.Prism) {
-          window.Prism.highlightAllUnder(contentEl);
-        }
-
         var eyebrow = document.createElement("div");
         eyebrow.className = "eyebrow";
         var eyebrowText = document.createElement("span");
         eyebrowText.textContent = route.group.title;
         eyebrow.appendChild(eyebrowText);
-        eyebrow.appendChild(buildBookmarkButton(route));
+
+        var actions = document.createElement("div");
+        actions.className = "eyebrow-actions";
+        actions.appendChild(buildCopyMarkdownButton(md));
+        actions.appendChild(buildBookmarkButton(route));
+        eyebrow.appendChild(actions);
+
         var h1 = contentEl.querySelector("h1");
         if (h1) h1.parentNode.insertBefore(eyebrow, h1);
 
@@ -1725,6 +1815,7 @@ function loadPage() {
         updateFooterNav(route.item);
         updateToc();
         addCopyButtons();
+        highlightAllCode(contentEl);
         initCodeFades();
         wrapTables();
         resolveLatestDownloads();
@@ -2183,7 +2274,6 @@ document.addEventListener("DOMContentLoaded", function () {
   buildSearch();
   buildSettings();
   initEasterEggs();
-  initContribSheet();
   bindLightboxClicks();
   loadPage();