diff --git a/web/app/[locale]/page.tsx b/web/app/[locale]/page.tsx index e3f1461..e5d36f0 100644 --- a/web/app/[locale]/page.tsx +++ b/web/app/[locale]/page.tsx @@ -1,3 +1,4 @@ +'use client' import Image from "next/image"; import Link from "next/link"; import ReactMarkdown from "react-markdown"; @@ -6,6 +7,8 @@ import { fetchAPI } from "../../lib/api"; import { getTranslation } from "../../utils/translationHelper"; import { StrapiBaseType } from "../../utils/models"; import PageContinue from "./PageContinue"; +import React from 'react' +import { ShaderGradientCanvas, ShaderGradient } from '@shadergradient/react' export const dynamic = "force-dynamic"; type FrontPageFields = StrapiBaseType<{ bodyText: string; @@ -39,6 +42,7 @@ const Home = async ({ params: { locale } }: Props) => { return (
+ { diff --git a/web/app/layout.tsx b/web/app/layout.tsx index 5dde89f..7531da9 100644 --- a/web/app/layout.tsx +++ b/web/app/layout.tsx @@ -4,11 +4,14 @@ import Footer from "../components/Footer"; import Header from "../components/Header"; import Locale from "../components/Locale"; import Timer from "../components/Timer"; +import BackgroundCanvas from "../components/BackgroundCanvas"; import { fetchAPI } from "@/lib/api"; import { StrapiBaseType, StrapiImage, StrapiResponse } from "@/utils/models"; import AppProvider from "../context/AppContext"; import "../styles/global.css"; +import React from 'react' +import { ShaderGradientCanvas, ShaderGradient } from '@shadergradient/react' type PropType = { children: React.ReactNode; @@ -16,6 +19,7 @@ type PropType = { locale: string; }; }; + export const dynamic = "force-dynamic"; const RootLayout = async ({ children }: PropType) => { @@ -23,6 +27,7 @@ const RootLayout = async ({ children }: PropType) => { +
diff --git a/web/components/BackgroundCanvas.tsx b/web/components/BackgroundCanvas.tsx new file mode 100644 index 0000000..5bc7488 --- /dev/null +++ b/web/components/BackgroundCanvas.tsx @@ -0,0 +1,21 @@ +"use client" + +import { ShaderGradientCanvas, ShaderGradient } from '@shadergradient/react'; + +const BackGroundCanvas = () => { + return ( + + + + ); +}; + +export default BackGroundCanvas; diff --git a/web/tailwind.config.ts b/web/tailwind.config.ts index a87cdf9..fcf8d6e 100644 --- a/web/tailwind.config.ts +++ b/web/tailwind.config.ts @@ -30,7 +30,7 @@ const configuration = { darkMode: "class", // class/media theme: { colors: { - primary: getColor(PRIMARY_COLOR, "purple"), + primary: getColor(PRIMARY_COLOR, "blue"), secondary: getColor(SECONDARY_COLOR, "neutral"), transparent: colors.transparent, success: colors.green,