ni / ni/nimble

nimble-switch 32px design

Open
#3,013 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

triage visual design
Dominant language
TypeScript
Stars
39
Forks
14
Avg merge
1d 16h
Merged PRs (30d)
13

Description

🎨 Visual Design Request

📌 Request Background

Currently we have switch designs for 24px and 16px switches in figma (switch figma).

But we have usages for placing switch controls next to 32px controls (text-field, etc). Currently we align labels and leave a gap at the bottom of the switch:

Image

But this approach would not work well for error-text alignment, etc. We should have a 32px switch defined which considers error-text placement, etc. One idea may be to center the switch instead of having the switch flush to the top of the control. Another is to keep the switch flushed to the top and have the larger gap to the error-text and have the specified in figma as the switch 32 design.

🎯 Core Requirements

🍆 Non-requirements

🥅 Acceptance Criteria

  • Visual Design Spec submitted (link)
  • Visual Design Spec reviewed by design team
  • Visual Design Spec reviewed by dev team

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the linked switch Figma file and compare the existing 24px and 16px switch designs with the 32px control alignment shown in the issue. Define the 32px switch treatment, including error-text spacing, then submit the visual design specification for design-team and dev-team review.

Written by the indexing model from the issue text.

Assessment

Domain
design
Issue type
Feature
Difficulty
5/5
Estimated time
Over a week
Activity status
Quiet
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.