1.0.11 • Published 2 years ago

@norvikit/vue-cookies-consent v1.0.11

Weekly downloads
-
License
MIT
Repository
github
Last release
2 years ago

Vue Cookies Consent

Size Downloads Version

Nice and clean Vue component to display message about cookies

📦 Installation

NPM

npm install --save @norvikit/vue-cookies-consent

Yarn

yarn add @norvikit/vue-cookies-consent

🚀 Usage in Vue Components

<template>
  <vue-cookies-consent>
    <template #title>Some default title for window</template>
    <template #description>
      <p>Some description in window</p>
    </template>
    <template #button>Accept cookies</template>
  </vue-cookies-consent>
</template>

<script>
  import VueCookiesConsent from '@norvikit/vue-cookies-consent'
  export default {
    components: {
      VueCookiesConsent
    }
  }
</script>

🚀 Usage throughout the Vue project

Add this content to main.js

import Vue from "vue";
import VueCookiesConsent from "@norvikit/vue-cookies-consent";
Vue.use(VueCookiesConsent)

🚀 Usage in Nuxt.js

Create a file plugins/vue-cookies-consent.js with the following content:

import Vue from "vue";
import VueCookiesConsent from "@norvikit/vue-cookies-consent";
Vue.use(VueCookiesConsent)

Then add plugin to nuxt.config.js

plugins: [
    {
      src:"plugins/vue-cookies-consent.js", mode:'client'
    }
]

🔧 Props

PropTypeDescriptionExample
colorTitleStringColor of window titlecolor-title="#000000"
colorDescriptionStringColor of window descriptioncolor-description="#000000"
colorButtonStringColor of button textcolor-button="#FFFFFF"
backgroundWindowStringBackground of windowbackground-window="#FFFFFF"
backgroundButtonStringBackground of buttonbackground-button="#C11E31"
backgroundButtonHoverStringBackground of button on hover statebackground-button-hover="#de2b40"
hasShadowBooleanWindow has shadow:has-shadow="true"
borderRadiusNumberBorder radius of window in px:border-radius="16"
offsetYNumberOffset of window by Y in px:offset-y="16"
offsetXNumberOffset of window by X in px:offset-x="16"
positionStringPosition of window: top or bottomposition="top"
saveMethodStringMethod to save window state after accept: ls or cookiessave-method="cookies"

🔧 Events

EventDescriptionExample
shownFired after window is shown@shown="someMethod"
acceptFired after accept button is clicked@accept="someMethod"
lsSavedFired after window state saved to localStorage@ls-saved="someMethod"
cookiesSavedFired after window state saved to Cookies@cookies-saved="someMethod"
hiddenFired after window is hidden@hidden="someMethod"
1.0.11

2 years ago

1.0.10

2 years ago

1.0.9

2 years ago

1.0.8

2 years ago

1.0.7

2 years ago

1.0.6

2 years ago

1.0.5

2 years ago

1.0.4

2 years ago

1.0.3

2 years ago

1.0.2

2 years ago

1.0.1

2 years ago

1.0.0

2 years ago