-
-
Notifications
You must be signed in to change notification settings - Fork 153
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
chore: tweak navigator design to match SB web navigator design #326
Conversation
@a7med-mahmoud hey thanks for your contribution 🙏 . Looks cool! I'll test it out soon :) |
I think one solution to the TypeScript problem is to upgrade Emotion to v11, what do you think, should I do so? |
@a7med-mahmoud I think it would be better to update emotion separately. If you think it would be best to do it first then we could merge a PR to update emotion first. Though we should check the version of emotion used by other storybook packages to make sure there are no clashes. |
If we will add icons as PNGs, I think it would be better in terms of consistency to convert the SVGs used in SB web to PNGs and use them instead. |
@a7med-mahmoud awesome thanks 🙏 The icons are https://github.com/storybookjs/storybook/blob/next/lib/components/src/icon/icons.tsx |
I added it as an image. Sorry for the delay, I didn't have much time to work on it. |
@a7med-mahmoud
Don't worry about delays, everything in its own time :). Again really appreciate your contribution and putting up with my requests 😛 . Will take a look as soon as I can. Thanks again! |
Great contribution @a7med-mahmoud ! Hope you don't mind I converted the images to base64 because otherwise it complicates the bundling of the package. Any non ts/js files need to be copied into the dist folder after compiling. As base64 its not needed. I also added in the story icon :) Thanks again! 🙇 |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
✅
now live in 6.0.1-beta.5 |
Issue:
The old design was a bit unorganized and doesn't look like the Storybook web interface, so I tried to make it as close to it as possible.
What I did
I tweaked the navigator design to make it look like the one in the Storybook web interface.
Here's how it looks after the changes:
How to test
You just need to run the example app and see the changes in action.
What's next?
I'll work on improving it in my free time, things I want to add: