From 871efb2aaff1aa3b653771ee030db57a1a36bc70 Mon Sep 17 00:00:00 2001 From: Carla Goncalves Date: Fri, 20 Mar 2026 11:54:33 +0000 Subject: [PATCH 01/23] Add hero + non tested logo parade --- apps/site/package.json | 10 +- apps/site/src/app/(index)/page.tsx | 66 ++++- apps/site/src/app/global.css | 66 ++--- apps/site/src/app/layout.tsx | 12 +- .../src/components/homepage/antigravity.tsx | 190 +++++++++++++ .../site/src/components/homepage/copy-btn.tsx | 44 ++++ apps/site/tailwind.config.ts | 42 +++ packages/eclipse/src/components/button.tsx | 79 +++--- packages/ui/src/components/logo-parade.tsx | 249 ++++++++++++++++++ .../ui/src/components/navigation-menu.tsx | 33 ++- packages/ui/src/styles/globals.css | 45 ++++ pnpm-lock.yaml | 149 +++++++++++ 12 files changed, 869 insertions(+), 116 deletions(-) create mode 100644 apps/site/src/components/homepage/antigravity.tsx create mode 100644 apps/site/src/components/homepage/copy-btn.tsx create mode 100644 apps/site/tailwind.config.ts create mode 100644 packages/ui/src/components/logo-parade.tsx diff --git a/apps/site/package.json b/apps/site/package.json index f89768ff49..2b6ba677bd 100644 --- a/apps/site/package.json +++ b/apps/site/package.json @@ -13,17 +13,19 @@ }, "dependencies": { "@base-ui/react": "catalog:", - "@prisma/eclipse": "workspace:^", "@prisma-docs/ui": "workspace:*", + "@prisma/eclipse": "workspace:^", + "@react-three/fiber": "^9.5.0", "cors": "^2.8.6", "lucide-react": "catalog:", "next": "catalog:", "npm-to-yarn": "catalog:", + "posthog-js": "catalog:", "react": "catalog:", "react-dom": "catalog:", "react-tweet": "catalog:", - "posthog-js": "catalog:", "remark-directive": "catalog:", + "three": "^0.183.2", "zod": "catalog:" }, "devDependencies": { @@ -32,11 +34,11 @@ "@types/node": "catalog:", "@types/react": "catalog:", "@types/react-dom": "catalog:", + "babel-plugin-react-compiler": "catalog:", "next-validate-link": "catalog:", "postcss": "catalog:", "tailwindcss": "catalog:", "tsx": "catalog:", - "typescript": "catalog:", - "babel-plugin-react-compiler": "catalog:" + "typescript": "catalog:" } } diff --git a/apps/site/src/app/(index)/page.tsx b/apps/site/src/app/(index)/page.tsx index 428125b655..a5cce59da7 100644 --- a/apps/site/src/app/(index)/page.tsx +++ b/apps/site/src/app/(index)/page.tsx @@ -1,5 +1,11 @@ +import Antigravity from "../../components/homepage/antigravity"; import type { Metadata } from "next"; -import { SITE_HOME_DESCRIPTION, SITE_HOME_TITLE } from "../../lib/blog-metadata"; +import { + SITE_HOME_DESCRIPTION, + SITE_HOME_TITLE, +} from "../../lib/blog-metadata"; +import { Button } from "@prisma/eclipse"; +import { CopyCode } from "@/components/homepage/copy-btn"; export const metadata: Metadata = { title: SITE_HOME_TITLE, @@ -8,14 +14,56 @@ export const metadata: Metadata = { export default function SiteHome() { return ( -
-

- Prisma Site -

-

- This app is the primary host zone. Content sections are served by their - own zones via routing rules. -

+
+
+
+ +
+
+

+ Postgres,
+ perfectly managed. +

+

+ Real Postgres with the developer experience and infrastructure to + ship faster. +

+
+ + + $ + +  npx prisma init --db + + + +
+
+
); } diff --git a/apps/site/src/app/global.css b/apps/site/src/app/global.css index f0100f4a23..e0876dcd06 100644 --- a/apps/site/src/app/global.css +++ b/apps/site/src/app/global.css @@ -6,84 +6,48 @@ --color-fd-primary: var(--color-stroke-ppg); } -.bg-blog { - background-color: var(--color-background-default); -} - -.bg-blog::after { - content: ""; - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 5000px; - background: linear-gradient( - 0deg, - var(--color-background-default) 95%, - var(--color-background-ppg) 100% - ); - z-index: -1; -} - -.landing-h1 { - color: var(--color-foreground-neutral); - font-variant-numeric: lining-nums tabular-nums slashed-zero; - font-variation-settings: "wdth" 125; - /* title/3xl */ - font-family: var(--font-sans-display); - font-size: 60px; - font-style: normal; - font-weight: 900; - line-height: 120%; /* 120% */ -} - -.newsletter-bg { - background: linear-gradient( - 59deg, - color-mix(in srgb, var(--color-foreground-ppg) 30%, transparent) 6.53%, - var(--color-background-default) 74.71% - ) +body { + background: var(--color-background-default); } @keyframes glitch-1 { 0% { - clip-path: inset(20% 0 60% 0); + clip-path: inset(20% 0 60% 0); } 20% { - clip-path: inset(10% 0 85% 0); + clip-path: inset(10% 0 85% 0); } 40% { - clip-path: inset(40% 0 40% 0); + clip-path: inset(40% 0 40% 0); } 60% { - clip-path: inset(80% 0 5% 0); + clip-path: inset(80% 0 5% 0); } 80% { - clip-path: inset(50% 0 30% 0); + clip-path: inset(50% 0 30% 0); } 100% { - clip-path: inset(25% 0 55% 0); + clip-path: inset(25% 0 55% 0); } - } +} @keyframes glitch-2 { 0% { - clip-path: inset(80% 0 5% 0); + clip-path: inset(80% 0 5% 0); } 20% { - clip-path: inset(50% 0 30% 0); + clip-path: inset(50% 0 30% 0); } 40% { - clip-path: inset(20% 0 60% 0); + clip-path: inset(20% 0 60% 0); } 60% { - clip-path: inset(10% 0 85% 0); + clip-path: inset(10% 0 85% 0); } 80% { - clip-path: inset(40% 0 40% 0); + clip-path: inset(40% 0 40% 0); } 100% { - clip-path: inset(75% 0 15% 0); + clip-path: inset(75% 0 15% 0); } } - diff --git a/apps/site/src/app/layout.tsx b/apps/site/src/app/layout.tsx index 3fac2aaf3e..e67c42da86 100644 --- a/apps/site/src/app/layout.tsx +++ b/apps/site/src/app/layout.tsx @@ -8,6 +8,7 @@ import { SITE_HOME_DESCRIPTION, SITE_HOME_TITLE } from "@/lib/blog-metadata"; import { WebNavigation } from "@prisma-docs/ui/components/web-navigation"; import { Footer } from "@prisma-docs/ui/components/footer"; import { ThemeProvider } from "@prisma-docs/ui/components/theme-provider"; +import { FontAwesomeScript as WebFA } from "@prisma/eclipse"; const inter = Inter({ subsets: ["latin"], @@ -121,16 +122,9 @@ function baseOptions() { export default function Layout({ children }: { children: React.ReactNode }) { return ( - + - +