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>