Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Margin left spacing in Switch component with reverse = true prop, the label text wasn't centered #7179

Open
1 task done
EstebanGoldMuros opened this issue Jan 27, 2025 · 6 comments · May be fixed by #7198
Open
1 task done

Comments

@EstebanGoldMuros
Copy link

EstebanGoldMuros commented Jan 27, 2025

Description

I'm using the Switch component with the reverse prop activated the margin left spacing has 24px, if I use ml="0" then it continue with this margin.

Reproduction

https://stackblitz.com/edit/parsium-carbon-starter-peqjdaze?file=src%2FApp.tsx

Steps to reproduce

No response

JIRA ticket numbers (Sage only)

No response

Suggested solution

No response

Carbon version

146.5.3

Design tokens version

No response

Relevant browsers

Chrome

Relevant OSs

MacOS

Additional context

No response

Confidentiality

  • I confirm there is no confidential or commercially sensitive information included.
@EstebanGoldMuros EstebanGoldMuros added Bug triage Triage Required labels Jan 27, 2025
@damienrobson-sage
Copy link
Contributor

@ljemmo @harpalsingh regarding the ON/OFF labels, can you advise as to whether this is something we want to consider, please?

@damienrobson-sage
Copy link
Contributor

FE-7066

@damienrobson-sage damienrobson-sage added On Backlog and removed triage Triage Required labels Jan 28, 2025
@edleeks87 edleeks87 changed the title Margin left spacing in Switch component with reverse = true prop, the label text wasn't centered and I can't hide the labels ON/OFF Margin left spacing in Switch component with reverse = true prop, the label text wasn't centered Jan 29, 2025
@Parsium
Copy link
Contributor

Parsium commented Jan 29, 2025

@ljemmo @harpalsingh regarding the ON/OFF labels, can you advise as to whether this is something we want to consider, please?

This feature request has been moved to a separate issue: #7185

@ljemmo
Copy link
Contributor

ljemmo commented Jan 30, 2025

Can you confirm what you mean by 'on off labels'? This issue seems to be about margin placement?

@damienrobson-sage
Copy link
Contributor

@ljemmo see the link provided by James above for clarification 😄

@ljemmo
Copy link
Contributor

ljemmo commented Feb 3, 2025

@damienrobson-sage so i understand that he's wanting the margin bug to be fixed when the reverse prop is set to true (BTW DS no longer support this layout so wouldn't advise this usage where possible).

However, i don't understand the comment about On / Off labels. I missed @Parsium 's comment so will review the data there.

mihai-albu-sage added a commit that referenced this issue Feb 10, 2025
the margins have been updated to take into account reverse, labelInline and margin props

fixes: #7179
mihai-albu-sage added a commit that referenced this issue Feb 10, 2025
the margins have been updated to take into account reverse, labelInline and margin props

fixes: #7179
@mihai-albu-sage mihai-albu-sage linked a pull request Feb 10, 2025 that will close this issue
14 tasks
mihai-albu-sage added a commit that referenced this issue Feb 10, 2025
the margins have been updated to take into account reverse, labelInline and margin props

fixes: #7179
mihai-albu-sage added a commit that referenced this issue Feb 11, 2025
the margins have been updated to take into account reverse, labelInline and margin props

fixes: #7179
mihai-albu-sage added a commit that referenced this issue Feb 11, 2025
the margins have been updated to take into account reverse, labelInline and margin props

fixes: #7179
mihai-albu-sage added a commit that referenced this issue Feb 12, 2025
the margins have been updated to take into account reverse, labelInline and margin props

fixes: #7179
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Development

Successfully merging a pull request may close this issue.

4 participants