Skip to content

Redesign settings page with scope-based visual separation#51

Closed
SunkenInTime wants to merge 1 commit intosetting-overhaulfrom
cursor/settings-page-visual-separation-d01e
Closed

Redesign settings page with scope-based visual separation#51
SunkenInTime wants to merge 1 commit intosetting-overhaulfrom
cursor/settings-page-visual-separation-d01e

Conversation

@SunkenInTime
Copy link
Owner

Summary

Visual overhaul of the Settings page to make it immediately clear whether you're editing per-strategy or global settings.

Changes

New scope card layout — Settings are organized into two visually distinct containers:

  • "This Strategy" card (violet accent, PER PAGE badge) — Contains Agent Scale, Ability Scale, and Active Map Theme. Only affects the current page.
  • "Global" card (neutral accent, APP-WIDE badge) — Contains Map Overlays, New Strategy Defaults, and Theme Profiles. Applies app-wide.

Design details:

  • Each card has a colored top accent bar, scope icon, title, badge, and one-line description
  • Uppercase section dividers (MAP THEME, MAP OVERLAYS, NEW STRATEGY DEFAULTS, THEME PROFILES) group settings within each card
  • Compact sliders show current value inline
  • Strategy card shows a helpful message when no strategy is open
  • Scrollable panel for content that exceeds viewport

Refactoring:

  • ActiveThemeCard and ProfileLibrarySection extracted as public widgets from map_theme_settings_section.dart so they can be placed in separate scope cards
  • MapThemeSettingsSection kept for backward compatibility

Design principles

  • Matches existing shadcn tacticalVioletTheme — uses primary, card, border, mutedForeground, secondary colors
  • Same component patterns (ShadCheckbox, Slider, ShadButton, etc.)
  • Compact — no extra space wasted; similar total height to the old layout
  • Intuitive — a new user can immediately see what's per-strategy vs app-wide
Open in Web Open in Cursor 

- Split settings into two visually distinct scope cards:
  'This Strategy' (per-page, violet accent) and 'Global' (app-wide, neutral)
- Each card has scope badge, icon, description, and colored top accent bar
- Split map theme section: Active Theme in strategy card, Profile Library in global
- Made ActiveThemeCard and ProfileLibrarySection public widgets
- Compact sliders with value display, refined checkbox rows
- Section dividers with uppercase labels for sub-grouping within cards
- Shows helpful message when no strategy is open
- Consistent with existing shadcn tacticalViolet theme

Co-authored-by: Dara Adedeji <SunkenInTime@users.noreply.github.com>
@vercel
Copy link

vercel bot commented Mar 18, 2026

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
icarus Ready Ready Preview, Comment Mar 18, 2026 7:38am

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

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants