Mercurial
comparison mrjunejune/src/tools/latex_editor/index.html @ 258:60a876c4587a
[ui] Add semantic primitive ownership
Build a layered Zenbu token and sizing system, make authored controls use native-underneath primitives, migrate mrjunejune without imposing visual surfaces, and document/enforce HTML ownership in the catalog and wiki.
Co-authored-by: Copilot <[email protected]>
| author | MrJuneJune <me@mrjunejune.com> |
|---|---|
| date | Wed, 05 Aug 2026 05:25:40 -0700 |
| parents | 4f2b50bc78e7 |
| children |
comparison
equal
deleted
inserted
replaced
| 257:609d3c6aff4e | 258:60a876c4587a |
|---|---|
| 13 <div> | 13 <div> |
| 14 <h1>Online LaTeX Editor</h1> | 14 <h1>Online LaTeX Editor</h1> |
| 15 <p>Write LaTeX here. My server compiles it inside a locked-down sandbox and sends the PDF back to this preview.</p> | 15 <p>Write LaTeX here. My server compiles it inside a locked-down sandbox and sends the PDF back to this preview.</p> |
| 16 </div> | 16 </div> |
| 17 <div class="latex-actions"> | 17 <div class="latex-actions"> |
| 18 <label class="auto-compile"> | 18 <zen-checkbox appearance="plain" size="sm"> |
| 19 <input id="autoCompile" type="checkbox" checked /> | 19 <label class="auto-compile"> |
| 20 Auto compile | 20 <input id="autoCompile" type="checkbox" checked /> |
| 21 </label> | 21 Auto compile |
| 22 <button id="resetButton" type="button" class="secondary">Reset</button> | 22 </label> |
| 23 <button id="compileButton" type="button">Compile PDF</button> | 23 </zen-checkbox> |
| 24 <a id="downloadButton" class="button-link disabled" aria-disabled="true">Download</a> | 24 <zen-button appearance="plain" size="md"> |
| 25 <button id="resetButton" type="button" class="secondary">Reset</button> | |
| 26 </zen-button> | |
| 27 <zen-button appearance="plain" size="md"> | |
| 28 <button id="compileButton" type="button">Compile PDF</button> | |
| 29 </zen-button> | |
| 30 <zen-button appearance="plain" size="md"> | |
| 31 <a id="downloadButton" class="button-link disabled" aria-disabled="true">Download</a> | |
| 32 </zen-button> | |
| 25 </div> | 33 </div> |
| 26 </div> | 34 </div> |
| 27 | 35 |
| 28 <p id="latexStatus" class="latex-status" role="status" aria-live="polite"> | 36 <p id="latexStatus" class="latex-status" role="status" aria-live="polite"> |
| 29 Preparing your first PDF... | 37 Preparing your first PDF... |
| 33 <section class="latex-panel editor-panel" aria-labelledby="sourceHeading"> | 41 <section class="latex-panel editor-panel" aria-labelledby="sourceHeading"> |
| 34 <div class="panel-heading"> | 42 <div class="panel-heading"> |
| 35 <h2 id="sourceHeading">document.tex</h2> | 43 <h2 id="sourceHeading">document.tex</h2> |
| 36 <span id="sourceSize">0 / 65,536 bytes</span> | 44 <span id="sourceSize">0 / 65,536 bytes</span> |
| 37 </div> | 45 </div> |
| 38 <textarea id="latexSource" spellcheck="false" autocomplete="off" aria-label="LaTeX source" placeholder="Type your LaTeX document here...">\documentclass[11pt]{article} | 46 <zen-textarea appearance="plain" size="md"> |
| 47 <textarea id="latexSource" spellcheck="false" autocomplete="off" aria-label="LaTeX source" placeholder="Type your LaTeX document here...">\documentclass[11pt]{article} | |
| 39 \usepackage[margin=1in]{geometry} | 48 \usepackage[margin=1in]{geometry} |
| 40 \usepackage{amsmath} | 49 \usepackage{amsmath} |
| 41 \usepackage{xcolor} | 50 \usepackage{xcolor} |
| 42 | 51 |
| 43 \title{Hello from my server} | 52 \title{Hello from my server} |
| 55 | 64 |
| 56 \textcolor{blue}{Edit this document and watch the preview update.} | 65 \textcolor{blue}{Edit this document and watch the preview update.} |
| 57 | 66 |
| 58 \end{document} | 67 \end{document} |
| 59 </textarea> | 68 </textarea> |
| 69 </zen-textarea> | |
| 60 </section> | 70 </section> |
| 61 | 71 |
| 62 <section class="latex-panel preview-panel" aria-labelledby="previewHeading"> | 72 <section class="latex-panel preview-panel" aria-labelledby="previewHeading"> |
| 63 <div class="panel-heading"> | 73 <div class="panel-heading"> |
| 64 <h2 id="previewHeading">PDF preview</h2> | 74 <h2 id="previewHeading">PDF preview</h2> |