You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 

172 lines
4.8 KiB

<template>
<div
class="cookie-bottom-modal d-flex justify-center"
v-if="isCookieHasBeenClicked"
style="z-index: 999"
>
<div class="computer hidden-sm-and-down">
<v-card
flat
max-width="1306"
min-height="80"
class="border-radius-20 py-5 px-8 d-flex justify-space-between mx-5"
style="background-color: rgba(0, 0, 0, 0.75)"
>
<v-card
flat
class="d-flex flex-column tw-mr-[10px]"
color="transparent"
>
<v-card
flat
color="transparent"
class="white--text px-3"
style="font-size: 14px; letter-spacing: 0.02em"
>
{{
$t(
"We use cookies to ensure that we give you the best experience on our website. We also use cookies to ensure we show you advertising that is relevant to you."
)
}}
</v-card>
<v-card
flat
color="transparent"
class="primary--text px-3 tw-body-4"
style="text-decoration: underline"
><nuxt-link :to="localePath('/cookiePolicy')">
{{ $t("Learn More") }}</nuxt-link
></v-card
>
</v-card>
<v-btn
class="remove-upper primary white--text border-radius-16"
width="140"
height="40"
@click="closeCookie()"
>
{{ $t("Got it") }}
</v-btn>
</v-card>
</div>
<div class="tablet d-none d-sm-flex d-md-none">
<v-card
flat
max-width="708"
min-height="171"
class="border-radius-20 py-5 px-7 mx-5 d-flex flex-column justify-space-between"
style="background-color: rgba(0, 0, 0, 0.75)"
>
<v-card flat class="d-flex flex-column" color="transparent">
<v-card
flat
color="transparent"
class="white--text"
style="font-size: 14px; letter-spacing: 0.02em"
>
{{
$t(
"We use cookies to ensure that we give you the best experience on our website. We also use cookies to ensure we show you advertising that is relevant to you."
)
}}
</v-card>
<v-card
flat
color="transparent"
class="primary--text tw-body-4"
style="text-decoration: underline"
><nuxt-link :to="localePath('/cookiePolicy')">
{{ $t("Learn More") }}</nuxt-link
></v-card
>
</v-card>
<v-btn
class="remove-upper primary white--text border-radius-16"
max-width="648"
height="40"
@click="closeCookie()"
>
{{ $t("Got it") }}
</v-btn>
</v-card>
</div>
<div class="phone hidden-sm-and-up">
<v-card
flat
max-width="384"
min-height="164"
class="border-radius-20 py-5 px-7 mx-5 d-flex flex-column justify-space-between"
style="background-color: rgba(0, 0, 0, 0.75)"
>
<v-card flat class="d-flex flex-column" color="transparent">
<v-card
flat
color="transparent"
class="white--text"
style="font-size: 14px; letter-spacing: 0.02em; line-height: 16px"
>
{{
$t(
"We use cookies to ensure that we give you the best experience on our website. We also use cookies to ensure we show you advertising that is relevant to you."
)
}}
</v-card>
<v-card
flat
color="transparent"
class="primary--text tw-body-4 tw-mb-[20px]"
style="text-decoration: underline"
><nuxt-link :to="localePath('/cookiePolicy')">
{{ $t("Learn More") }}</nuxt-link
></v-card
>
</v-card>
<v-btn
class="remove-upper primary white--text border-radius-16"
max-width="344"
height="40"
@click="closeCookie()"
>
{{ $t("Got it") }}
</v-btn>
</v-card>
</div>
</div>
</template>
<script>
export default {
data() {
return {
privacyPolicy: true,
isCookieHasBeenClicked: true,
};
},
created(){
if(process.client){
let storeCache = this.$cookies.get("storeCache");
if(storeCache!=undefined){
this.isCookieHasBeenClicked = JSON.parse(storeCache);
}
}
},
methods:{
closeCookie(){
if(process.client){
this.isCookieHasBeenClicked = false;
this.$cookies.set("storeCache",JSON.stringify(false),1);
}
}
}
};
</script>
<style>
.cookie-bottom-modal {
position: fixed;
bottom: 40px;
width: 100%;
}
</style>