diff --git a/README.md b/README.md index 9d26b51..98f0053 100644 --- a/README.md +++ b/README.md @@ -4,10 +4,9 @@ _🪡 declaratively define shadowroots to repeat in HTML templates_ ## What is ShadowRoot Injector? -ShadowRoot Injector lets you define templates for custom elements using HTML. When those elements appear in the DOM, the -library will automatically insert the template you defined into the element. You can then, optionally, upgrade the -element using native web-component definitions (either inline in a script tag, or imported as a separate component -definition). +ShadowRoot Injector lets you define templates for elements using HTML. When those elements appear in the DOM, the +library will automatically insert a template into the element. You can then, optionally, upgrade the element using +native web-component definitions (either inline in a script tag, or imported as a separate component definition). ### Example @@ -16,50 +15,52 @@ The example below shows a markdown callout. You can see a running example live o ```html - + - +
+ + +
+ - -

ShadowRoot Injector lets you repeat templates easily, no JS required!

+ +

ShadowRoot Injector lets you repeat templates easily, no JS required!

- - Pro Tip! - If you want to add more behavior, you can upgrade custom-elements into web-components any time with JavaScript! - + + Pro Tip! + If you want to add more behavior, you can upgrade custom-elements into web-components any time with JavaScript! + -

You can check out the repository on Github.

+

You can check out the repository on Github.

- - PRs Welcome! - You can make git issues or pull requests for any issues you find. - + + PRs Welcome! + You can make git issues or pull requests for any issues you find. + ``` ### Why? @@ -71,75 +72,56 @@ associated with building javascript class definitions. ## How to use -You can include ShadowRoot Injector by using a CDN of your choice. In the script tag you can include `sr-autostart` to -automatically kick off the mutation observers that look for and inject shadow root templates. +You can include ShadowRoot Injector by using a CDN of your choice. ```html - + ``` You can also use the minified version by pointing to the minified asset ```html - + ``` ### HTML API -The HTML API is completely driven by attributes on the `