How to use the same color variable in both Storybook palette and component?
P粉670107661
P粉670107661 2023-08-29 21:24:33
0
1
485
<p>I created a UI component library and used Storybook to provide documentation and examples for it. </p> <p>My goal is to declare a color palette in the SCSS file and use it in the component and storybook palette. </p> <p>Storybook Palette is a built-in storybook component that can create documentation for your color palette. </p> <p>So, I expect that if the colors of the design system change, I can just change the SCSS variable value and both the color palette and the component will be updated with the new color value. </p> <p>Unfortunately, the storybook documentation is poor in this section, and the examples only contain hardcoded colors. The color palette page is an MDX file, so I don't know how to import and use SCSS variables there. </p> <p>Is there a way to achieve my goal? </p>
P粉670107661
P粉670107661

reply all(1)
P粉076987386

Came across this tonight while looking up the same issue I had. After some googling I also found this: https://dev.to/benrobertson/color-swatches-in-storybook-4aa9. I haven't tried it yet but wanted to share it with you if you want to give it a try. I plan to test it out over the weekend.

Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!