Quiz-PDF/Frontend/components/Utilities/Background.tsx

24 lines
727 B
TypeScript

"use client";
import React, { ReactNode } from "react";
const Background = ({ children }: { children: ReactNode }) => {
const isDarkMode = (() =>
typeof window !== "undefined" &&
window.matchMedia &&
window.matchMedia("(prefers-color-scheme: dark)").matches)();
return (
<div
className="h-full relative w-full bg-center bg-no-repeat bg-cover bg-fixed min-h-screen"
style={{
backgroundImage: isDarkMode
? "linear-gradient(rgba(0, 0, 0, 0.7), rgba(135, 80, 156, 0.05)), url(/images/hero.jpg)"
: "linear-gradient(rgba(255, 255, 255, 0.7), rgba(135, 80, 156, 0.05)), url(/images/hero.jpg)",
}}
>
{children}
</div>
);
};
export default Background;