ReFL
/
refl.fr
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Update cookie banner

This commit is contained in:
engboris 2025-12-08 23:09:54 +01:00
parent b9adf70ee2
commit 42e556f1c8
1 changed files with 18 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
src/components/CookieBanner.astro
View File

@ -1,41 +1,44 @@
--- ---
/** /**
* Cookie consent banner component. * Privacy notice banner component.
* Displays a GDPR-compliant cookie consent banner at the bottom of the page. * Displays a GDPR-compliant consent banner at the bottom of the page.
* Manages user consent for analytics cookies via localStorage. * Manages user consent for analytics via localStorage.
* *
* Note: Analytics loading is handled separately in Layout.astro to avoid * Note: Analytics loading is handled separately in Layout.astro to avoid
* ad blockers blocking this script due to analytics-related keywords. * ad blockers blocking this script due to analytics-related keywords.
*
* Element IDs use generic names to avoid ad blocker filter lists that
* target common patterns like "cookie-banner" or "consent-notice".
*/ */
--- ---
<div <div
id="cookie-banner" id="priv-notice"
class="fixed bottom-0 left-0 right-0 z-50 hidden" class="fixed bottom-0 left-0 right-0 z-50 hidden"
role="dialog" role="dialog"
aria-labelledby="cookie-banner-title" aria-labelledby="pn-title"
aria-describedby="cookie-banner-description" aria-describedby="pn-desc"
> >
<div class="bg-base-200 border-t border-base-300 p-4 shadow-lg"> <div class="bg-base-200 border-t border-base-300 p-4 shadow-lg">
<div class="container mx-auto max-w-4xl"> <div class="container mx-auto max-w-4xl">
<div class="flex flex-col sm:flex-row items-start sm:items-center gap-4"> <div class="flex flex-col sm:flex-row items-start sm:items-center gap-4">
<div class="flex-1"> <div class="flex-1">
<h2 id="cookie-banner-title" class="font-semibold mb-1">Cookie Consent</h2> <h2 id="pn-title" class="font-semibold mb-1">Privacy Notice</h2>
<p id="cookie-banner-description" class="text-sm text-base-content/80"> <p id="pn-desc" class="text-sm text-base-content/80">
We use cookies to analyze site traffic. We use analytics to understand how visitors use this site.
<a href="/privacy/" class="link link-primary">Learn more</a> <a href="/privacy/" class="link link-primary">Learn more</a>
</p> </p>
</div> </div>
<div class="flex gap-2 flex-shrink-0"> <div class="flex gap-2 flex-shrink-0">
<button <button
id="cookie-decline" id="pn-decline"
class="btn btn-sm btn-ghost" class="btn btn-sm btn-ghost"
type="button" type="button"
> >
Decline Decline
</button> </button>
<button <button
id="cookie-accept" id="pn-accept"
class="btn btn-sm btn-primary" class="btn btn-sm btn-primary"
type="button" type="button"
> >
@ -49,10 +52,10 @@
<script is:inline> <script is:inline>
(function() { (function() {
var CONSENT_KEY = 'cookie-consent'; var CONSENT_KEY = 'priv-notice';
var banner = document.getElementById('cookie-banner'); var banner = document.getElementById('priv-notice');
var acceptBtn = document.getElementById('cookie-accept'); var acceptBtn = document.getElementById('pn-accept');
var declineBtn = document.getElementById('cookie-decline'); var declineBtn = document.getElementById('pn-decline');
function setConsent(granted) { function setConsent(granted) {
localStorage.setItem(CONSENT_KEY, granted ? 'granted' : 'denied'); localStorage.setItem(CONSENT_KEY, granted ? 'granted' : 'denied');