83 lines
2.5 KiB
Plaintext
83 lines
2.5 KiB
Plaintext
---
|
|
/**
|
|
* Privacy notice banner component.
|
|
* Displays a GDPR-compliant consent banner at the bottom of the page.
|
|
* Manages user consent for analytics via localStorage.
|
|
*
|
|
* Note: Analytics loading is handled separately in Layout.astro to avoid
|
|
* 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
|
|
id="priv-notice"
|
|
class="fixed bottom-0 left-0 right-0 z-50 hidden"
|
|
role="dialog"
|
|
aria-labelledby="pn-title"
|
|
aria-describedby="pn-desc"
|
|
>
|
|
<div class="bg-base-200 border-t border-base-300 p-4 shadow-lg">
|
|
<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-1">
|
|
<h2 id="pn-title" class="font-semibold mb-1">Privacy Notice</h2>
|
|
<p id="pn-desc" class="text-sm text-base-content/80">
|
|
We use analytics to understand how visitors use this site.
|
|
<a href="/privacy/" class="link link-primary">Learn more</a>
|
|
</p>
|
|
</div>
|
|
<div class="flex gap-2 flex-shrink-0">
|
|
<button
|
|
id="pn-decline"
|
|
class="btn btn-sm btn-ghost"
|
|
type="button"
|
|
>
|
|
Decline
|
|
</button>
|
|
<button
|
|
id="pn-accept"
|
|
class="btn btn-sm btn-primary"
|
|
type="button"
|
|
>
|
|
Accept
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script is:inline>
|
|
(function() {
|
|
var CONSENT_KEY = 'priv-notice';
|
|
var banner = document.getElementById('priv-notice');
|
|
var acceptBtn = document.getElementById('pn-accept');
|
|
var declineBtn = document.getElementById('pn-decline');
|
|
|
|
function setConsent(granted) {
|
|
localStorage.setItem(CONSENT_KEY, granted ? 'granted' : 'denied');
|
|
banner.classList.add('hidden');
|
|
if (granted) {
|
|
window.dispatchEvent(new CustomEvent('consent-granted'));
|
|
}
|
|
}
|
|
|
|
function checkConsent() {
|
|
var consent = localStorage.getItem(CONSENT_KEY);
|
|
if (consent === 'granted') {
|
|
window.dispatchEvent(new CustomEvent('consent-granted'));
|
|
} else if (consent === null) {
|
|
banner.classList.remove('hidden');
|
|
}
|
|
}
|
|
|
|
acceptBtn.addEventListener('click', function() { setConsent(true); });
|
|
declineBtn.addEventListener('click', function() { setConsent(false); });
|
|
|
|
checkConsent();
|
|
})();
|
|
</script>
|