awesome-cookie-consent

Super Awesome Simple Cookie Consent

Downloads in past

Stats

StarsIssuesVersionUpdatedCreatedSize
awesome-cookie-consent
0.0.35 years ago5 years agoMinified + gzip package size for awesome-cookie-consent in KB

Readme

Built With Stencil
Awesome Cookie Consent
A simple and responsive Cookie Consent Banner Webcomponent build with Stencil.

How to use it?

Npm

Include it in your project like this in the head of your index.html:
<script src="https://unpkg.com/awesome-cookie-consent@0.0.3/dist/awesome-cookie-consent.js"></script>

Node Modules

  • Run npm install awesome-cookie-consent --save
  • Put a script tag similar to this <script src='node_modules/awesome-cookie-consent/dist/awesome-cookie-consent.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 awesome-cookie-consent --save
  • Add an import to the npm packages import awesome-cookie-consent;
  • Then you can use the element anywhere in your template, JSX, html etc

Usage

Add Webcomponent with your data to your html file just before the closing body tag:
<awesome-cookie-consent
          url=""
          link=""
          headline=""
          description=""
          button=""
          fontsize=""
          buttoncolor=""
          buttonbackgroundcolor=""
          backgroundcolor=""
          textcolor=""
          headlinecolor=""
  >
  </awesome-cookie-consent>

Properties

url:
URL link to your privacy policy page
link:
Text which is shown at the privacy policy page link
headline
Headline of the banner
description
Description text of the banner
button
Text which is shown at the accept button
fontsize
Font size in pixel used for the banner ( e.g. 18px ), the fallback is 16px
buttoncolor
Hex color code used for the button text ( e.g. #000000 ), the fallback is #ffffff
buttonbackgroundcolor
Hex color code used for the button background ( e.g. #000000 ), the fallback is #e74c3c
backgroundcolor
Hex color code used for the banner background ( e.g. #000000 ), the fallback is #34495e
textcolor
Hex color code used for the banner text ( e.g. #000000 ), the fallback is #ffffff
headlinecolor
Hex color code used for the banner headline ( e.g. #000000 ), the fallback is #ffffff

License

MIT License
By bentzibentz