Editor blocks (checklist + collapsibles) & design standardization - #6
Merged
Conversation
Replace exact-match single-value radii (6/8/12/99px, 50%, 3px) across pages + global.css with the --radius-* tokens for uniform global control. Off-scale one-offs (10/4/5/14px) and compound corner values left as-is to avoid any visual shift.
Writers can now use Check List and Toggle List/Heading in /write, and they render correctly on the published site (no silent data loss): - Serializer: checkListItem → GFM task list (- [ ] / - [x]); toggleListItem and toggle headings → <details>/<summary> with markdown children - Slash menu offers Check List + Toggle List (toggle headings stay dropdown-only to avoid clutter) - Block-type dropdown drops H4–H6 (custom FormattingToolbar); editor H1–H3 map to site h2–h4, which is all a blog post needs - Site CSS styles task lists (accent checkboxes) and <details> (rotating caret, respects reduced-motion) - Verified end-to-end via a throwaway post: checkboxes, collapsibles, and markdown inside collapsibles all render Also trim the /write intro to a single concise line.
The playground/tools section is core to the site, so it now sits above the community/discussion section.
Deploying mlsystems with
|
| Latest commit: |
a27a727
|
| Status: | ✅ Deploy successful! |
| Preview URL: | https://de10be06.mlsystems.pages.dev |
| Branch Preview URL: | https://feature-editor-and-standardi.mlsystems.pages.dev |
topics/[id] used the blog's 2-column .blog-head/.blog-h1 but had nothing in the second column, leaving a half-empty grid and a slightly larger H1 than sibling listing pages. Switch it to the standard .page-head/.page-h1 so it matches /topics and the other section pages.
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
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.
Two threads in one branch: (1) making the
/writeeditor's offered blocks actually supported end-to-end (no silent data loss), and (2) design standardization. Tests (50) and a production build pass; the editor block rendering was verified end-to-end with a throwaway post.Editor blocks — support what's offered, drop what isn't
The formatting-toolbar block dropdown offered types our MDX export didn't handle (Check List, Toggle List/Heading, H4–H6) — they'd silently break on the published site. Fixed both directions:
- [ ]/- [x]); renders as real checkboxes on the site (accent-colored). Offered in the slash menu too.<details>/<summary>; render as real collapsibles on the site (rotating caret, reduced-motion aware). Markdown inside a collapsible renders correctly (verified: bold + links)./writeintro trimmed to one line.Verified end-to-end: built a temp post with a checklist + a collapsible → checkboxes,
<details>, and inner markdown all rendered; then removed it.Homepage
Design standardization (in progress on this branch)
--radius-*scale for uniform control. Off-scale one-offs and compound corners left untouched (zero visual change)..chipbase + variants (collapsing the ~7 pill variants), shared.card/.card--interactive+ anIconLinkCardcomponent (the card recipe is copied 5×), and standardizing About/Contact/topics onto the.page-head/.page-h1masthead (they currently borrow the blog-specific.blog-h1, so titles jump ~4px between pages). These are visual refactors — the Cloudflare preview on this PR is the best way to review them.Notes