Live Codepen Example
Installation
Script tag
- Put two script tags similar to this in the head of your index.html:
<script
type="module"
src="https://unpkg.com/@paraboly/pwc-simple-card@latest/dist/pwc-simple-card/pwc-simple-card.esm.js"
></script>
<script
nomodule
src="https://unpkg.com/@paraboly/pwc-simple-card@latest/dist/pwc-simple-card/pwc-simple-card.js"
></script>- Then you can use the element anywhere in your template, JSX, html etc
Node Modules
- Run
npm install @paraboly/pwc-simple-card --save - Put a script tag similar to this
<script src='node_modules/@paraboly/pwc-simple-card/dist/pwc-simple-card.js'></script>in the head of your index.html - Then you can use the element anywhere in your template, JSX, html etc
In a stencil-starter app
- Run
npm install @paraboly/pwc-simple-card --save - Add an import to the npm packages
import @paraboly/pwc-simple-card; - Then you can use the element anywhere in your template, JSX, html etc
Usage
Basic Usage
This is just an example from pwc-simple-card, you need to change it!
<pwc-simple-card
card-title="Lorem Ipsum?"
card-details="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed eget ultricies dui, sed varius ipsum."
></pwc-simple-card>JS Way
This is just an example from pwc-simple-card, you need to change it!
const pwcSimpleCard = document.querySelector("pwc-simple-card");
pwcSimpleCard.source = require("assets/your-img");Future Plans
-
Documentation - Dark Theme
Authors
Mert Uslu, u.mertuslu@gmail.com
License
WebComponent PWC SimpleCard is available under the MIT license.
See the LICENSE file for more info.