Phoenix Storybook - How how avoid overwriting default styles?

Phoenix Forum Questions / Help
,
1

Hi all,
I am loading my own css in a storybook page.
My css put styles (font-family, for example…) on heading and body.

How can I avoid my css to overwrite the default Storybook styles?

Cheers

2

This is quite off topic but I really don’t understand how to leverage the sandbox_class to sandbox my components styles.

I set a default font to the body and all headings (h1, h2, h3…)

How can I avoid that font to collide with the default set by storybook?

I tried using the iframe container with no luck.

Should I prepend all my components styles with the sandbox class?

Like:

.my-sandbox-class h1,
.my-sandbox-class h2,
.my-sandbox-class h3 {font-family: "My font"}
...

I am not a CSS expert, but that doesn’t look good (?)

Thanks for your help,
not strictly elixir-related, I hope it’s ok

Cheers