Skip to content

Let students pick the syntax colours they like in the editor - #25

Merged
The1UNeed merged 4 commits into
mainfrom
t3/syntax-rendering-options
Nov 5, 2026
Merged

The1UNeed merged 4 commits into
mainfrom
t3/syntax-rendering-options

Conversation

@The1UNeed

@The1UNeed The1UNeed commented Nov 4, 2026 •

Copy link
Copy Markdown
Owner

The editor only had one syntax-highlighting palette, so anyone who found it hard to read or just didn't like it was stuck with it.

Settings now has a Syntax colours picker with six schemes: Classic (the current palette, unchanged), Ocean, Forest, Ember, Monochrome, and High contrast. Each card shows a small preview. Every scheme has a light and a dark version that follows the app theme. The choice applies right away to every editor pane and is saved on the device. The picker appears in the Settings dialog, the account Appearance page, and the phone Settings tab. The phone Settings tab now scrolls so every option can be reached.

Only token colours change. The editor background, gutter and selection stay with the app theme. A test checks that every new scheme meets WCAG contrast on the editor background and the current-line highlight: 4.5:1 for code, 3:1 for comments.

Proof: pnpm typecheck, pnpm lint and the web test suite (248 tests) pass, including new unit tests, a settings test, and a test that two pickers on screen stay in step. In headless Chromium against the dev server, I checked that Monaco token colours change when a scheme is picked, in both light and dark (Monochrome keywords render bold), that the choice survives a reload, and that at 390×844 the phone Settings tab scrolls to and selects the last scheme without scrolling the page.

Reviewed with sol-loop: 2 rounds with gpt-6.1-sol. Sol verdict: approved

Council review

Rounds: 2

Delegate Round 1 Round 2
Claude Fable 5.1 9/10 9/10
GPT-6.1 Sol 8/10 10/10
Grok 4.7 (Cursor) no score no score

Grok 4.7 could not run because the Cursor usage limit was reached. Round 1 fixes:

  • Each picker now gets its own radio name, so two mounted pickers no longer share one native radio group.
  • The editor applies the current scheme on mount, so a scheme picked while Monaco is loading is not lost.

Generated by claude-opus-5-5 using the Claude Code (T3 Code) harness.

🤖 Generated with Claude Code


Note

Low Risk
Appearance and local preference only; Classic is unchanged and coverage includes persistence and contrast checks on Monaco themes.

Overview
Adds Syntax colours settings so users can choose among six Monaco highlighting palettes (Classic, Ocean, Forest, Ember, Monochrome, High contrast). Each option shows a mini preview and updates all editor panes immediately; the choice is stored in localStorage and survives reload.

The home page wires state through SyntaxColorSchemePicker in the Settings dialog, account Appearance profile, and phone Settings tab (that tab now scrolls with overflow-y-auto). Classic keeps the previous token colours; editor chrome (background, gutter, selection) stays tied to light/dark app theme while only token rules change.

MonacoPseudocodeEditor replaces the fixed examLabTheme* themes with per-scheme light/dark Monaco themes from syntaxColorSchemes.ts. Analytics adds syntax_colors_changed. EN/ZH copy and unit/integration tests cover picker sync, persistence, contrast on editor surfaces, and a settings flow test.

Reviewed by Cursor Bugbot for commit 63e068d. Bugbot is set up for automated code reviews on this repo. Configure here.

The1UNeed and others added 2 commits November 4, 2026 18:38
The editor had one fixed highlighting palette. Settings now offer six
schemes (Classic, Ocean, Forest, Ember, Monochrome, High contrast), each
with light and dark variants, previewed as small code cards. The choice
is stored per device and applies to every editor pane immediately.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
@vercel

vercel Bot commented Nov 4, 2026 •

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated
pseudoeditor.dev Error Error Nov 5, 2026 4:42am UTC

Request Review

@chatgpt-codex-connector

chatgpt-codex-connector Bot commented Nov 4, 2026 •

Copy link
Copy Markdown

Codex Review Summary

This comment shows the latest Codex review activity on this pull request.

Review Status Commit Review trigger
📝 Code Review ✅ Completed 2026-11-05T04:43:12.015282Z 63e068d New commits
ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

  • Open a pull request for review
  • Mark a draft as ready
  • Comment "@codex review" or "@codex security review".

Codex reacts with 👀 while any review is running, comments if it has suggestions, and reacts with 👍 once all reviews finish with no findings.

The1UNeed and others added 2 commits November 5, 2026 12:31
Each picker now gets its own radio name, so two pickers on screen at once
no longer share one native radio group (picking in one left the other
with nothing checked). The editor also reads the current theme on mount,
so a scheme picked while Monaco is still loading is not lost.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
@cursor

cursor Bot commented Nov 5, 2026

Copy link
Copy Markdown

Bugbot couldn't run - usage limit reached

Bugbot is counted against Cursor usage for this user or team, and this run hit a usage or spend limit.

A user or team admin can review and increase usage limits in the Cursor dashboard.

(requestId: 2bb41d2f-a5ba-4ecb-9e90-f8cbdabf8b79)

@The1UNeed
The1UNeed merged commit 8121d57 into main Nov 5, 2026
6 of 7 checks passed
The1UNeed added a commit that referenced this pull request Nov 5, 2026
Monaco's full contribution bundle (3.1 MB) evaluated in one long task when the editor mounted:
about 340 ms at 4x CPU, during which taps and keys waited. The editor now imports an explicit
list of contributions and loads them in groups, yielding to the browser between them, then warms
up a hidden editor so the visible one is cheap to create. Longest mount task at 4x CPU: 348 ms to
68 ms; largest chunk 3.1 MB to 0.5 MB. Dialect-specific Cmd+/ comments are fixed along the way.

Built by gpt-6.1-sol; merged with the syntax colour schemes from #25.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

This branch had an error being deployed

1 failed deployment
Preview — 63e068d4 Deployed Nov 5, 2026 by vercel[bot]
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant