[nortonandreev]

Closes #1857 — AI-4265

What & why

The onboarding window had no room for its title-bar buttons, so close, minimize and zoom sat over the wordmark and, once the page scrolled, over the step's copy. The steps now scroll beneath a 44px title-bar row, the height of the main window's sidebar title bar. The row's empty space drags the window, and a 1px divider fades in under it once the page has scrolled.

Where to look

The content's top margin went from 60 to 16, so the unscrolled layout is unchanged. Dragging on a real Mac and the Windows caption buttons have not been checked by hand.

Verification

dotnet run --project test/Capacitor.App.Tests.Unit: 4,240 passed, 10 skipped, 0 failed. Headless Skia renders with the macOS button positions drawn on:

	Before	After
Min size (720×600), scrolled
Default (760×760), scrolled
Default, top

Summary by CodeRabbit

• Improvements
  • Updated the onboarding layout with a title bar above the step content. The title bar supports window dragging, and its divider appears as you scroll.
  • Adjusted the spacing above onboarding content to provide a more compact layout.
  • Removed the separate drag strip; window dragging is handled by the title bar.

[linear-code]

AI-4265

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

• Source mode: Auto
• Repository: Unavailable
• Branch: Unavailable
• File: No configuration file from this repository applied
• Commit: Unavailable
• Layers: Organization UI
• Review profile: ASSERTIVE
• Plan: Advanced
• Run ID: 7dad3562-ce26-4c2f-bc27-abe74476d6f2

📥 Commits

Reviewing files that changed from the base of the PR and between d1f1dc3 and 03b5956.

📒 Files selected for processing: 2

• src/Capacitor.App/Views/Onboarding/OnboardingPaneView.axaml
• src/Capacitor.App/Views/Onboarding/OnboardingPaneView.axaml.cs

Included review availability: This review used your included allowance. Your plan provides up to 1 included review per hour; 0 remain after this review.

📝 Walkthrough

The onboarding view adds a 44-pixel title-bar area above the step content. The title bar handles window dragging, and its divider appears when the step content is scrolled.

Changes: Onboarding title bar

Layer / File(s)	Summary
Title bar layout and scroll behavior src/Capacitor.App/Views/Onboarding/OnboardingPaneView.axaml, src/Capacitor.App/Views/Onboarding/OnboardingPaneView.axaml.cs	The view adds a draggable title-bar row and moves the step ScrollViewer below it. The content top margin changes from 60 to 16 pixels. OnStepScrolled shows the divider when the vertical offset is positive and hides it otherwise. The separate drag-strip overlay is removed.

Priority: ⬇️ Low

Estimated code review effort: 2 (Simple) | ~8 minutes

Change: Bug fix · Severity of issue fixed: Low

Suggested reviewers: alexeyzimarev

Merge Risk: ⚪ Minimal · up to 03b59

No confirmed behavior prevents merging; normal platform checks should still verify caption-button interaction.

Pre-merge checks: 4 · 1

Failed checks: 1 warning

Check name	Status	Explanation	Resolution
Docstring Coverage		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 3 functions across 1 files. (1 skipped: 1 …	Write docstrings for the functions missing them to satisfy the coverage threshold.

Passed checks: 4 passed

Check name	Status	Explanation
Description Check		Check skipped - CodeRabbit’s high-level summary is enabled.
Title check		The title names the main change: the onboarding window gets a title bar so its window buttons no longer overlap content. The changeset adds a 44px title-bar row above the scrolling steps, makes that r…
Linked Issues check		Issue #1857 requires clear space for the window buttons and window dragging from the top. OnboardingPaneView.axaml adds a 44px title-bar row and places StepScroll in the second row. The step conte…
Out of Scope Changes check		The changes are limited to OnboardingPaneView.axaml and its code-behind. They add the title-bar layout, top spacing adjustment, scroll divider behavior, and drag handling required by issue #1857. Th…

Full details: Title check

Explanation

The title names the main change: the onboarding window gets a title bar so its window buttons no longer overlap content. The changeset adds a 44px title-bar row above the scrolling steps, makes that row drag the window, and reduces the content top margin from 60px to 16px. The title is specific and matches the linked issue #1857 and the PR objectives. It is 76 characters and 14 words, which is slightly long but still a single readable sentence.

Full details: Linked Issues check

Explanation

Issue #1857 requires clear space for the window buttons and window dragging from the top. OnboardingPaneView.axaml adds a 44px title-bar row and places StepScroll in the second row. The step content therefore starts below the title-bar area. TitleBar handles pointer presses, and OnboardingPaneView.axaml.cs calls WindowChrome.BeginDrag(this, e). The reported unit-test run also has no failures.

Full details: Out of Scope Changes check

Explanation

The changes are limited to OnboardingPaneView.axaml and its code-behind. They add the title-bar layout, top spacing adjustment, scroll divider behavior, and drag handling required by issue #1857. The diff shows no unrelated product behavior or files.

Full details: Docstring Coverage

Explanation

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 3 functions across 1 files. (1 skipped: 1 unsupported.)

Resolution

Write docstrings for the functions missing them to satisfy the coverage threshold.

• Autofix · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts

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.}

[qodo-code-review]

PR Summary by Qodo

Reserve title-bar space above onboarding content

🐞 Bug fix 🕐 10-20 Minutes

AI Description

• Reserve a 44px title-bar row so window buttons no longer overlap onboarding content.
• Keep the empty row draggable and fade in a divider when the step scrolls.

Diagram

graph TD
    A["Main window"] --> B["Onboarding pane"] --> C["Title bar"] --> D["Window drag"]
    B --> E["Step scroller"] --> F["Divider visibility"]
    C --> F

Loading

High-Level Assessment

Separating the drag region from the scroll viewport directly prevents content from reaching the window buttons while preserving the unscrolled layout. Reusing the window's existing drag handler avoids introducing another chrome mechanism.

Files changed (2) +20 / -5

Bug fix (2) +20 / -5

OnboardingPaneView.axamlSeparate onboarding chrome from scrolling steps +18/-5

Separate onboarding chrome from scrolling steps

• Adds a 44px title-bar row above the step scroller, replacing the overlaid drag strip. Reduces the content's top margin to preserve its initial position and adds a transitioning divider beneath the title bar.

src/Capacitor.App/Views/Onboarding/OnboardingPaneView.axaml

OnboardingPaneView.axaml.csShow the title-bar divider when scrolled +2/-0

Show the title-bar divider when scrolled

• Sets the divider's opacity based on whether the step scroller has moved below its top position.

src/Capacitor.App/Views/Onboarding/OnboardingPaneView.axaml.cs

[qodo-code-review]

Code Review by Qodo

🐞 Bugs (0) 📘 Rule violations (0) 📎 Requirement gaps (0)

Great, no issues found!

Qodo reviewed your code and found no material issues that require review

Tip of the day

💡 Did you know, you can reply 'qodo' on any finding to push back, ask questions, or dig deeper

More tips ↗ | Customize Qodo ↗ | Qodo docs ↗