EU Cookie Law

package.json

@@ -43,6 +43,7 @@
     "v-img": "^0.2.0",
     "vee-validate": "^2.0.6",
     "vue": "^2.5.16",
+    "vue-cookie-law": "^1.5.0",
     "vue-i18n": "^7.6.0",
     "vue-meta": "^1.5.0",
     "vue-recaptcha": "^1.1.0",

resources/assets/js/lang/en.js

@@ -49,5 +49,7 @@ export const en = {
   'sem_position': 'Back End Web Developer',
 
   'page_not_found': 'Page not found',
-  'clear': 'clear'
+  'clear': 'clear',
+  'cookies_message': 'This website uses cookies to ensure you get the best experience on our website.',
+  'cookies_button_text': 'Got it!'
 }

resources/assets/js/lang/lv.js

@@ -49,5 +49,7 @@ export const lv = {
   'sem_position': 'PHP Programmētājs',
 
   'page_not_found': 'Page not found',
-  'clear': 'Notīrīt'
+  'clear': 'Notīrīt',
+  'cookies_message': 'Lai nodrošinātu vislabāko If interneta lapas darbību, mēs izmantojam sīkdatnes.',
+  'cookies_button_text': 'Sapratu!'
 }

resources/assets/js/layouts/default.vue

@@ -40,19 +40,22 @@
         </v-flex>
       </v-layout>
     </v-footer>
+    <cookie-law :message="$t('cookies_message')" :buttonText="$t('cookies_button_text')" theme="dark-blue"/>
     <back-to-top visible-offset="500"/>
   </v-app>
 </template>
 
 <script>
 import NavBar from '~/partials/NavBar'
 import BackToTop from '../components/BackToTop'
+import CookieLaw from 'vue-cookie-law'
 
 export default {
   name: 'MainLayout',
   components: {
     BackToTop,
-    NavBar
+    NavBar,
+    CookieLaw
   },
   data: () => ({
     appName: window.config.appName,

resources/assets/sass/partials/_global.scss

@@ -65,3 +65,20 @@
     transition: 0.3s;
   }
 }
+
+.Cookie--dark-blue {
+  background: #edeff5;
+  color: #838391;
+  padding: 1.25em;
+
+  .Cookie__button {
+    background: #4b81e8;
+    padding: 0.625em 3.125em;
+    color: #fff;
+    border-radius: 0;
+
+    &:hover {
+      background: darken(#4b81e8, 10%);
+    }
+  }
+}

yarn.lock

@@ -8742,6 +8742,10 @@ timers-browserify@^2.0.2:
   dependencies:
     setimmediate "^1.0.4"
 
+tiny-cookie@^2.1.1:
+  version "2.1.2"
+  resolved "https://registry.yarnpkg.com/tiny-cookie/-/tiny-cookie-2.1.2.tgz#3c25689a07c76438f90209648c143976b0b52bef"
+
 tmp@^0.0.33:
   version "0.0.33"
   resolved "https://registry.yarnpkg.com/tmp/-/tmp-0.0.33.tgz#6d34335889768d21b2bcda0aa277ced3b1bfadf9"
@@ -9270,6 +9274,12 @@ vm-browserify@0.0.4:
   dependencies:
     indexof "0.0.1"
 
+vue-cookie-law@^1.5.0:
+  version "1.5.0"
+  resolved "https://registry.yarnpkg.com/vue-cookie-law/-/vue-cookie-law-1.5.0.tgz#e87ad839515e218ed3608f3aae25000ac06c624a"
+  dependencies:
+    tiny-cookie "^2.1.1"
+
 vue-eslint-parser@^2.0.3:
   version "2.0.3"
   resolved "https://registry.yarnpkg.com/vue-eslint-parser/-/vue-eslint-parser-2.0.3.tgz#c268c96c6d94cfe3d938a5f7593959b0ca3360d1"