Skip to content

fix(admin): keep rich-text formatting toolbar visible on long posts#1223

Draft
scottbuscemi wants to merge 1 commit into
mainfrom
fix/1192-sticky-editor-toolbar
Draft

fix(admin): keep rich-text formatting toolbar visible on long posts#1223
scottbuscemi wants to merge 1 commit into
mainfrom
fix/1192-sticky-editor-toolbar

Conversation

@scottbuscemi
Copy link
Copy Markdown
Contributor

Closes #1192.

Problem

When editing long posts, the WYSIWYG formatting toolbar scrolled out of the viewport, forcing users to scroll back up to apply formatting.

Fix

  • Make the EditorToolbar root sticky top-0 z-10 with an opaque bg-kumo-tint so content doesn't bleed through.
  • Switch the editor wrapper from overflow-hidden to overflow-clipoverflow-hidden established a nested scroll container that broke sticky positioning; overflow-clip still clips the rounded corners without doing so.
  • The scroll container is the admin shell <main> (the app header sits outside it), so top-0 pins the toolbar directly under the header.
  • Minimal/distraction-free editors (e.g. Widgets) don't render the toolbar and are unaffected.

Testing

  • pnpm lint:quick clean, pnpm --filter @emdash-cms/admin typecheck passes.
  • CSS-only change; needs visual verification (below).

Manual verification

  1. Edit a post and paste lots of content into the Content field.
  2. Scroll down. Expect: the formatting toolbar stays pinned at the top of the editing area, opaque, buttons clickable.
  3. Check bubble/slash menus still appear above it, and verify in an RTL locale (Arabic).

The editor toolbar scrolled out of view on long documents. Make it
`sticky top-0` and switch the editor wrapper from `overflow-hidden` to
`overflow-clip` so the rounded corners still clip without establishing a
nested scroll container that breaks sticky positioning. The scroll
container is the admin shell <main>, so top-0 pins it under the header.
Closes #1192.
@changeset-bot
Copy link
Copy Markdown

changeset-bot Bot commented May 29, 2026

🦋 Changeset detected

Latest commit: 3df4b75

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 14 packages
Name Type
@emdash-cms/admin Patch
emdash Patch
@emdash-cms/cloudflare Patch
@emdash-cms/sandbox-workerd Patch
@emdash-cms/fixture-perf-site Patch
@emdash-cms/perf-demo-site Patch
@emdash-cms/cache-demo-site Patch
@emdash-cms/auth Patch
@emdash-cms/blocks Patch
@emdash-cms/gutenberg-to-portable-text Patch
@emdash-cms/x402 Patch
create-emdash Patch
@emdash-cms/auth-atproto Patch
@emdash-cms/plugin-embeds Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@cloudflare-workers-and-pages
Copy link
Copy Markdown

Deploying with  Cloudflare Workers  Cloudflare Workers

The latest updates on your project. Learn more about integrating Git with Workers.

Status Name Latest Commit Updated (UTC)
✅ Deployment successful!
View logs
emdash-demo-cache 3df4b75 May 29 2026, 10:19 PM

@cloudflare-workers-and-pages
Copy link
Copy Markdown

Deploying with  Cloudflare Workers  Cloudflare Workers

The latest updates on your project. Learn more about integrating Git with Workers.

Status Name Latest Commit Updated (UTC)
✅ Deployment successful!
View logs
emdash-playground 3df4b75 May 29 2026, 10:19 PM

@cloudflare-workers-and-pages
Copy link
Copy Markdown

Deploying with  Cloudflare Workers  Cloudflare Workers

The latest updates on your project. Learn more about integrating Git with Workers.

Status Name Latest Commit Updated (UTC)
✅ Deployment successful!
View logs
docs 3df4b75 May 29 2026, 10:20 PM

@github-actions
Copy link
Copy Markdown
Contributor

PR template validation failed

Please fix the following issues by editing your PR description:

  • This PR does not use the required PR template. Please edit the description to use the PR template. Copy it into your PR description and fill out all sections.

See CONTRIBUTING.md for the full contribution policy.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Bug - WYSIWYG editor - Formatting toolbar scrolls out of view on long posts

1 participant