svelte-lexical icon indicating copy to clipboard operation
svelte-lexical copied to clipboard

Published 20 hours ago • verified publisher icon umaranis

Scope CSS to component

Open DePasqualeOrg opened this issue 3 years ago • 2 comments

When I use the SvelteKit example in my own SvelteKit project, the CSS from svelte-lexical gets applied to all the pages on my site. Ideally it should only be applied to the svelte-lexical component.

DePasqualeOrg avatar Jun 03 '22 16:06 DePasqualeOrg

Hi @DePasqualeOrg , I don't want to scope the CSS to the component because it is a library. Scoping styles to the component will take away the ability of library users to style the components.

But I also understand your problem. Could you identify a css selector that is impacting other pages on your site? Maybe I need it include a prefix for my CSS classes (it is already done for theme folder CSS)?

umaranis avatar Jun 05 '22 09:06 umaranis

Ah, I see. Disabling the styles in the body selector or moving them to the .editor-shell selector seems to solve most of the problems for me at first glance.

DePasqualeOrg avatar Jun 05 '22 10:06 DePasqualeOrg