feat: implement AI video generator landing page - #1
Merged
Conversation
|
Caution Review failedThe pull request is closed. ℹ️ Recent review info⚙️ Run configurationConfiguration used: defaults Review profile: CHILL Plan: Pro Plus Run ID: ⛔ Files ignored due to path filters (6)
📒 Files selected for processing (93)
📝 WalkthroughWalkthroughChangesVeodit now includes a configured Next.js application with a dark design system, shared content contracts, reusable UI components, and an animated landing page. Project documentation, linting, TypeScript, styling, and package configuration were added. Landing page The page composes navigation, hero, feature, workflow, showcase, comparison, pricing, repository, FAQ, CTA, and footer sections. UI system Reusable controls and layout components use Base UI primitives, Tailwind classes, shared variants, data attributes, responsive behavior, and motion styles. Project setup The project includes Next.js scripts, dependencies, aliases, lint rules, Tailwind processing, and build configuration. Estimated code review effort: 5 (Critical) | ~120 minutes Suggested reviewers: Sequence Diagram(s)sequenceDiagram
participant Browser
participant RootLayout
participant Home
participant LandingSections
Browser->>RootLayout: Request page
RootLayout->>Home: Render children with metadata and theme
Home->>LandingSections: Compose landing sections
LandingSections-->>Browser: Render responsive Veodit landing page
✨ Finishing Touches📝 Generate docstrings
🧪 Generate unit tests (beta)
Comment |
Owner
Author
|
Made landing page |
There was a problem hiding this comment.
Pull request overview
Implements a marketing/landing page for Veodit using the Next.js App Router, adding a set of landing-page sections and a fairly large set of reusable UI components (Base UI + shadcn patterns), along with project scaffolding/config to support Tailwind + TypeScript.
Changes:
- Added a complete landing page composition (
app/page.tsx) with dedicated section components undercomponents/landing/. - Introduced a UI component library under
components/ui/plus shared helpers (lib/utils.ts,lib/animations.ts, hooks, and types). - Added baseline project configuration for Next.js + TypeScript + ESLint + PostCSS/Tailwind and public assets.
Reviewed changes
Copilot reviewed 91 out of 99 changed files in this pull request and generated 11 comments.
Show a summary per file
| File | Description |
|---|---|
| types/index.ts | Adds shared TS interfaces for landing/config data. |
| tsconfig.json | Introduces TypeScript compiler configuration for the app. |
| README.md | Replaces README content with create-next-app template text. |
| public/window.svg | Adds public SVG asset. |
| public/vercel.svg | Adds public SVG asset. |
| public/next.svg | Adds public SVG asset. |
| public/globe.svg | Adds public SVG asset. |
| public/file.svg | Adds public SVG asset. |
| postcss.config.mjs | Adds PostCSS config for Tailwind processing. |
| package.json | Defines Next/React/Tailwind + UI dependencies and scripts. |
| next.config.ts | Adds Next.js configuration stub. |
| lib/utils.ts | Adds cn() helper (clsx + tailwind-merge). |
| lib/animations.ts | Adds shared motion transition/variant presets. |
| hooks/use-mobile.ts | Adds useIsMobile() hook based on matchMedia. |
| eslint.config.mjs | Adds ESLint flat config using Next presets. |
| components/ui/tooltip.tsx | Adds tooltip primitives wrapper with Tailwind styling. |
| components/ui/toggle.tsx | Adds toggle wrapper + CVA variants. |
| components/ui/toggle-group.tsx | Adds toggle-group wrapper + context styling. |
| components/ui/toast.tsx | Adds toast system wrapper around Base UI toast manager. |
| components/ui/textarea.tsx | Adds styled textarea component. |
| components/ui/tabs.tsx | Adds tabs primitives wrapper + styling variants. |
| components/ui/table.tsx | Adds table primitives wrappers. |
| components/ui/switch.tsx | Adds switch primitives wrapper. |
| components/ui/spinner.tsx | Adds spinner component using lucide Loader icon. |
| components/ui/slider.tsx | Adds slider primitives wrapper. |
| components/ui/skeleton.tsx | Adds skeleton loading component. |
| components/ui/sheet.tsx | Adds sheet/dialog wrapper. |
| components/ui/separator.tsx | Adds separator wrapper. |
| components/ui/select.tsx | Adds select primitives wrapper. |
| components/ui/scroll-area.tsx | Adds scroll-area primitives wrapper. |
| components/ui/resizable.tsx | Adds resizable panels wrappers. |
| components/ui/radio-group.tsx | Adds radio group wrappers. |
| components/ui/progress.tsx | Adds progress wrappers. |
| components/ui/popover.tsx | Adds popover wrappers. |
| components/ui/pagination.tsx | Adds pagination components built on Button rendering. |
| components/ui/navigation-menu.tsx | Adds navigation-menu wrappers + styling. |
| components/ui/native-select.tsx | Adds styled native <select> wrapper. |
| components/ui/message.tsx | Adds message layout primitives for chat-like UIs. |
| components/ui/message-scroller.tsx | Adds message scroller wrappers around @shadcn/react message scroller. |
| components/ui/marker.tsx | Adds marker component + variants. |
| components/ui/label.tsx | Adds styled label component. |
| components/ui/kbd.tsx | Adds keyboard key (kbd) display components. |
| components/ui/item.tsx | Adds item/list primitives + variants. |
| components/ui/input.tsx | Adds input wrapper (Base UI Input). |
| components/ui/input-otp.tsx | Adds OTP input wrappers. |
| components/ui/input-group.tsx | Adds input group compound component. |
| components/ui/hover-card.tsx | Adds hover/preview card wrappers. |
| components/ui/field.tsx | Adds field/fieldset layout helpers + error rendering. |
| components/ui/empty.tsx | Adds empty state components + variants. |
| components/ui/direction.tsx | Re-exports Base UI direction provider/hooks. |
| components/ui/dialog.tsx | Adds dialog wrappers. |
| components/ui/context-menu.tsx | Adds context menu wrappers. |
| components/ui/command.tsx | Adds command palette wrappers around cmdk + Dialog. |
| components/ui/collapsible.tsx | Adds collapsible wrappers. |
| components/ui/checkbox.tsx | Adds checkbox wrappers. |
| components/ui/carousel.tsx | Adds carousel wrappers using embla-carousel-react. |
| components/ui/card.tsx | Adds card primitives. |
| components/ui/calendar.tsx | Adds calendar component wrapper around react-day-picker. |
| components/ui/button.tsx | Adds Button wrapper + CVA variants. |
| components/ui/button-group.tsx | Adds button-group layout helpers. |
| components/ui/bubble.tsx | Adds chat bubble compound components + variants. |
| components/ui/breadcrumb.tsx | Adds breadcrumb primitives. |
| components/ui/badge.tsx | Adds badge component + variants. |
| components/ui/avatar.tsx | Adds avatar primitives wrappers. |
| components/ui/attachment.tsx | Adds attachment UI compound components. |
| components/ui/aspect-ratio.tsx | Adds aspect ratio helper component. |
| components/ui/alert.tsx | Adds alert component + variants. |
| components/ui/alert-dialog.tsx | Adds alert-dialog wrappers. |
| components/ui/accordion.tsx | Adds accordion wrappers. |
| components/landing/WhyChooseUs.tsx | Adds “Why Veodit” comparison section. |
| components/landing/TrustedBy.tsx | Adds marquee-style “Trusted by” section. |
| components/landing/Pricing.tsx | Adds pricing section with monthly/yearly toggle. |
| components/landing/index.ts | Exports landing page sections barrel. |
| components/landing/HowItWorks.tsx | Adds workflow steps (“How it works”) section. |
| components/landing/Header.tsx | Adds responsive header with mobile overlay menu. |
| components/landing/GitHubRepo.tsx | Adds GitHub repo promo card/CTA section. |
| components/landing/Footer.tsx | Adds footer with newsletter input + link sections. |
| components/landing/Features.tsx | Adds features grid section. |
| components/landing/FAQ.tsx | Adds FAQ accordion section. |
| components/landing/CTA.tsx | Adds primary call-to-action section. |
| components/icons/github.tsx | Adds GitHub logo SVG component. |
| components.json | Adds shadcn/ui components registry configuration. |
| CLAUDE.md | Adds pointer file to @AGENTS.md. |
| app/page.tsx | Composes the landing page from the section components. |
| app/layout.tsx | Adds root layout, global styles, and metadata. |
| AGENTS.md | Adds Next.js agent rules block. |
| .gitignore | Adds ignore rules for Next.js/node tooling outputs. |
Suppressed comments (1)
components/landing/CTA.tsx:56
- Tailwind’s default spacing scale doesn’t include
h-13, so this utility likely won’t be generated (unless spacing is explicitly extended). Consider using an arbitrary value to preserve the intended height.
<Button
variant="outline"
className="h-13 rounded-2xl border-white/10 bg-white/5 px-8 text-base font-medium text-zinc-300 hover:bg-white/10 hover:text-white transition-all duration-300"
>
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| }, | ||
| }; | ||
|
|
||
| export default function RootLayout({ children }: LayoutProps<"/">) { |
Comment on lines
+1
to
+4
| import { cn } from "@/lib/utils" | ||
| import { Loader2Icon } from "lucide-react" | ||
|
|
||
| function Spinner({ className, ...props }: React.ComponentProps<"svg">) { |
Comment on lines
+1
to
+3
| import { cn } from "@/lib/utils" | ||
|
|
||
| function Skeleton({ className, ...props }: React.ComponentProps<"div">) { |
Comment on lines
+11
to
+22
| style={ | ||
| { | ||
| "--ratio": ratio, | ||
| } as React.CSSProperties | ||
| } | ||
| className={cn("relative aspect-(--ratio)", className)} | ||
| {...props} | ||
| /> | ||
| ) | ||
| } | ||
|
|
||
| export { AspectRatio } |
Comment on lines
+1
to
+4
| import { cn } from "@/lib/utils" | ||
|
|
||
| function Kbd({ className, ...props }: React.ComponentProps<"kbd">) { | ||
| return ( |
Comment on lines
+47
to
+52
| <Button | ||
| className="h-13 rounded-2xl bg-gradient-to-r from-violet-600 to-cyan-500 px-10 text-base font-medium text-white border-0 hover:opacity-90 transition-all duration-300 hover:shadow-[0_0_40px_rgba(139,92,246,0.3)]" | ||
| > | ||
| Start Editing for Free | ||
| <ArrowRight className="size-4 ml-1.5" /> | ||
| </Button> |
Comment on lines
+84
to
+91
| <NavigationMenuPrimitive.Content | ||
| data-slot="navigation-menu-content" | ||
| className={cn( | ||
| "data-ending-style:data-activation-direction=left:translate-x-[50%] data-ending-style:data-activation-direction=right:translate-x-[-50%] data-starting-style:data-activation-direction=left:translate-x-[-50%] data-starting-style:data-activation-direction=right:translate-x-[50%] h-full w-auto p-2 pr-2.5 transition-[opacity,transform,translate] duration-[0.35s] ease-[cubic-bezier(0.22,1,0.36,1)] group-data-[viewport=false]/navigation-menu:rounded-md group-data-[viewport=false]/navigation-menu:bg-popover group-data-[viewport=false]/navigation-menu:text-popover-foreground group-data-[viewport=false]/navigation-menu:shadow group-data-[viewport=false]/navigation-menu:ring-1 group-data-[viewport=false]/navigation-menu:ring-foreground/10 group-data-[viewport=false]/navigation-menu:duration-300 data-ending-style:opacity-0 data-starting-style:opacity-0 data-[motion=from-end]:slide-in-from-right-52 data-[motion=from-start]:slide-in-from-left-52 data-[motion=to-end]:slide-out-to-right-52 data-[motion=to-start]:slide-out-to-left-52 data-[motion^=from-]:animate-in data-[motion^=from-]:fade-in data-[motion^=to-]:animate-out data-[motion^=to-]:fade-out **:data-[slot=navigation-menu-link]:focus:ring-0 **:data-[slot=navigation-menu-link]:focus:outline-none group-data-[viewport=false]/navigation-menu:data-open:animate-in group-data-[viewport=false]/navigation-menu:data-open:fade-in-0 group-data-[viewport=false]/navigation-menu:data-open:zoom-in-95 group-data-[viewport=false]/navigation-menu:data-closed:animate-out group-data-[viewport=false]/navigation-menu:data-closed:fade-out-0 group-data-[viewport=false]/navigation-menu:data-closed:zoom-out-95", | ||
| className | ||
| )} | ||
| {...props} | ||
| /> |
Comment on lines
+57
to
+61
| <AccordionItem | ||
| key={index} | ||
| value={index} | ||
| className="border-b border-white/5" | ||
| > |
Comment on lines
+1
to
+5
| "use client"; | ||
|
|
||
| import type { Variants, Transition } from "motion/react"; | ||
|
|
||
| // ── Shared transition presets ────────────────────────────────────────── |
| @@ -1,2 +1,36 @@ | |||
| # Veodit | |||
| 𝙰𝚗 𝚘𝚙𝚎𝚗-𝚜𝚘𝚞𝚛𝚌𝚎 𝙰𝙸-𝚙𝚘𝚠𝚎𝚛𝚎𝚍 𝚟𝚒𝚍𝚎𝚘 𝚎𝚍𝚒𝚝𝚒𝚗𝚐 𝚙𝚕𝚊𝚝𝚏𝚘𝚛𝚖 𝚝𝚑𝚊𝚝 𝚝𝚛𝚊𝚗𝚜𝚏𝚘𝚛𝚖𝚜 𝚛𝚊𝚠 𝚏𝚘𝚘𝚝𝚊𝚐𝚎 𝚒𝚗𝚝𝚘 𝚙𝚘𝚕𝚒𝚜𝚑𝚎𝚍 𝚟𝚒𝚍𝚎𝚘𝚜 𝚊𝚞𝚝𝚘𝚖𝚊𝚝𝚒𝚌𝚊𝚕𝚕𝚢. | |||
| This is a [Next.js](https://nextjs.org) project bootstrapped with [`create-next-app`](https://nextjs.org/docs/app/api-reference/cli/create-next-app). | |||
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary by CodeRabbit