Storybook-readme: Storybook Dark theme compatibility

[raulfdm]

Hello folks.

I tried to look if there's an issue related and couldn't find it. So if it's duplicated, please let me know.

Btw, I have tried to implement Storybook dark default theme on my app and the only addon which doesn't work well was storybook-readme:

Should I implement something else to make it work properly? I mean, pass some styles through API or something like that?

Bests.

[tuchk4]

There is no styling api for this plugin. But it is possible to override classnames.
I will check it and write howto a bit later

[tuchk4]

Will be happy to fix along with this release https://github.com/tuchk4/storybook-readme/issues/118

@raulfdm How did you set dark theme? Using storybook api https://storybook.js.org/docs/configurations/theming/?

[raulfdm]

Hey @tuchk4 .

I'm also waiting for it! :p

Btw, exactly like this.

import { addParameters, configure } from '@storybook/react';
import { themes } from '@storybook/theming';

// Option defaults.
addParameters({
  options: {
    name: 'Foo',
    theme: themes.dark,
  },
});

[tuchk4]

Right now I know how to implement this for @storybook/react.
We also support @storybook/vue and it is a problem for this feature.

Right now I don't know the way to get current theme for vue.

---

For React this should work:

import { withTheme } from '@storybook/theming'

It should ref to https://emotion.sh/docs/emotion-theming#withthemecomponent-reactcomponenttype-reactcomponenttype?

[tuchk4]

Storybook issues "Get current Storybook theme" https://github.com/storybooks/storybook/issues/5918

[tuchk4]

Found solition. https://github.com/storybooks/storybook/issues/5918#issuecomment-470091117

Will implement as soon as possible.

[raulfdm]

Nice... waiting for it! 🚀

[tuchk4]

released at [email protected]

Now docs should adapt for storybook's theme and also it is possible to set custom theme README#full-list-of-options. Full list of theme values will provide after release. But hope in much cases docs will adapt automatically.

Also possible to set code highlighting theme https://github.com/tuchk4/storybook-readme#set-code-highlighting-theme

Note that right now there are __breaking changes at alpha version__. I wrote about here https://github.com/tuchk4/storybook-readme/issues/118#issuecomment-472684902

[tuchk4]

fixed in 5.0.0

[joepuzzo]

Hey guys, maybe im just misunderstanding, but are you saying stroybook readme will now automatically adapt to the dark storybook theme? Or do i have to pass the dark theme to the addParameters function?

[joepuzzo]

Because as it stands I must be doing somthing wrong as the readme styles are still the default.