diff --git a/README.md b/README.md index 78f21a1..2e545e2 100644 --- a/README.md +++ b/README.md @@ -1,11 +1,45 @@ # Shadow-DOM-inject-styles A helper function to easily modify Shadow DOM CSS. +## Install +```bash +npm install shadow-dom-inject-styles --save +``` + +## Vanilla JS Example / Demo +[jsfiddle](https://jsfiddle.net/ry4sbnom/1/) + +```html + +``` + +## Typescript Example + ```ts import {injectStyles} from 'shadow-dom-inject-styles'; const toolbar = (this.el.querySelector('ion-header > ion-toolbar') as HTMLElement); - + // language=CSS const styles = ` .toolbar-background { @@ -14,4 +48,4 @@ const styles = ` `; injectStyles(toolbar, '.toolbar-background', styles); -``` \ No newline at end of file +``` diff --git a/package.json b/package.json index 5ba9df4..03b2bb7 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "shadow-dom-inject-styles", - "version": "1.0.1", + "version": "1.0.2", "description": "A helper function to easily modify shadow dom css.", "module": "./dist/index.js", "main": "./dist/index.js", @@ -13,6 +13,18 @@ }, "author": "Adam LaCombe", "license": "MIT", + "keywords": [ + "shadow-dom", + "css", + "styles", + "ionic", + "stencil", + "stenciljs", + "angular", + "vue", + "typescript", + "javascript" + ], "devDependencies": { "@studio/changes": "^1.5.2", "@types/jasmine": "^2.8.8", diff --git a/tsconfig.json b/tsconfig.json index 2810dce..0d544ec 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -5,10 +5,6 @@ "declaration": true, "sourceMap": true, "outDir": "dist", - "typeRoots": [ - "node_modules/@types", - "src/utils" - ], "lib": [ "dom", "es2017" @@ -30,4 +26,4 @@ "node_modules", "dist" ] -} \ No newline at end of file +}