Skip to content

Commit

Permalink
readme update
Browse files Browse the repository at this point in the history
  • Loading branch information
jwillmer committed Jul 3, 2020
1 parent 011d957 commit 0b1e374
Show file tree
Hide file tree
Showing 2 changed files with 12 additions and 4 deletions.
10 changes: 9 additions & 1 deletion README.md
Original file line number Diff line number Diff line change
@@ -1,3 +1,6 @@
[![Published on webcomponents.org](https://img.shields.io/badge/webcomponents.org-published-blue.svg?style=flat-square)](https://www.webcomponents.org/element/@jwillmer/pattern-component)
[![Published on npmjs.com](https://img.shields.io/npm/v/@jwillmer/pattern-component?style=flat-square)](https://www.npmjs.com/package/@jwillmer/pattern-component)

# CSS Pattern Web Component

This web component creates a background pattern only by using CSS. It is very usefull to quickly create nice looking placeholders for profile pictures.
Expand Down Expand Up @@ -57,6 +60,11 @@ Need help? Check out our docs [here](https://stenciljs.com/docs/my-first-compone

## Using this component

### Script tag

- Put a script tag similar to this `<script src='https://unpkg.com/[email protected]/dist/css3pattern.js'></script>` in the head of your index.html
- Then you can use the element anywhere in your template, JSX, html etc

### Node Modules
- Run `npm install @jwillmer/pattern-component --save`
- Put a script tag similar to this `<script src='node_modules/@jwillmer/pattern-component/dist/css3pattern.js'></script>` in the head of your index.html
Expand All @@ -65,4 +73,4 @@ Need help? Check out our docs [here](https://stenciljs.com/docs/my-first-compone
### In a stencil-starter app
- Run `npm install @jwillmer/pattern-component --save`
- Add an import to the npm packages `import @jwillmer/pattern-component;`
- Then you can use the element anywhere in your template, JSX, html etc
- Then you can use the element anywhere in your template, JSX, html etc
6 changes: 3 additions & 3 deletions package.json
Original file line number Diff line number Diff line change
@@ -1,8 +1,9 @@
{
"name": "@jwillmer/pattern-component",
"version": "0.0.1",
"version": "0.0.2",
"private": false,
"description": "CSS Pattern Component",
"homepage": "https://github.com/jwillmer/pattern-component",
"homepage": "https://jwillmer.github.io/pattern-component/",
"author": "Jens Willmer",
"repository": {
"type": "git",
Expand All @@ -19,7 +20,6 @@
"collection": "dist/collection/collection-manifest.json",
"collection:main": "dist/collection/index.js",
"unpkg": "dist/css3pattern/css3pattern.js",
"publishConfig": { "registry": "https://npm.pkg.github.com/" },
"files": [
"dist/",
"loader/"
Expand Down

0 comments on commit 0b1e374

Please sign in to comment.