fix: Change right panel sheet to be below title bar / action bar

[CodeZeno]

Summary

Fix to allow Tasks and Diff right panel sheet to be closed when breakpoint below 1180px is activated.

Problem

When the Tasks right panel switches to sheet mode the button to close the panel displays underneath the window close button stopping the user from clicking it.
A similar problem happens with the Diff panel, the Diff panel's buttons cover the Diff panel toggle from the title bar / action bar stopping the user from closing it.
Another minor problem was when the Task right panel was active and covering the title bar / action bar there were places where the user could click and drag the window and other dead zones that did not allow this behaviour.

What changed

• Adjusted the RIGHT_PANEL_SHEET_CLASS_NAME const to drop the sheet to below the title bar / action bar

Why

This is a small change with a lot of benefits, it changes the position of the right panel in sheet mode so that the action buttons are always accessible. This will take affect for all future right panels in sheet mode so there are less mistakes in the future. The current approach was hard coding styling to allow for the window buttons on the Diff panel but this did not exist for the Tasks panel. This approach unifies the solution to apply to both and future panels.

UI Changes

Tasks panel Before:

• Top right we can see the button to close the Tasks panel is faded and underneath the window close button.

Tasks panel After:

• Tasks panel now below the title bar / action bar allowing user to click the close panel button

Diff panel Before:

• In this view there is no UI button to close the Diff panel, user must know key binding

Diff panel After:

• Diff panel now below the title bar / action bar allowing user to access the toggle on the action bar

Checklist

• This PR is small and focused
• I explained what changed and why
• I included before/after screenshots for any UI changes
• I included a video for animation/interaction changes

---

Note

Low Risk
Low risk: small, CSS-only layout tweaks for Electron window-controls-overlay; main risk is minor regressions in sheet sizing/spacing at the 1180px breakpoint.

Overview
Fixes right-panel sheet mode in Electron window-controls-overlay so it renders below the title bar/action bar, keeping close/toggle controls clickable.

This updates RIGHT_PANEL_SHEET_CLASS_NAME to add a wco: top offset and corresponding height/max-height adjustments, and tightens DiffPanelShell header padding so the special wco:pr[...] compensation only applies when the draggable titlebar region is active.

^{Reviewed by Cursor Bugbot for commit 0258929. Bugbot is set up for automated code reviews on this repo. Configure here.}

Note

Fix right panel sheet to render below the title bar in Electron (wco) mode

• Adds wco:mt-[env(titlebar-area-height)] and matching height/max-height classes to RIGHT_PANEL_SHEET_CLASS_NAME in rightPanelLayout.ts so the sheet starts below the titlebar instead of overlapping it.
• Moves the wco:pr-[...] right-padding class in getDiffPanelHeaderRowClassName (DiffPanelShell.tsx) so it only applies when the Electron drag region is active, not in sheet mode.

^{Macroscope summarized 0258929.}

[coderabbitai]

Important

Review skipped

Auto reviews are disabled on this repository. Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

⚙️ Run configuration

Configuration used: Repository UI

Review profile: CHILL

Plan: Pro

Run ID: 9930c2a5-babe-4ff9-a75e-41f4762ac700

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

• 🔍 Trigger review

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests

---

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.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[macroscopeapp]

Approvability

Verdict: Approved

Pure CSS class changes to adjust right panel sheet positioning relative to the titlebar area. No runtime behavior changes - only visual layout adjustments using Tailwind window controls overlay (wco:) classes.

^{You can customize Macroscope's approvability policy. Learn more.}

Dismissing prior approval to re-evaluate 0258929