1.0.3-beta • Published 3 years ago

carepage-widgets v1.0.3-beta

Weekly downloads
-
License
ISC
Repository
-
Last release
3 years ago

Introduction

Collection of external widgets to be co carepage customers.

Getting Started

Installation Guide: 1. NodeJS 16+ 2. Webpack 3. Babel 4. Web components

Build and Test

  • src
    • lib
      • components
      • carepage-xx.js
    • scss
      • xxx.scss
  • index.js
  • index.html
  1. lib - Javascript web components
  2. scss - styling for the web components
  3. index.js - define the customElements created in lib
  4. index.html - export customElements to be used by legacy systems.

npm run develop

Run repo in development mode

npm run build

Build repo to generate minified carepage-widgets.min.js

How to Use

Call carepage-widgets.min.js in your website to use widget components.

  • Set review=stats|percentage to change card stats or percentage.
  • Set arrow=true|false to show arrow icon.
  • Set modal-data=object to override modal texts.
  • Set token & facilityId to access widget.
<body>
  <script src="repo-location/public/carepage-widgets.min.js"></script>
</body>
<carepage-review-rating review="stats">
  <carepage-review-hli></carepage-review-hli>
</carepage-review-rating>

Styling the component

Override variables:

  • --card-font-family -> change font
  • --card-text-color -> change font color
  • --star-color -> change star color
  • --theme-primary-color -> change theme color
  • --theme-circle-color -> change circle wrapper color
  • --card-background -> change card background
  • --backgroud-star-fill -> change radial fill background

In your css you can set variable values.

carepage-review-rating {
  --card-font-family: 'Arial', sans-serif;
  --card-text-color: #321960;
  --star-color: #FF0000;
  --theme-primary-color: green;
  --theme-circle-color: #D6F3F4;
}
0.0.47

3 years ago

1.0.3-beta

3 years ago

1.0.2-beta

3 years ago

1.0.1-beta

3 years ago

0.0.50

3 years ago

1.0.0-beta

3 years ago

0.0.48

3 years ago

0.0.49

3 years ago

0.0.40

3 years ago

0.0.41

3 years ago

0.0.42

3 years ago

0.0.43

3 years ago

0.0.21

3 years ago

0.0.44

3 years ago

0.0.22

3 years ago

0.0.45

3 years ago

0.0.23

3 years ago

0.0.46

3 years ago

0.0.24

3 years ago

0.0.25

3 years ago

0.0.37

3 years ago

0.0.38

3 years ago

0.0.16

3 years ago

0.0.39

3 years ago

0.0.17

3 years ago

0.0.18

3 years ago

0.0.19

3 years ago

0.0.30

3 years ago

0.0.31

3 years ago

0.0.32

3 years ago

0.0.10

3 years ago

0.0.33

3 years ago

0.0.11

3 years ago

0.0.34

3 years ago

0.0.12

3 years ago

0.0.35

3 years ago

0.0.13

3 years ago

0.0.36

3 years ago

0.0.14

3 years ago

0.0.26

3 years ago

0.0.27

3 years ago

0.0.28

3 years ago

0.0.29

3 years ago

0.0.9

3 years ago

0.0.8

3 years ago

0.0.7

3 years ago

0.0.6

3 years ago

0.0.5

3 years ago

0.0.4

3 years ago

0.0.3

3 years ago

0.0.2

3 years ago

0.0.1

3 years ago