add fun moving gradient on login screen

d-ivashchuk · Mar 27, 2024 · 68b46a3 · 68b46a3
1 parent 7b9f4a8
commit 68b46a3
Show file tree

Hide file tree

Showing 4 changed files with 55 additions and 12 deletions.
diff --git a/package.json b/package.json
@@ -41,6 +41,7 @@
     "superjson": "^2.2.1",
     "tailwind-merge": "^2.2.2",
     "tailwindcss-animate": "^1.0.7",
+    "uvcanvas": "^0.2.1",
     "zod": "^3.22.4"
   },
   "devDependencies": {

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
diff --git a/src/components/patterns/login-screen.tsx b/src/components/patterns/login-screen.tsx
@@ -1,7 +1,7 @@
 "use client";
 
 import { signIn } from "next-auth/react";
-import Image from "next/image";
+import { Novatrix } from "uvcanvas";
 
 import { Button } from "~/components/ui/button";
 
@@ -29,14 +29,8 @@ export function LoginScreen() {
           </div>
         </div>
       </div>
-      <div className="hidden bg-muted lg:block">
-        <Image
-          src="/placeholder.svg"
-          alt="Image"
-          width="1920"
-          height="1080"
-          className="h-full w-full object-cover dark:brightness-[0.2] dark:grayscale"
-        />
+      <div className="hidden lg:block [&_canvas]:rounded-lg">
+        <Novatrix />
       </div>
     </div>
   );

diff --git a/src/components/providers/index.tsx b/src/components/providers/index.tsx
@@ -35,9 +35,7 @@ const Providers = ({ children }: { children: React.ReactNode }) => {
     <TRPCReactProvider>
       <SessionProvider>
         <PostHogProvider client={posthog}>
-          <PostHogIdentification>
-            <Layout>{children}</Layout>
-          </PostHogIdentification>
+          <PostHogIdentification>{children}</PostHogIdentification>
         </PostHogProvider>
       </SessionProvider>
     </TRPCReactProvider>