49 lines
2.8 KiB
HTML
49 lines
2.8 KiB
HTML
{{- /* cookie-consent.html — GDPR consent banner (accept / reject / manage).
|
|
Non-essential scripts stay inert (type="text/plain" data-cookiecategory)
|
|
until the visitor consents; cookie-consent.js then activates them. */ -}}
|
|
<div id="cookie-consent" class="cookie-banner" role="region" aria-label="Cookie consent" hidden>
|
|
<div class="site-container">
|
|
<div class="flex flex-col gap-4 lg:flex-row lg:items-center lg:justify-between">
|
|
<div class="max-w-2xl text-sm text-secondary/80">
|
|
<p class="font-semibold text-secondary">{{ i18n "cookieTitle" }}</p>
|
|
<p class="mt-1">
|
|
We use strictly necessary cookies to run this site and, with your consent, analytics and
|
|
marketing cookies to improve it. You can change your choice at any time.
|
|
{{ with site.GetPage "cookie-policy" }}<a href="{{ .RelPermalink }}" class="font-medium text-primary underline">Read our Cookie Policy</a>.{{ end }}
|
|
</p>
|
|
</div>
|
|
<div class="flex flex-wrap gap-2">
|
|
<button type="button" data-cc-accept-all class="btn-primary">{{ i18n "cookieAcceptAll" }}</button>
|
|
<button type="button" data-cc-reject class="btn-secondary">{{ i18n "cookieReject" }}</button>
|
|
<button type="button" data-cc-manage class="btn-ghost">{{ i18n "cookieManage" }}</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div data-cc-panel hidden class="mt-4">
|
|
<div class="grid gap-3 sm:grid-cols-3">
|
|
<div class="cookie-toggle">
|
|
<input type="checkbox" checked disabled class="mt-1" aria-label="Necessary cookies (always on)">
|
|
<span><span class="block font-semibold text-secondary">{{ i18n "cookieNecessary" }}</span><span class="text-xs text-secondary/70">Always active. Required for core functionality.</span></span>
|
|
</div>
|
|
<label class="cookie-toggle">
|
|
<input type="checkbox" data-cc-category="analytics" class="mt-1">
|
|
<span><span class="block font-semibold text-secondary">{{ i18n "cookieAnalytics" }}</span><span class="text-xs text-secondary/70">Anonymous usage statistics.</span></span>
|
|
</label>
|
|
<label class="cookie-toggle">
|
|
<input type="checkbox" data-cc-category="marketing" class="mt-1">
|
|
<span><span class="block font-semibold text-secondary">{{ i18n "cookieMarketing" }}</span><span class="text-xs text-secondary/70">Personalised offers and campaign measurement.</span></span>
|
|
</label>
|
|
</div>
|
|
<div class="mt-3">
|
|
<button type="button" data-cc-save class="btn-primary">{{ i18n "cookieSave" }}</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
{{/* Example gated script — stays inert until the visitor accepts "analytics".
|
|
Replace the body with your real analytics snippet (e.g. GA4/Plausible). */}}
|
|
<script type="text/plain" data-cookiecategory="analytics">
|
|
// console.log("Analytics enabled after consent");
|
|
</script>
|