Skip to content

fix(settings): correct toggle switch geometry - #549

Merged
zortos293 merged 1 commit into
devfrom
capy/fix-toggle-switch-styling
Jun 29, 2026
Merged

fix(settings): correct toggle switch geometry#549
zortos293 merged 1 commit into
devfrom
capy/fix-toggle-switch-styling

Conversation

@zortos293

@zortos293 zortos293 commented Jun 29, 2026

Copy link
Copy Markdown
Collaborator

This PR refines the visual rendering of toggle switches in the settings interface.

  • Increase toggle track width from 44px to 46px
  • Update track border-radius to 999px for pill shape
  • Add box-shadow to track for inset border definition
  • Reduce knob ::before size to 16px and adjust positioning
  • Update checked state transform offset to 22px

Open OPE-229 OPE-229


Note

Low Risk
CSS-only styling for settings toggles; no logic, persistence, or API changes.

Overview
Settings toggle switches get a CSS-only visual pass so track, knob, and checked travel line up more cleanly.

The control grows from 44px to 46px wide, uses a pill track (border-radius: 999px) with an inset border via box-shadow, and adds overflow: hidden on the track. The knob shrinks to 16px with 4px inset padding, and the checked translateX moves from 20px to 22px. The on state also picks up accent-aligned inset and outer glow on the track.

No markup or behavior changes—every settings-toggle in the settings UI picks this up automatically.

Reviewed by Cursor Bugbot for commit 2e2eb47. Configure here.

Co-authored-by: capy-ai[bot] <230910855+capy-ai[bot]@users.noreply.github.com>
@zortos293 zortos293 added the capy Generated by capy.ai label Jun 29, 2026 — with Image Capy AI
@cursor

cursor Bot commented Jun 29, 2026

Copy link
Copy Markdown

Bugbot couldn't run - usage limit reached

Bugbot is counted against Cursor usage for this user or team, and this run hit a usage or spend limit.

A user or team admin can review and increase usage limits in the Cursor dashboard.

(requestId: serverGenReqId_20e675b3-136f-47a3-9518-1ee7d2e9f14f)

@coderabbitai

coderabbitai Bot commented Jun 29, 2026

Copy link
Copy Markdown

Important

Review skipped

Auto reviews are disabled on base/target branches other than the default branch.

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: defaults

Review profile: CHILL

Plan: Pro Plus

Run ID: f683e3bc-6e74-45a6-9a58-923c5d2adfcd

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
  • Commit unit tests in branch capy/fix-toggle-switch-styling

Comment @coderabbitai help to get the list of available commands.

@zortos293
zortos293 merged commit acaa3bc into dev Jun 29, 2026
17 checks passed
Chizuui pushed a commit to Chizuui/OpenNOW-Modified that referenced this pull request Aug 11, 2026
Co-authored-by: capy-ai[bot] <230910855+capy-ai[bot]@users.noreply.github.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

capy Generated by capy.ai

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant