diff --git a/src/assets/js/cookieConsent.js b/src/assets/js/cookieConsent.js
new file mode 100644
index 0000000..a11ac9a
--- /dev/null
+++ b/src/assets/js/cookieConsent.js
@@ -0,0 +1,40 @@
+const cookieStorage = {
+ getItem: (key) => {
+ const cookies = document.cookie
+ .split(";")
+ .map((cookie) => cookie.split("="))
+ .reduce(
+ (acc, [key, value]) => ({ ...acc, [key.trim()]: value }), {}
+ );
+ return cookies[key];
+ },
+ setItem: (key, value) => {
+ document.cookie = `${key}=${value}`;
+ },
+ };
+
+ const storageType = cookieStorage;
+ const consentPropertyName = "Audacity_consent";
+
+ const showShowPopup = () => !storageType.getItem(consentPropertyName);
+ const saveToStorage = () =>
+ storageType.setItem(consentPropertyName, true);
+
+ window.onload = () => {
+ const consentPopup = document.getElementById('consent-popup');
+ const acceptBtn = document.getElementById('accept');
+
+ const acceptFn = event => {
+ saveToStorage(storageType);
+ consentPopup.classList.add('hide');
+ }
+
+ acceptBtn.addEventListener('click', acceptFn);
+
+ if (showShowPopup(storageType)) {
+ setTimeout(() => {
+ consentPopup.classList.remove('hide')
+ }, 2000);
+
+ }
+ };
\ No newline at end of file
diff --git a/src/components/banner/CookieConsent.jsx b/src/components/banner/CookieConsent.jsx
new file mode 100644
index 0000000..10c02f4
--- /dev/null
+++ b/src/components/banner/CookieConsent.jsx
@@ -0,0 +1,18 @@
+import React from 'react'
+
+function CookieConsent() {
+ return (
+
+
+ )
+}
+
+export default CookieConsent
+
diff --git a/src/layouts/BaseLayout.astro b/src/layouts/BaseLayout.astro
index 266e647..2395b51 100644
--- a/src/layouts/BaseLayout.astro
+++ b/src/layouts/BaseLayout.astro
@@ -1,8 +1,9 @@
---
import Footer from "../components/footer/Footer.astro";
import NavigationReact from "../components/navigation/NavigationReact";
+import CookieConsent from '../components/banner/CookieConsent'
import { MatomoProvider, createInstance } from "@datapunt/matomo-tracker-react";
-import '../styles/input.css'
+import "../styles/input.css";
import { ViewTransitions } from "astro:transitions";
export interface Props {
@@ -14,16 +15,15 @@ const instance = createInstance({
urlBase: "test",
siteId: 1,
});
-
---
-
+
-
+
{title}
@@ -32,9 +32,10 @@ const instance = createInstance({
-
+
+
+
-
-
+