fix(web): editor icons + subtler toolbar hover#9
Merged
SwathiMystery merged 1 commit intomainfrom Apr 21, 2026
Merged
Conversation
Two problems in the rich-notes editor: 1. Toolbar buttons rendered as blank squares — EasyMDE's CSS expects FontAwesome on the host page but 'autoDownloadFontAwesome: false' in editor.js meant nothing ever loaded. (Keeping autoDownload off is correct: it would inject a CDN <link> at runtime, against our no-CDN posture.) 2. Hover + active button states painted the whole button amber — loud and hard to read the icon. Fix - Vendor FontAwesome 4.7 locally under static/vendor/fontawesome/ (CSS + all font files + licence). URLs in the CSS rewritten from '../fonts/' to an absolute '/static/vendor/fontawesome/' so paths resolve regardless of how a user mounts /static. - Base template now loads font-awesome.min.css before easymde.min.css so toolbar icons render: bold, italic, heading, quote, lists, link, image, code, preview, side-by-side, guide. - Hover state: background flips to surface, icon takes the foreground colour, subtle 1px border — no more amber flood. - Active state: surface background, accent-coloured icon, same border. - Tidied up CodeMirror, preview, and statusbar colours so they read cleanly in both light and dark modes. Not changed - Vendored editor is still served from /static/vendor; no new outbound network calls at runtime. - Existing 46 tests still green.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
What
Two cosmetic issues in the rich-notes editor: toolbar buttons were blank (missing FontAwesome) and hover/active painted buttons amber.
Why
Changes
Verification
Font URLs in the CSS all point to `/static/vendor/fontawesome/` — no maxcdn references.
No-CDN posture preserved
The editor still loads zero external assets at runtime. `autoDownloadFontAwesome: false` stays.
Checklist