Mercurial

changeset 246:4f2b50bc78e7

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
[tools] Fix LaTeX editor visibility Co-authored-by: Copilot <[email protected]>
author MrJuneJune <me@mrjunejune.com>
date Mon, 03 Aug 2026 18:30:45 -0700
parents 3843bb6253ac
children 70f2a3dafc1c
files mrjunejune/src/tools/latex_editor/index.css mrjunejune/src/tools/latex_editor/index.html mrjunejune/test/latex_editor_test.js mrjunejune/test/snapshots/tools_latex_editor.snapshot
diffstat 4 files changed, 32 insertions(+), 9 deletions(-) [+]
line wrap: on
line diff
--- a/mrjunejune/src/tools/latex_editor/index.css	Mon Aug 03 18:23:36 2026 -0700
+++ b/mrjunejune/src/tools/latex_editor/index.css	Mon Aug 03 18:30:45 2026 -0700
@@ -29,10 +29,10 @@
 .button-link {
   min-height: 42px;
   padding: 0.65rem 1rem;
-  border: 2px solid rgb(var(--black));
+  border: 2px solid var(--black);
   border-radius: 8px;
   background: var(--awesome);
-  color: rgb(var(--black));
+  color: var(--black);
   font: inherit;
   font-weight: 700;
   text-decoration: none;
@@ -85,10 +85,15 @@
 .latex-panel {
   min-width: 0;
   overflow: hidden;
-  border: 2px solid rgb(var(--black));
+  border: 2px solid var(--black);
   border-radius: 12px;
   background: var(--white);
-  box-shadow: 6px 6px 0 rgba(var(--black), 0.12);
+  box-shadow: 6px 6px 0 rgba(0, 0, 0, 0.12);
+}
+
+.editor-panel:focus-within {
+  outline: 4px solid var(--awesome);
+  outline-offset: 2px;
 }
 
 .panel-heading {
@@ -98,7 +103,7 @@
   gap: 1rem;
   min-height: 48px;
   padding: 0.55rem 0.8rem;
-  border-bottom: 2px solid rgb(var(--black));
+  border-bottom: 2px solid var(--black);
   background: var(--gray-gradient);
 }
 
@@ -118,8 +123,9 @@
   padding: 1rem;
   border: 0;
   outline: 0;
-  background: rgb(var(--black));
-  color: var(--white);
+  background: #111318;
+  color: #f4f4f5;
+  caret-color: #f4f4f5;
   font: 15px/1.55 ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
   tab-size: 2;
 }
--- a/mrjunejune/src/tools/latex_editor/index.html	Mon Aug 03 18:23:36 2026 -0700
+++ b/mrjunejune/src/tools/latex_editor/index.html	Mon Aug 03 18:30:45 2026 -0700
@@ -35,7 +35,7 @@
             <h2 id="sourceHeading">document.tex</h2>
             <span id="sourceSize">0 / 65,536 bytes</span>
           </div>
-          <textarea id="latexSource" spellcheck="false" autocomplete="off" aria-label="LaTeX source">\documentclass[11pt]{article}
+          <textarea id="latexSource" spellcheck="false" autocomplete="off" aria-label="LaTeX source" placeholder="Type your LaTeX document here...">\documentclass[11pt]{article}
 \usepackage[margin=1in]{geometry}
 \usepackage{amsmath}
 \usepackage{xcolor}
--- a/mrjunejune/test/latex_editor_test.js	Mon Aug 03 18:23:36 2026 -0700
+++ b/mrjunejune/test/latex_editor_test.js	Mon Aug 03 18:30:45 2026 -0700
@@ -227,6 +227,23 @@
     await page.locator('#latexStatus[data-state="ready"]').waitFor({
       timeout: 15000,
     });
+    const editorAppearance = await page.locator('#latexSource').evaluate(element => {
+      const style = getComputedStyle(element);
+      const bounds = element.getBoundingClientRect();
+      return {
+        background: style.backgroundColor,
+        color: style.color,
+        display: style.display,
+        height: bounds.height,
+        value: element.value,
+        width: bounds.width,
+      };
+    });
+    assert.equal(editorAppearance.display, 'block');
+    assert.ok(editorAppearance.width > 300, JSON.stringify(editorAppearance));
+    assert.ok(editorAppearance.height > 400, JSON.stringify(editorAppearance));
+    assert.notEqual(editorAppearance.background, editorAppearance.color);
+    assert.match(editorAppearance.value, /\\documentclass/);
     assert.match(
       await page.locator('#pdfPreview').getAttribute('src'),
       /^blob:/,
--- a/mrjunejune/test/snapshots/tools_latex_editor.snapshot	Mon Aug 03 18:23:36 2026 -0700
+++ b/mrjunejune/test/snapshots/tools_latex_editor.snapshot	Mon Aug 03 18:30:45 2026 -0700
@@ -195,7 +195,7 @@
             <h2 id="sourceHeading">document.tex</h2>
             <span id="sourceSize">0 / 65,536 bytes</span>
           </div>
-          <textarea id="latexSource" spellcheck="false" autocomplete="off" aria-label="LaTeX source">\documentclass[11pt]{article}
+          <textarea id="latexSource" spellcheck="false" autocomplete="off" aria-label="LaTeX source" placeholder="Type your LaTeX document here...">\documentclass[11pt]{article}
 \usepackage[margin=1in]{geometry}
 \usepackage{amsmath}
 \usepackage{xcolor}