-
Notifications
You must be signed in to change notification settings - Fork 14
Example usage with Astro? #15
-
Hello. I would like to know if its possible to use this with the Astro framework?
Beta Was this translation helpful? Give feedback.
All reactions
Replies: 3 comments
-
Using the is:inline directive (https://docs.astro.build/en/reference/directives-reference/#isinline) should work after importing the script.
example:
<div>
<style is:inline>
me {
background-color: red;
}
</style>
...
</div>
Beta Was this translation helpful? Give feedback.
All reactions
-
One more change you need to do is adding this in your <head> so that you can avoid FOUC
<script
is:inline
src="https://cdn.jsdelivr.net/gh/gnat/css-scope-inline/script.js"
></script>
the is:inline property is important to opt out of astro's script processing. I can make a PR to add to the README?
Beta Was this translation helpful? Give feedback.
All reactions
-
Gonna convert this to a discussion as it may be an ongoing thing. Kudos @AceroM for your insight as a fellow Astro user 👍 Could add a very short note about it in the Technical FAQ- but I'd generally like to avoid adding content that applies to only one framework.
Beta Was this translation helpful? Give feedback.