api-viewer-element
api-viewer-element copied to clipboard
Providing shadow part styles to template
I would like to add some example styles customised using Shadow Parts exposed by my element.
So far I failed to do that. I cannot add a style to the document itself because API viewer's shadow root blocks them. I tried to put them inside the template[data-target=host]
but that break the demo completely.
How about providing a new template where a style can be provided?
<api-viewer>
<template data-element="my-element" data-target="style">
<style>
my-element::part(foo) { color: red }
</style>
</template>
</api-viewer>
Thanks for the issue. This seems to be a nice addition 👍 Will get back to api-viewer
soon and implement it.
Ah, hey. I found my way around this by putting a style tag inside template[data-target=prefix]
. This works well enough so maybe just some more docs around the available template targets would nice? I found that there are a bunch that the element expects
That's a valid point. So adding another one is kinda unnecessary 🤔
I agree those templates need more documentation.