85 lines
1.7 KiB
Vue
85 lines
1.7 KiB
Vue
<template>
|
|
<ClientOnly>
|
|
<BAlert class="cookies" :show="show">
|
|
<div class="cookies-container">
|
|
<span class="title">Uso de cookies</span>
|
|
<p>
|
|
Utilizamos cookies propias y de terceros para mejorar la navegación.
|
|
Si continúa navegando, consideramos que acepta su uso. Puede obtener
|
|
más información, o bien conocer cómo cambiar la configuración, en
|
|
nuestra <NuxtLink to="/page/cookies">Política de cookies</NuxtLink>.
|
|
</p>
|
|
<BButton size="sm" variant="success" @click="close">Aceptar</BButton>
|
|
</div>
|
|
</BAlert>
|
|
</ClientOnly>
|
|
</template>
|
|
|
|
<script>
|
|
import { useAuthStore } from "@/stores/auth";
|
|
import { mapActions } from "pinia";
|
|
export default {
|
|
name: "CookieUsageNotification",
|
|
data() {
|
|
return {
|
|
show: undefined,
|
|
};
|
|
},
|
|
|
|
mounted() {
|
|
const auth = useAuthStore();
|
|
if (auth.cookiesAccepted === true) {
|
|
this.show = false;
|
|
} else {
|
|
this.show = true;
|
|
}
|
|
},
|
|
|
|
methods: {
|
|
...mapActions(useAuthStore, ["acceptCookies"]),
|
|
close() {
|
|
this.show = false;
|
|
this.acceptCookies();
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.cookies {
|
|
z-index: 999;
|
|
position: fixed;
|
|
bottom: 0px;
|
|
right: 8px;
|
|
left: 8px;
|
|
background-color: $color-navy;
|
|
border: none;
|
|
color: $color-light;
|
|
a {
|
|
color: $color-light;
|
|
text-decoration: underline;
|
|
}
|
|
span {
|
|
font-size: $m;
|
|
font-weight: $bold;
|
|
}
|
|
p {
|
|
font-size: $s;
|
|
}
|
|
}
|
|
.cookies-container {
|
|
font-weight: $regular;
|
|
}
|
|
.btn {
|
|
background-color: $color-navy;
|
|
color: $color-light;
|
|
border: 2px solid $color-orange;
|
|
padding: 0.5em 1em;
|
|
margin: auto;
|
|
|
|
&:hover {
|
|
background-color: $color-orange;
|
|
}
|
|
}
|
|
</style>
|