-
-
Notifications
You must be signed in to change notification settings - Fork 9.3k
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
Remove blue outline when story node is focused #1497
Conversation
Fix blue outline at @sotybook/react
Reset :focus outline to none
At some point I'd like to get better keyboard accessibility, this is on my list. But for now, I guess I should just let this pass, and worry about improving it later. |
Thanks for the contribution @rodriguesbreno ! |
@ndelangen Storybooks is a great project. Btw, I can help with the keyboard accessibility 😄 |
That's great @rodriguesbreno! What I'd like to happen is extract react components for storybook itself into the Improve the UI in general and provide a collection of components suited for usage in addons. |
It breaks this one - #1427. Just to be sure that is was expected. |
@ndelangen I'll schedule sometime to explore it 😄 |
What do you mean? |
@igor-dv I see, so the blue outline is necessary for accessibility. Also, This outline must be only in this side bar, |
So what I'd love to happen is to move this navigation component into Then give it some nice looking |
@igor-dv I agree gray and thin is better |
You might want to use Firefox then, that's how default outline looks there |
Remove blue outline defined by the user argent
Issue:
Browsers define a blue outline when a node is on focus.
Setting the outline to none prevent this behavior
storybook version: 3.1.9
What I did
Reset the outline when a node is in focus to 'none'
at
@storybooks/react
and@storybooks/react-native
How to test
Run
yarn run storybook
And click in one of the tests.