Frontend/src/components/AcceptCookies.tsx

42 lines
1.3 KiB
TypeScript

import React from "react";
import { Button } from "./Button/Button";
import Typography from "./typography/Typography";
type AcceptCookiesProps = {
onClickAccept?: () => void;
onClickCustomise?: () => void;
};
export function AcceptCookies({
onClickAccept,
onClickCustomise,
}: AcceptCookiesProps) {
return (
<div className="px-12 py-4 w-full bg-blue-900 flex justify-between items-center">
<div className="w-2/3 text-white pr-3">
<Typography>
By clicking Accept All Cookies, you agree to the storing of cookies
on your device to enhance site navigation, analyze site usage, and
assist in our marketing efforts.
</Typography>
</div>
<div className="flex w-1/3 flex-col-reverse lg:flex-row items-center lg:space-x-5 lg:justify-end ">
<Button
onClick={onClickCustomise}
defaultStyle={false}
className="bg-tranparent hover:bg-blue-200 active:bg-blue-400 focus:bg-none focus:outline-none text-blue-700"
>
Customize settings
</Button>
<Button
onClick={onClickAccept}
emphasis="high"
className="focus:outline-none"
>
Accept all cookies
</Button>
</div>
</div>
);
}