97 lines
2.2 KiB
TypeScript
97 lines
2.2 KiB
TypeScript
|
import { useState, useEffect } from "react";
|
||
|
|
import Link from "next/link";
|
||
|
|
|
||
|
|
export default function CookieConsent() {
|
||
|
|
const [visible, setVisible] = useState(false);
|
||
|
|
|
||
|
|
useEffect(() => {
|
||
|
|
try {
|
||
|
|
const consent = localStorage.getItem("blb_cookie_consent");
|
||
|
|
if (!consent) {
|
||
|
|
setVisible(true);
|
||
|
|
}
|
||
|
|
} catch {
|
||
|
|
// localStorage not available
|
||
|
|
}
|
||
|
|
}, []);
|
||
|
|
|
||
|
|
function accept() {
|
||
|
|
try {
|
||
|
|
localStorage.setItem("blb_cookie_consent", "true");
|
||
|
|
} catch {
|
||
|
|
// ignore
|
||
|
|
}
|
||
|
|
setVisible(false);
|
||
|
|
}
|
||
|
|
|
||
|
|
if (!visible) return null;
|
||
|
|
|
||
|
|
return (
|
||
|
|
<div
|
||
|
|
style={{
|
||
|
|
position: "fixed",
|
||
|
|
bottom: 0,
|
||
|
|
left: 0,
|
||
|
|
right: 0,
|
||
|
|
zIndex: 9999,
|
||
|
|
background: "#1a1510",
|
||
|
|
borderTop: "1px solid rgba(232,220,200,0.18)",
|
||
|
|
padding: "16px 24px",
|
||
|
|
display: "flex",
|
||
|
|
flexWrap: "wrap",
|
||
|
|
alignItems: "center",
|
||
|
|
gap: "12px",
|
||
|
|
justifyContent: "space-between",
|
||
|
|
}}
|
||
|
|
>
|
||
|
|
<p
|
||
|
|
style={{
|
||
|
|
color: "#e8dcc8",
|
||
|
|
fontSize: "0.92rem",
|
||
|
|
lineHeight: 1.5,
|
||
|
|
maxWidth: "680px",
|
||
|
|
margin: 0,
|
||
|
|
}}
|
||
|
|
>
|
||
|
|
We use cookies to improve your experience and analyze site traffic. By
|
||
|
|
continuing, you agree to our cookie policy.
|
||
|
|
</p>
|
||
|
|
<div style={{ display: "flex", gap: "10px", flexShrink: 0 }}>
|
||
|
|
<Link
|
||
|
|
href="/privacy"
|
||
|
|
style={{
|
||
|
|
padding: "9px 18px",
|
||
|
|
border: "1px solid rgba(232,220,200,0.3)",
|
||
|
|
borderRadius: "4px",
|
||
|
|
color: "#e8dcc8",
|
||
|
|
fontSize: "0.88rem",
|
||
|
|
cursor: "pointer",
|
||
|
|
background: "transparent",
|
||
|
|
textDecoration: "none",
|
||
|
|
lineHeight: 1,
|
||
|
|
display: "inline-flex",
|
||
|
|
alignItems: "center",
|
||
|
|
}}
|
||
|
|
>
|
||
|
|
Privacy Policy
|
||
|
|
</Link>
|
||
|
|
<button
|
||
|
|
onClick={accept}
|
||
|
|
style={{
|
||
|
|
padding: "9px 18px",
|
||
|
|
background: "#c0392b",
|
||
|
|
border: "none",
|
||
|
|
borderRadius: "4px",
|
||
|
|
color: "#e8dcc8",
|
||
|
|
fontSize: "0.88rem",
|
||
|
|
cursor: "pointer",
|
||
|
|
fontWeight: 600,
|
||
|
|
}}
|
||
|
|
>
|
||
|
|
Accept
|
||
|
|
</button>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
}
|