Skip to content

[docs] Migrate Switch demos to emotion#25366

Merged
oliviertassinari merged 8 commits into
mui:nextfrom
vicasas:feature/migrate-switch-demo-to-emotion
Mar 21, 2021
Merged

[docs] Migrate Switch demos to emotion#25366
oliviertassinari merged 8 commits into
mui:nextfrom
vicasas:feature/migrate-switch-demo-to-emotion

Conversation

@vicasas

@vicasas vicasas commented Mar 14, 2021

Copy link
Copy Markdown
Member

The following demos of the Switch component were migrated:

  • Customized switches

Related to #16947

@mui-pr-bot

mui-pr-bot commented Mar 14, 2021

Copy link
Copy Markdown

Details of bundle changes

Generated by 🚫 dangerJS against 340d4c8

@vicasas

vicasas commented Mar 14, 2021

Copy link
Copy Markdown
Member Author

focusVisibleClassName It is not declared in the Switch API. Is it obsolete or not used now?

<Switch
    // focusVisibleClassName={classes.focusVisible}
    disableRipple
    {...props}
/>

@oliviertassinari oliviertassinari added scope: switch Changes related to the switch. docs Improvements or additions to the documentation. labels Mar 14, 2021
@oliviertassinari

Copy link
Copy Markdown
Member

@vicasas focusVisibleClassName is still relevant. It flows like this Switch > SwitchBase > IconButton > ButtonBase. It's used for this UI state:

Screenshot 2021-03-14 at 21 38 56

Comment thread docs/src/pages/components/switches/CustomizedSwitches.tsx Outdated
@vicasas vicasas changed the title [docs] Migrate Switch to emotion [docs] Migrate Switch demo to emotion Mar 14, 2021
@vicasas vicasas changed the title [docs] Migrate Switch demo to emotion [docs] Migrate Switch demos to emotion Mar 14, 2021
@vicasas

vicasas commented Mar 14, 2021

Copy link
Copy Markdown
Member Author

focusVisibleClassName is still relevant.

@oliviertassinari How would this be used from props you can unstructured to get to styles?

@oliviertassinari

Copy link
Copy Markdown
Member

@vicasas The simplest is to use .Mui-focusVisible directly.

@vicasas

vicasas commented Mar 15, 2021

Copy link
Copy Markdown
Member Author

The simplest is to use .Mui-focusVisible directly.

@oliviertassinari It's done, but I don't see the visual difference

image

@oliviertassinari
oliviertassinari force-pushed the feature/migrate-switch-demo-to-emotion branch from 81b245f to 2c98f6b Compare March 21, 2021 15:10
@oliviertassinari
oliviertassinari merged commit f60e7bd into mui:next Mar 21, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

docs Improvements or additions to the documentation. scope: switch Changes related to the switch.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants