Repository navigation
fix(stickies): apply dark-theme sticky colors and add text color picker - #9951
rabiaedayilmaz wants to merge 2 commits into
Conversation
The un-themed :root fallback for --editor-colors-*-background tied the editor's [data-theme*="dark"] rules on specificity and, coming later in the cascade, always won, pinning stickies to the light ramp. Wrap it in :where() so the themed rules apply while it still acts as a fallback. Also add a "Text colors" row to the sticky color palette, using the existing text-color editor command. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
…-and-text-color fix(stickies): apply dark-theme colors and add text color picker
|
Navigate logical layers of code changes, visualize relationships, and explore their blast radius. No actionable comments were generated in the recent review. 🎉 ℹ️ Recent review info⚙️ Run configuration
📒 Files selected for processing (4)
Included review availability: This review used your included allowance. Your plan provides up to 10 included reviews per hour; 9 remain after this review. 📝 WalkthroughWalkthroughThe editor background fallback selectors now have zero specificity. The sticky editor palette now supports text-color selection and removal, alongside its existing background-color controls. ChangesEditor color behavior
Priority: ⬇️ Low Estimated code review effort: 2 (Simple) | ~10 minutes Change: Bug fix Sequence Diagram(s)sequenceDiagram
actor User
participant ColorPalette
participant Toolbar
participant TextColorCommand
User->>ColorPalette: Select a text color or remove text color
ColorPalette->>Toolbar: Pass color key or undefined to callback
Toolbar->>TextColorCommand: Execute text-color command
Merge Risk: ⚪ Minimal · up to The change lets themed sticky backgrounds apply in dark themes and adds text-color controls to the sticky palette. No merge-blocking risk was identified. 🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
Full details: Docstring CoverageExplanation Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%. Docstring coverage is scoped to functions touched by this diff. Analyzed 2 functions across 2 files. (2 skipped: 2 unsupported.)
✨ Finishing Touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
Description
Bug: sticky colors are always light pastels in dark mode
apps/web/styles/globals.cssandapps/space/styles/globals.cssdeclare an un-themed:rootfallback for--editor-colors-*-background.@plane/editor/styles, imported earlier in the same file, defines the themed values under[data-theme*="light"]and[data-theme*="dark"]. Both:rootand[data-theme*="dark"]have specificity (0,1,0), and the fallback comes later in the cascade, so it always wins. As a result, the dark values are never applied: under<html data-theme="dark">,--editor-colors-pink-backgroundresolves to#fdd4e3instead of#562e3d. The light text and icons on top become nearly invisible, so it looks as if sticky colors can't be changed.Fix: the fallback is now
:where(:root), which has zero specificity. The themed rules win, and the fallback still applies before a theme attribute is set.Feature: text color for stickies
The sticky toolbar only offered bold, italic and to-do list, while the page and description editors already support text color. The lite editor already includes
CustomColorExtension, and the sanitizer already allowsdata-text-color, so only the UI was missing.COLORS_LISTfrom@plane/editor, plus a "Remove text color" button).editorRef.executeMenuItemCommand({ itemKey: "text-color", color }), the same command the page toolbar uses.onMouseDown={(e) => e.preventDefault()}so the editor keeps its text selection.aria-labels.Type of Change
Screenshots and Media (if applicable)
Test Scenarios
#562e3d) and the text stays readable.#fdd4e3).<html data-theme="dark">,getComputedStyle(document.documentElement).getPropertyValue("--editor-colors-pink-background")returns the dark value.References
Summary by CodeRabbit