diff --git a/components/core/Featurebar/Featurebar.tsx b/components/core/Featurebar/Featurebar.tsx index 3deac9454..b616cc148 100644 --- a/components/core/Featurebar/Featurebar.tsx +++ b/components/core/Featurebar/Featurebar.tsx @@ -6,11 +6,12 @@ interface Props { className?: string title: string description: string + action?: React.ReactNode } -const Featurebar: FC = ({ title, description, className }) => { +const Featurebar: FC = ({ title, description, className, action }) => { const rootClassName = cn( - 'hidden py-2 px-6 bg-accents-1 border-b border-accents-2 text-base text-sm text-gray-600 md:flex flex-row justify-center items-center font-medium border-b border-accents-1', + 'transition-transform transform duration-500 ease-out p-6 bg-primary text-base text-sm md:flex flex-row justify-center items-center font-medium fixed bottom-0 w-full z-10', className ) return ( @@ -18,6 +19,7 @@ const Featurebar: FC = ({ title, description, className }) => { {title} {description} + {action && action} ) } diff --git a/components/core/Layout/Layout.tsx b/components/core/Layout/Layout.tsx index 3c679ab2f..76adc4630 100644 --- a/components/core/Layout/Layout.tsx +++ b/components/core/Layout/Layout.tsx @@ -1,9 +1,10 @@ -import { FC } from 'react' +import { FC, useState } from 'react' import cn from 'classnames' import type { Page } from '@lib/bigcommerce/api/operations/get-all-pages' import { CommerceProvider } from '@lib/bigcommerce' import { Navbar, Featurebar, Footer } from '@components/core' import { Container, Sidebar } from '@components/ui' +import Button from '@components/ui/Button' import { CartSidebarView } from '@components/cart' import { useUI } from '@components/ui/context' import s from './Layout.module.css' @@ -16,14 +17,11 @@ interface Props { const Layout: FC = ({ children, pageProps }) => { const { displaySidebar, closeSidebar } = useUI() + const [acceptedCookies, setAcceptedCookies] = useState(false) return (
- @@ -32,6 +30,16 @@ const Layout: FC = ({ children, pageProps }) => { + setAcceptedCookies(true)}> + Accept cookies + + } + className={cn({ 'translate-y-full': acceptedCookies })} + />
)