fixes in css

Cargo.lock

@@ -2433,7 +2433,7 @@ dependencies = [
 
 [[package]]
 name = "rustpad"
-version = "0.0.14"
+version = "0.0.15"
 dependencies = [
  "argon2",
  "aws-config",

Cargo.toml

@@ -1,6 +1,6 @@
 [package]
 name = "rustpad"
-version = "0.0.14"
+version = "0.0.15"
 edition = "2024"
 rust-version = "1.94"
 description = "Collaborative Markdown notepad built with Axum, WebSockets and SQLite, PostgreSQL and MySQL"

static/css/styles.css

@@ -1258,6 +1258,12 @@ dialog::backdrop {
   background: var(--background);
 }
 
+.public-header__actions {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+}
+
 .public-header {
   position: sticky;
   top: 0;
@@ -1302,6 +1308,10 @@ dialog::backdrop {
   cursor: zoom-in;
 }
 
+.public-page.hide-preview-line-numbers .public-content {
+  padding-left: 32px;
+}
+
 @media (max-width: 600px) {
   .public-document {
     padding-top: 32px;
@@ -1310,6 +1320,10 @@ dialog::backdrop {
   .public-content {
     padding: 20px 20px 20px 52px;
   }
+
+  .public-page.hide-preview-line-numbers .public-content {
+    padding-left: 20px;
+  }
 }
 
 

static/js/public.js

@@ -7,6 +7,7 @@ import { renderMarkdown } from "@rustpad/markdown";
 
 const token=location.pathname.split("/").filter(Boolean)[1];
 const content=document.querySelector("#public-content");
+const lineNumbersToggle=document.querySelector("#public-line-numbers-toggle");
 function toast(text){const el=document.querySelector("#toast");el.textContent=text;el.classList.add("visible");setTimeout(()=>el.classList.remove("visible"),1800);}
 async function renderMermaid(){const nodes=content.querySelectorAll(".mermaid");if(!nodes.length)return;try{const {default:mermaid}=await import("https://cdn.jsdelivr.net/npm/mermaid@11/dist/mermaid.esm.min.mjs");mermaid.initialize({startOnLoad:false,theme:"dark",securityLevel:"strict"});await mermaid.run({nodes:[...nodes]});}catch{nodes.forEach(n=>n.insertAdjacentHTML("beforebegin",'<p class="error">Failed to load Mermaid.</p>'));}}
 async function renderCodeHighlight(){const blocks=content.querySelectorAll('pre code[class^="language-"]');if(!blocks.length)return;try{const hljs=await import("https://cdn.jsdelivr.net/npm/highlight.js@11.11.1/+esm");blocks.forEach(block=>{const lines=block.querySelectorAll(".code-line");if(!lines.length){hljs.default.highlightElement(block);return;}const language=[...block.classList].find(name=>name.startsWith("language-"))?.slice(9);lines.forEach(line=>{try{line.innerHTML=hljs.default.highlight(line.textContent,{language,ignoreIllegals:true}).value;}catch{line.innerHTML=hljs.default.highlightAuto(line.textContent).value;}});block.classList.add("hljs");});}catch{}}
@@ -17,5 +18,6 @@ function lockPublicContent(allowTaskUpdates){
 }
 async function initialize(){try{const page=await api(`/api/public/${encodeURIComponent(token)}`);document.querySelector("#public-title").textContent=page.title;document.querySelector("#public-meta").textContent=`Updated: ${new Date(page.updated_at).toLocaleString("en-US")}${page.allow_task_updates?" · tasks can be updated":""}`;document.title=`${page.title} · RustPad`;content.innerHTML=renderMarkdown(page.content);lockPublicContent(page.allow_task_updates);await Promise.all([renderMermaid(),renderCodeHighlight()]);}catch(error){content.innerHTML=`<p class="error">${String(error.message)}</p>`;}}
 content.addEventListener("change",async event=>{const box=event.target.closest(".task-checkbox");if(!box||box.disabled)return;const previous=!box.checked;box.disabled=true;try{const page=await api(`/api/public/${encodeURIComponent(token)}/tasks`,{method:"POST",body:JSON.stringify({source_line:Number(box.dataset.sourceLine),checked:box.checked})});document.querySelector("#public-meta").textContent=`Updated: ${new Date(page.updated_at).toLocaleString("en-US")} · tasks can be updated`;toast("Task saved");}catch(error){box.checked=previous;toast(error.message);}finally{box.disabled=false;}});
+lineNumbersToggle.addEventListener("change",()=>{document.body.classList.toggle("hide-preview-line-numbers",!lineNumbersToggle.checked);});
 document.querySelector("#copy-public-link").addEventListener("click",async()=>{try{await copyText(location.href);toast("Link copied");}catch(error){toast(error.message);}});
 initialize();

static/public.html

@@ -12,10 +12,13 @@
   <script type="module" src="/assets/js/public.js?v=__ASSET_VERSION__"></script>
 </head>
 
-<body class="public-page">
+<body class="public-page hide-preview-line-numbers">
   <header class="public-header">
     <a class="brand" href="/">RustPad</a>
+    <div class="public-header__actions">
+      <label class="line-toggle"><input id="public-line-numbers-toggle" type="checkbox"> Line numbers</label>
       <button id="copy-public-link" class="secondary-button">Copy link</button>
+    </div>
   </header>
   <main class="public-document">
     <h1 id="public-title">Loading…</h1>