fix(desktop): improve start view onboarding screen design

[Kitenite]

Summary

• Center "Open Project" icon and text on the same line for better visual balance
• Add hover states with primary accent color for better interactivity feedback
• Make "Clone Repository" more prominent with outline button style
• Improve visual hierarchy with adjusted typography sizes and spacing

Test plan

• Open the desktop app without any projects
• Verify the start view displays centered icon and text
• Hover over the drop zone and verify the accent color appears
• Drag a folder over and verify the drag-over state looks correct
• Click "Clone Repository" and verify the dialog opens

Summary by CodeRabbit

• Style
  • Reduced logo size and added drag-opacity feedback.
  • Restyled primary action card with thicker rounded borders, stronger focus ring, and vertical stacked content.
  • Improved drag-and-drop states and clearer helper text for opening projects.
  • Adjusted layout and spacing across dashboard and project header for tighter, denser typography.
  • Slimmed inputs, refined form labels, and updated branch selector, badges, and collapsible UI sizing.
  • Tweaked create-workspace button sizing and subtle hover/active animations.

[coderabbitai]

Caution

Review failed

The pull request is closed.

📝 Walkthrough

Walkthrough

Visual and interaction refinements to StartView and layout/typography/styling adjustments to the project page: StartView drag-and-drop/button states, spacing, and helper text changed; project page header, form, branch selector, and collapsible UI typography and spacing updated.

Changes

Cohort / File(s)	Summary
StartView UI & Drag-and-Drop apps/desktop/src/renderer/screens/main/components/StartView/index.tsx	Adjusted logo size and opacity-on-drag; reworked primary action card to vertical stacked button content, larger text, updated paddings/gaps; drag-over state shows “Drop git project” with larger icon; normal state shows “Open Project” with shortened helper text; clone prompt changed from link → outline; border/focus styling updated.
Project page layout & controls apps/desktop/src/renderer/routes/_authenticated/_dashboard/project/$projectId/page.tsx	Removed vertical padding from centering container, added horizontal margin; reduced headline and metadata typography sizes; tightened spacing across header, inputs, branch hint; restyled inputs, branch selector, badges, collapsible trigger, and create-workspace button with smaller fonts and adjusted hover/transition effects.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Possibly related PRs

• fix(desktop): improve start view onboarding screen design #1165: Changes the same StartView/index.tsx UI and drag-and-drop/button styling — likely overlapping edits.
• feat(desktop): improve StartView onboarding CTA design #930: Modifies StartView drag-and-drop CTA, icons, and helper text — closely related UI changes.
• desktop (fix): init git if project has no git #265: Edits StartView/index.tsx and adds an InitGitDialog/git-init flow — related to repository onboarding UX.

Poem

🐰 I nibble code in tidy rows,

I shrink the logo when wind blows,
Buttons stack and icons hop,
Drop your repo — don’t you stop!
Hops of joy, a tiny dev clap 🐇✨

🚥 Pre-merge checks | ✅ 2 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%.	Write docstrings for the functions missing them to satisfy the coverage threshold.

✅ Passed checks (2 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title 'fix(desktop): improve start view onboarding screen design' clearly and specifically describes the main change: UI improvements to the onboarding screen component.
Description check	✅ Passed	The description includes a clear summary of changes and a comprehensive test plan, but lacks several template sections like Type of Change, Related Issues, and Screenshots that are specified in the repository template.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing touches

• 📝 Generate docstrings

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment
• Commit unit tests in branch kitenite/fix-onboard-screen

---

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

[github-actions]

🧹 Preview Cleanup Complete

The following preview resources have been cleaned up:

• ⚠️ Neon database branch
• ⚠️ Electric Fly.io app

Thank you for your contribution! 🎉