HomeMusing Studio

Replace Ace with CodeMirror 6 for the Custom CSS editor

Description

Replace Ace with CodeMirror 6 for the Custom CSS editor

Ace 1.3.3 hid the CSS from screen readers and trapped the Tab key,
causing accessibility issues.

  • Adds cssedit/, a CodeMirror 6 editor that make ui bundles with esbuild into static/js/cssedit.bundle.js
  • Labels the editor and describe its keys: Tab indents; Esc then Tab, or Ctrl+M (Shift+Option+M on macOS), moves focus out
  • Keeps Ace's Ctrl+D / Cmd+D shortcut for deleting a line
  • Previously, mobile fell back to the plain textarea. Now the editor loads on all devices, and falls back to the plain textarea if the bundle is missing
  • Removes Ace

Fixes #1776

Details

Provenance
mattAuthored on Tue, Nov 10, 7:33 PM
Parents
rWF8a6bd2c3525d: Merge pull request #1781 from writefreely/dependabot/go_modules/golang.
Branches
Unknown
Tags
Unknown
References
improve-css-editor