[V0_FILE]plaintext:file=".gitignore" # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. # dependencies /node_modules # next.js /.next/ /out/ # production /build # debug npm-debug.log* yarn-debug.log* yarn-error.log* .pnpm-debug.log* # env files .env* # vercel .vercel # typescript *.tsbuildinfo next-env.d.ts [V0_FILE]markdown:file="README.md" # TrendyKid Navigator Landing Page *Automatically synced with your [v0.app](https://v0.app) deployments* [![Deployed on Vercel](https://img.shields.io/badge/Deployed%20on-Vercel-black?style=for-the-badge&logo=vercel)](https://vercel.com/ekaterinamelnik00-6514s-projects/v0-trendy-kid-navigator-landing-page) [![Built with v0](https://img.shields.io/badge/Built%20with-v0.app-black?style=for-the-badge)](https://v0.app/chat/uByhsNhK4va) ## Overview This repository will stay in sync with your deployed chats on [v0.app](https://v0.app). Any changes you make to your deployed app will be automatically pushed to this repository from [v0.app](https://v0.app). ## Deployment Your project is live at: **[https://vercel.com/ekaterinamelnik00-6514s-projects/v0-trendy-kid-navigator-landing-page](https://vercel.com/ekaterinamelnik00-6514s-projects/v0-trendy-kid-navigator-landing-page)** ## Build your app Continue building your app on: **[https://v0.app/chat/uByhsNhK4va](https://v0.app/chat/uByhsNhK4va)** ## How It Works 1. Create and modify your project using [v0.app](https://v0.app) 2. Deploy your chats from the v0 interface 3. Changes are automatically pushed to this repository 4. Vercel deploys the latest version from this repository [V0_FILE]css:file="app/globals.css" @import "tailwindcss"; @import "tw-animate-css"; @custom-variant dark (&:is(.dark *)); :root { /* New Clean Tech color scheme: Deep Charcoal, White, Electric Purple/Cyan */ /* Primary: Electric Purple */ --primary: oklch(0.55 0.25 290); --primary-foreground: oklch(0.98 0 0); /* Secondary: Electric Cyan */ --secondary: oklch(0.65 0.22 230); --secondary-foreground: oklch(0.98 0 0); /* Accent: Bright Neon Magenta */ --accent: oklch(0.65 0.28 310); --accent-foreground: oklch(0.98 0 0); /* Neutrals - Deep Charcoal base */ --background: oklch(0.15 0 0); --foreground: oklch(0.98 0 0); --card: oklch(0.2 0.01 280); --card-foreground: oklch(0.98 0 0); --popover: oklch(0.2 0.01 280); --popover-foreground: oklch(0.98 0 0); --muted: oklch(0.35 0.02 280); --muted-foreground: oklch(0.75 0 0); --destructive: oklch(0.62 0.22 25); --destructive-foreground: oklch(0.98 0 0); --border: oklch(0.28 0.02 280); --input: oklch(0.25 0.01 280); --ring: oklch(0.55 0.25 290); --chart-1: oklch(0.55 0.25 290); --chart-2: oklch(0.65 0.22 230); --chart-3: oklch(0.65 0.28 310); --chart-4: oklch(0.6 0.2 270); --chart-5: oklch(0.58 0.24 250); --radius: 0.75rem; --sidebar: oklch(0.2 0.01 280); --sidebar-foreground: oklch(0.98 0 0); --sidebar-primary: oklch(0.55 0.25 290); --sidebar-primary-foreground: oklch(0.98 0 0); --sidebar-accent: oklch(0.65 0.28 310); --sidebar-accent-foreground: oklch(0.15 0 0); --sidebar-border: oklch(0.28 0.02 280); --sidebar-ring: oklch(0.55 0.25 290); } .dark { /* Already in dark mode - these are the same */ --primary: oklch(0.55 0.25 290); --primary-foreground: oklch(0.98 0 0); --secondary: oklch(0.65 0.22 230); --secondary-foreground: oklch(0.15 0 0); --accent: oklch(0.65 0.28 310); --accent-foreground: oklch(0.15 0 0); --background: oklch(0.15 0 0); --foreground: oklch(0.98 0 0); --card: oklch(0.2 0.01 280); --card-foreground: oklch(0.98 0 0); --popover: oklch(0.2 0.01 280); --popover-foreground: oklch(0.98 0 0); --muted: oklch(0.35 0.02 280); --muted-foreground: oklch(0.75 0 0); --destructive: oklch(0.62 0.22 25); --destructive-foreground: oklch(0.98 0 0); --border: oklch(0.28 0.02 280); --input: oklch(0.25 0.01 280); --ring: oklch(0.55 0.25 290); --chart-1: oklch(0.55 0.25 290); --chart-2: oklch(0.65 0.22 230); --chart-3: oklch(0.65 0.28 310); --chart-4: oklch(0.6 0.2 270); --chart-5: oklch(0.58 0.24 250); --sidebar: oklch(0.2 0.01 280); --sidebar-foreground: oklch(0.98 0 0); --sidebar-primary: oklch(0.55 0.25 290); --sidebar-primary-foreground: oklch(0.98 0 0); --sidebar-accent: oklch(0.65 0.28 310); --sidebar-accent-foreground: oklch(0.15 0 0); --sidebar-border: oklch(0.28 0.02 280); --sidebar-ring: oklch(0.55 0.25 290); } @theme inline { --font-sans: "Geist", "Geist Fallback"; --font-mono: "Geist Mono", "Geist Mono Fallback"; --color-background: var(--background); --color-foreground: var(--foreground); --color-card: var(--card); --color-card-foreground: var(--card-foreground); --color-popover: var(--popover); --color-popover-foreground: var(--popover-foreground); --color-primary: var(--primary); --color-primary-foreground: var(--primary-foreground); --color-secondary: var(--secondary); --color-secondary-foreground: var(--secondary-foreground); --color-muted: var(--muted); --color-muted-foreground: var(--muted-foreground); --color-accent: var(--accent); --color-accent-foreground: var(--accent-foreground); --color-destructive: var(--destructive); --color-destructive-foreground: var(--destructive-foreground); --color-border: var(--border); --color-input: var(--input); --color-ring: var(--ring); --color-chart-1: var(--chart-1); --color-chart-2: var(--chart-2); --color-chart-3: var(--chart-3); --color-chart-4: var(--chart-4); --color-chart-5: var(--chart-5); --radius-sm: calc(var(--radius) - 4px); --radius-md: calc(var(--radius) - 2px); --radius-lg: var(--radius); --radius-xl: calc(var(--radius) + 4px); --color-sidebar: var(--sidebar); --color-sidebar-foreground: var(--sidebar-foreground); --color-sidebar-primary: var(--sidebar-primary); --color-sidebar-primary-foreground: var(--sidebar-primary-foreground); --color-sidebar-accent: var(--sidebar-accent); --color-sidebar-accent-foreground: var(--sidebar-accent-foreground); --color-sidebar-border: var(--sidebar-border); --color-sidebar-ring: var(--sidebar-ring); } @layer base { * { @apply border-border outline-ring/50; } body { @apply bg-background text-foreground; } } @layer components { /* Glassmorphism effect utility */ .glass { @apply backdrop-blur-xl bg-white/10 border border-white/20; } .glass-secondary { @apply backdrop-blur-lg bg-secondary/10 border border-secondary/20; } .glass-primary { @apply backdrop-blur-lg bg-primary/10 border border-primary/20; } /* Neon glow effects */ .neon-glow-primary { @apply shadow-[0_0_20px_rgba(140,70,220,0.4)]; } .neon-glow-secondary { @apply shadow-[0_0_20px_rgba(100,200,255,0.4)]; } .neon-glow-accent { @apply shadow-[0_0_20px_rgba(200,100,255,0.4)]; } /* Smooth transitions for interactive elements */ .transition-smooth { @apply transition-all duration-300 ease-out; } } [V0_FILE]typescriptreact:file="app/layout.tsx" import type React from "react" import type { Metadata } from "next" import { Geist, Geist_Mono } from "next/font/google" import { Analytics } from "@vercel/analytics/next" import "./globals.css" const _geist = Geist({ subsets: ["latin"] }) const _geistMono = Geist_Mono({ subsets: ["latin"] }) export const metadata: Metadata = { title: "TrendyKid Navigator - Decode Gen-Z Trends & Find Perfect Gifts", description: "Stop guessing what teens want. Understand Gen-Z trends and discover perfect gift ideas with TrendyKid Navigator. Used by 50K+ parents.", generator: "v0.app", icons: { icon: [ { url: "/icon-light-32x32.png", media: "(prefers-color-scheme: light)", }, { url: "/icon-dark-32x32.png", media: "(prefers-color-scheme: dark)", }, { url: "/icon.svg", type: "image/svg+xml", }, ], apple: "/apple-icon.png", }, } export default function RootLayout({ children, }: Readonly<{ children: React.ReactNode }>) { return ( {children} ) } [V0_FILE]typescriptreact:file="app/loading.tsx" export default function Loading() { return null } [V0_FILE]typescriptreact:file="app/page.tsx" "use client" import { useState } from "react" import { ArrowRight, Sparkles, Gift, TrendingUp, Users, Lightbulb, Search, BarChart3, Download, Flame, } from "lucide-react" import { Button } from "@/components/ui/button" export default function Home() { const [selectedAge, setSelectedAge] = useState(null) const [searchQuery, setSearchQuery] = useState("") const trendsByAge: Record< number, Array<{ name: string hypeLevel: number description: string parentialInsight: string platforms: string[] image: string }> > = { 6: [ { name: "Блюї - Товари та Меркендайз", hypeLevel: 95, description: "Мультфільм про пригоди з собакою", parentialInsight: "Це номер 1 шоу для дітей до 10 років. Якісний контент + колекційні іграшки = перемога для батьків.", platforms: ["YouTube", "Disney+"], image: "/bluey-character-toys.jpg", }, { name: "LEGO Набори для Будівництва", hypeLevel: 88, description: "Творчі конструктивні ігри", parentialInsight: "Навчання STEM-фокусоване, яке розвиває навички вирішення проблем. Інвестиція в їх розум.", platforms: ["TikTok", "YouTube"], image: "/colorful-lego-sets.jpg", }, { name: "Колекції Динозаврів", hypeLevel: 82, description: "Захоплення доісторичними створіннями", parentialInsight: "Освітня цікавість до палеонтології. T-Rex популярний серед цієї вікової групи.", platforms: ["Instagram", "YouTube"], image: "/dinosaur-toys-collection.jpg", }, ], 10: [ { name: "Minecraft Конструкторські Набори", hypeLevel: 92, description: "Творча гра будівництва", parentialInsight: "Віртуальна гра перекладена на фізичні іграшки. Фанати ігор хочуть мерч.", platforms: ["TikTok", "YouTube"], image: "/minecraft-lego-kits.jpg", }, { name: "Колекційні Карти (Покемон)", hypeLevel: 89, description: "Карткові ігри колекційного типу", parentialInsight: "Сучасна культура колекціонування. Соціальна валюта серед однолітків. Ціни сильно варіюються.", platforms: ["Instagram", "TikTok"], image: "/pokemon-trading-cards.jpg", }, { name: "Комплекти Наукових Експериментів", hypeLevel: 85, description: "STEM навчальні діяльності", parentialInsight: "Комбо навчання та гри. Популярні серед дітей з 'розумною' ідентичністю в цьому віці.", platforms: ["YouTube", "Instagram"], image: "/science-experiment-kit.jpg", }, ], 12: [ { name: "TikTok Танцювальні Тренди", hypeLevel: 94, description: "Вірусні танці та звукові тренди", parentialInsight: "Формування соціальної ідентичності. Тренди танців змінюються щотижня. Створення відео - їх мова.", platforms: ["TikTok", "Instagram"], image: "/teen-dance-move-video.jpg", }, { name: "Мерч Стрімерів-Геймерів", hypeLevel: 91, description: "Twitch та YouTube Геймінг", parentialInsight: "Паразоціальні відносини з творцями контенту. Носіння мерчу = соціальний статус.", platforms: ["Twitch", "YouTube"], image: "/gaming-streamer-merchandise.jpg", }, { name: "K-Pop та Музичні Фандоми", hypeLevel: 87, description: "Аніме та музичні спільноти", parentialInsight: "Глобальні фан-спільноти. Глибока пристрасть до улюблених груп/артистів.", platforms: ["TikTok", "Instagram"], image: "/kpop-band-merchandise.jpg", }, ], 14: [ { name: "Коке́т Естетика Моди", hypeLevel: 90, description: "Y2K відродження моди", parentialInsight: "Це вірусний символ соціального статусу. Гофровані, милі, ностальгічні. Віби Паріс Гілтон.", platforms: ["TikTok", "Instagram"], image: "/coquette-style-pink-fashion.jpg", }, { name: "Культура Балів Аури", hypeLevel: 93, description: "Культура особистого стилю", parentialInsight: "Невидима соціальна валюта, що вимірює 'крутість'. Висока аура = високий статус.", platforms: ["TikTok", "Instagram"], image: "/cool-aesthetic-lifestyle.jpg", }, { name: "Бренди Сталої Моди", hypeLevel: 84, description: "Екологічно свідомий одяг", parentialInsight: "Gen-Z піклується про планету. Перекупівля + етичні бренди - це соціальний доказ.", platforms: ["Instagram", "TikTok"], image: "/sustainable-eco-fashion.jpg", }, ], } const currentTrends = selectedAge ? trendsByAge[selectedAge] : [] const ages = [6, 10, 12, 14] return (

{/* Navigation - Minimalist with Neon CTA */} {/* Hero Section - With Search Bar */}

Оновлюється кожні 48 годин

Припиніть гадати.{" "} Почніть дарувати.

Найкращий перекладач трендів підлітків на спокій батьків.

setSearchQuery(e.target.value)} className="relative w-full pl-12 pr-4 py-4 glass rounded-xl text-foreground placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-primary transition-smooth" />

{/* Age Selector Section */}

Виберіть вік вашого підлітка

Дивіться тренди, адаптовані для їх вікової групи

{ages.map((age) => ( ))}

{/* Trend Cards Grid - Responsive and Glassmorphic */} {selectedAge && (

Що тренду для {selectedAge === 14 ? "віку 14+" : `віку ${selectedAge}`}

{currentTrends.map((trend, index) => (

{/* Trend Image with Overlay */}

Гаряче

{/* Card Content */}

{/* Trend Name */}

{trend.name}

{/* Parental Insight */}

Переклад для батьків: {trend.parentialInsight}

{/* Hype Meter Progress Bar */}

Метр Популярності {trend.hypeLevel}%

{/* Social Proof Icons */}

Тренду на:

{trend.platforms.map((platform) => (

{platform === "TikTok" && 🎵} {platform === "Instagram" && 📷} {platform === "YouTube" && ▶} {platform === "Twitch" && 👾} {platform === "Discord" && 💬} {platform === "Disney+" && 🎬} {platform}

))}

{/* Find It Now Button */}

))}

)} {/* Problem/Solution Section */}

Плутанина батьків закінчується тут

Ваш підліток говорить мовою трендів та мемів. Ми перекладаємо.

{/* Pain Point 1 */}

❓

Гра вгадування

"TikTok ще актуальний?" Ви постійно в замішанні про те, що насправді хоче ваш підліток.

{/* Pain Point 2 */}

💸

Марна витрата грошей

Подарунки, які не влучають в мету. Та "крута" техніка, яку вони ніколи не використовують. Або гірше, закотування очей.

{/* Pain Point 3 */}

🔍

Втрачена зв'язок

Ви не говорите їх мовою. Розчарування зростає. Розмови згасають.

Чому батьків люблять TrendyKid Navigator

Все що вам потрібно. Нічого більше.

Більш жодних дивних подарунків

Дані на основі доказів означають, що ваш подарунок завжди влучає в мету.

100% Точність Трендів

Реальні дані з TikTok, Instagram, YouTube та інших. Оновлюється постійно.

Економія годин дослідження

Не потрібно прокручувати TikTok або запитувати у підлітка. Ми все робимо за вас.

{/* Features Bento */}

Як це працює

{/* Feature 1 - Large */}

Центр Розуміння Трендів

Відстеження в режимі реального часу того, що насправді тренду в Gen-Z. Від вірусних звуків TikTok до ігрових явищ до рухів сталої моди.

{/* Feature 2 */}

Розумне Підбирання Подарунків

Отримуйте персоналізовані пропозиції подарунків на основі інтересів вашого підлітка та найновіших трендів.

{/* Feature 3 */}

Посібник з Перекладу для Батьків

Простих поясненнь чому підлітків люблять те, що вони люблять (без жаргону підлітків).

{/* Feature 4 */}

Спільнота Батьків

Спілкуйтеся з іншими батьками, які навігують культурою Gen-Z. Поділіться перемогами, задавайте питання.

{/* Social Proof */}

ДОВІРЯЮТЬСЯ БАТЬКАМИ

Приєднуйтесь до тисяч батьків, які тепер дарують з впевненістю

4.9/5

З 2,340+ Відгуків

98%

Кажуть, Дітям Сподобались Подарунки

$2.8K

Середня Економія на Неправильних Подарунках

{/* CTA Section */}

Готові говорити їх мовою?

Почніть розшифровувати тренди та знаходити ідеальні подарунки. Без гадання. Без марної витрати грошей. Просто розумніше батьківство.

Кредитна карта не потрібна. Повний доступ до 500+ трендів. 14-денний безплатний пробний період.

) } [V0_FILE]json:file="components.json" { "$schema": "https://ui.shadcn.com/schema.json", "style": "new-york", "rsc": true, "tsx": true, "tailwind": { "config": "", "css": "app/globals.css", "baseColor": "neutral", "cssVariables": true, "prefix": "" }, "aliases": { "components": "@/components", "utils": "@/lib/utils", "ui": "@/components/ui", "lib": "@/lib", "hooks": "@/hooks" }, "iconLibrary": "lucide" } [V0_FILE]typescriptreact:file="components/theme-provider.tsx" 'use client' import * as React from 'react' import { ThemeProvider as NextThemesProvider, type ThemeProviderProps, } from 'next-themes' export function ThemeProvider({ children, ...props }: ThemeProviderProps) { return {children} } [V0_FILE]typescriptreact:file="components/ui/button.tsx" import * as React from 'react' import { Slot } from '@radix-ui/react-slot' import { cva, type VariantProps } from 'class-variance-authority' import { cn } from '@/lib/utils' const buttonVariants = cva( "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive", { variants: { variant: { default: 'bg-primary text-primary-foreground hover:bg-primary/90', destructive: 'bg-destructive text-white hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60', outline: 'border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50', secondary: 'bg-secondary text-secondary-foreground hover:bg-secondary/80', ghost: 'hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50', link: 'text-primary underline-offset-4 hover:underline', }, size: { default: 'h-9 px-4 py-2 has-[>svg]:px-3', sm: 'h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5', lg: 'h-10 rounded-md px-6 has-[>svg]:px-4', icon: 'size-9', 'icon-sm': 'size-8', 'icon-lg': 'size-10', }, }, defaultVariants: { variant: 'default', size: 'default', }, }, ) function Button({ className, variant, size, asChild = false, ...props }: React.ComponentProps<'button'> & VariantProps & { asChild?: boolean }) { const Comp = asChild ? Slot : 'button' return ( ) } export { Button, buttonVariants } [V0_FILE]typescript:file="lib/utils.ts" import { clsx, type ClassValue } from 'clsx' import { twMerge } from 'tailwind-merge' export function cn(...inputs: ClassValue[]) { return twMerge(clsx(inputs)) } [V0_FILE]javascript:file="next.config.mjs" /** @type {import('next').NextConfig} */ const nextConfig = { typescript: { ignoreBuildErrors: true, }, images: { unoptimized: true, }, } export default nextConfig [V0_FILE]json:file="package.json" { "name": "my-v0-project", "version": "0.1.0", "private": true, "scripts": { "build": "next build", "dev": "next dev", "lint": "eslint .", "start": "next start" }, "dependencies": { "@hookform/resolvers": "^3.10.0", "@radix-ui/react-accordion": "1.2.2", "@radix-ui/react-alert-dialog": "1.1.4", "@radix-ui/react-aspect-ratio": "1.1.1", "@radix-ui/react-avatar": "1.1.2", "@radix-ui/react-checkbox": "1.1.3", "@radix-ui/react-collapsible": "1.1.2", "@radix-ui/react-context-menu": "2.2.4", "@radix-ui/react-dialog": "1.1.4", "@radix-ui/react-dropdown-menu": "2.1.4", "@radix-ui/react-hover-card": "1.1.4", "@radix-ui/react-label": "2.1.1", "@radix-ui/react-menubar": "1.1.4", "@radix-ui/react-navigation-menu": "1.2.3", "@radix-ui/react-popover": "1.1.4", "@radix-ui/react-progress": "1.1.1", "@radix-ui/react-radio-group": "1.2.2", "@radix-ui/react-scroll-area": "1.2.2", "@radix-ui/react-select": "2.1.4", "@radix-ui/react-separator": "1.1.1", "@radix-ui/react-slider": "1.2.2", "@radix-ui/react-slot": "1.1.1", "@radix-ui/react-switch": "1.1.2", "@radix-ui/react-tabs": "1.1.2", "@radix-ui/react-toast": "1.2.4", "@radix-ui/react-toggle": "1.1.1", "@radix-ui/react-toggle-group": "1.1.1", "@radix-ui/react-tooltip": "1.1.6", "@vercel/analytics": "1.3.1", "autoprefixer": "^10.4.20", "class-variance-authority": "^0.7.1", "clsx": "^2.1.1", "cmdk": "1.0.4", "date-fns": "4.1.0", "embla-carousel-react": "8.5.1", "input-otp": "1.4.1", "lucide-react": "^0.454.0", "next": "16.0.10", "next-themes": "^0.4.6", "react": "19.2.0", "react-day-picker": "9.8.0", "react-dom": "19.2.0", "react-hook-form": "^7.60.0", "react-resizable-panels": "^2.1.7", "recharts": "2.15.4", "sonner": "^1.7.4", "tailwind-merge": "^3.3.1", "tailwindcss-animate": "^1.0.7", "vaul": "^1.1.2", "zod": "3.25.76" }, "devDependencies": { "@tailwindcss/postcss": "^4.1.9", "@types/node": "^22", "@types/react": "^19", "@types/react-dom": "^19", "postcss": "^8.5", "tailwindcss": "^4.1.9", "tw-animate-css": "1.3.3", "typescript": "^5" } } [V0_FILE]javascript:file="postcss.config.mjs" /** @type {import('postcss-load-config').Config} */ const config = { plugins: { '@tailwindcss/postcss': {}, }, } export default config [V0_FILE]css:file="styles/globals.css" @import 'tailwindcss'; @import 'tw-animate-css'; @custom-variant dark (&:is(.dark *)); :root { --background: oklch(1 0 0); --foreground: oklch(0.145 0 0); --card: oklch(1 0 0); --card-foreground: oklch(0.145 0 0); --popover: oklch(1 0 0); --popover-foreground: oklch(0.145 0 0); --primary: oklch(0.205 0 0); --primary-foreground: oklch(0.985 0 0); --secondary: oklch(0.97 0 0); --secondary-foreground: oklch(0.205 0 0); --muted: oklch(0.97 0 0); --muted-foreground: oklch(0.556 0 0); --accent: oklch(0.97 0 0); --accent-foreground: oklch(0.205 0 0); --destructive: oklch(0.577 0.245 27.325); --destructive-foreground: oklch(0.577 0.245 27.325); --border: oklch(0.922 0 0); --input: oklch(0.922 0 0); --ring: oklch(0.708 0 0); --chart-1: oklch(0.646 0.222 41.116); --chart-2: oklch(0.6 0.118 184.704); --chart-3: oklch(0.398 0.07 227.392); --chart-4: oklch(0.828 0.189 84.429); --chart-5: oklch(0.769 0.188 70.08); --radius: 0.625rem; --sidebar: oklch(0.985 0 0); --sidebar-foreground: oklch(0.145 0 0); --sidebar-primary: oklch(0.205 0 0); --sidebar-primary-foreground: oklch(0.985 0 0); --sidebar-accent: oklch(0.97 0 0); --sidebar-accent-foreground: oklch(0.205 0 0); --sidebar-border: oklch(0.922 0 0); --sidebar-ring: oklch(0.708 0 0); } .dark { --background: oklch(0.145 0 0); --foreground: oklch(0.985 0 0); --card: oklch(0.145 0 0); --card-foreground: oklch(0.985 0 0); --popover: oklch(0.145 0 0); --popover-foreground: oklch(0.985 0 0); --primary: oklch(0.985 0 0); --primary-foreground: oklch(0.205 0 0); --secondary: oklch(0.269 0 0); --secondary-foreground: oklch(0.985 0 0); --muted: oklch(0.269 0 0); --muted-foreground: oklch(0.708 0 0); --accent: oklch(0.269 0 0); --accent-foreground: oklch(0.985 0 0); --destructive: oklch(0.396 0.141 25.723); --destructive-foreground: oklch(0.637 0.237 25.331); --border: oklch(0.269 0 0); --input: oklch(0.269 0 0); --ring: oklch(0.439 0 0); --chart-1: oklch(0.488 0.243 264.376); --chart-2: oklch(0.696 0.17 162.48); --chart-3: oklch(0.769 0.188 70.08); --chart-4: oklch(0.627 0.265 303.9); --chart-5: oklch(0.645 0.246 16.439); --sidebar: oklch(0.205 0 0); --sidebar-foreground: oklch(0.985 0 0); --sidebar-primary: oklch(0.488 0.243 264.376); --sidebar-primary-foreground: oklch(0.985 0 0); --sidebar-accent: oklch(0.269 0 0); --sidebar-accent-foreground: oklch(0.985 0 0); --sidebar-border: oklch(0.269 0 0); --sidebar-ring: oklch(0.439 0 0); } @theme inline { --font-sans: 'Geist', 'Geist Fallback'; --font-mono: 'Geist Mono', 'Geist Mono Fallback'; --color-background: var(--background); --color-foreground: var(--foreground); --color-card: var(--card); --color-card-foreground: var(--card-foreground); --color-popover: var(--popover); --color-popover-foreground: var(--popover-foreground); --color-primary: var(--primary); --color-primary-foreground: var(--primary-foreground); --color-secondary: var(--secondary); --color-secondary-foreground: var(--secondary-foreground); --color-muted: var(--muted); --color-muted-foreground: var(--muted-foreground); --color-accent: var(--accent); --color-accent-foreground: var(--accent-foreground); --color-destructive: var(--destructive); --color-destructive-foreground: var(--destructive-foreground); --color-border: var(--border); --color-input: var(--input); --color-ring: var(--ring); --color-chart-1: var(--chart-1); --color-chart-2: var(--chart-2); --color-chart-3: var(--chart-3); --color-chart-4: var(--chart-4); --color-chart-5: var(--chart-5); --radius-sm: calc(var(--radius) - 4px); --radius-md: calc(var(--radius) - 2px); --radius-lg: var(--radius); --radius-xl: calc(var(--radius) + 4px); --color-sidebar: var(--sidebar); --color-sidebar-foreground: var(--sidebar-foreground); --color-sidebar-primary: var(--sidebar-primary); --color-sidebar-primary-foreground: var(--sidebar-primary-foreground); --color-sidebar-accent: var(--sidebar-accent); --color-sidebar-accent-foreground: var(--sidebar-accent-foreground); --color-sidebar-border: var(--sidebar-border); --color-sidebar-ring: var(--sidebar-ring); } @layer base { * { @apply border-border outline-ring/50; } body { @apply bg-background text-foreground; } } [V0_FILE]json:file="tsconfig.json" { "compilerOptions": { "lib": ["dom", "dom.iterable", "esnext"], "allowJs": true, "target": "ES6", "skipLibCheck": true, "strict": true, "noEmit": true, "esModuleInterop": true, "module": "esnext", "moduleResolution": "bundler", "resolveJsonModule": true, "isolatedModules": true, "jsx": "preserve", "incremental": true, "plugins": [ { "name": "next" } ], "paths": { "@/*": ["./*"] } }, "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"], "exclude": ["node_modules"] } [V0_FILE]png:file="public/apple-icon.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_MmvM9I5VwEhPADR5ju9EzqtL7Sni/IbCKqe8aOyKCr3C9s15usz/public/apple-icon.png" [V0_FILE]jpg:file="public/bluey-character-toys.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_MmvM9I5VwEhPADR5ju9EzqtL7Sni/OhuTCS4nDSE7wLonmlaMj2/public/bluey-character-toys.jpg" [V0_FILE]jpg:file="public/colorful-lego-sets.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_MmvM9I5VwEhPADR5ju9EzqtL7Sni/R2yY5m4cX-xsb9Kx6chzr_/public/colorful-lego-sets.jpg" [V0_FILE]jpg:file="public/cool-aesthetic-lifestyle.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_MmvM9I5VwEhPADR5ju9EzqtL7Sni/btzxvuaqF7x0Fj1xpnNaPE/public/cool-aesthetic-lifestyle.jpg" [V0_FILE]jpg:file="public/coquette-style-pink-fashion.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_MmvM9I5VwEhPADR5ju9EzqtL7Sni/dnCibhUSD1OzHhoFWrjN7p/public/coquette-style-pink-fashion.jpg" [V0_FILE]jpg:file="public/dinosaur-toys-collection.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_MmvM9I5VwEhPADR5ju9EzqtL7Sni/wiCRM6BFuWyMOI46s4orQh/public/dinosaur-toys-collection.jpg" [V0_FILE]jpg:file="public/gaming-streamer-merchandise.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_MmvM9I5VwEhPADR5ju9EzqtL7Sni/Vki3BA-Jj68YIa6kMBA-3P/public/gaming-streamer-merchandise.jpg" [V0_FILE]png:file="public/icon-dark-32x32.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_MmvM9I5VwEhPADR5ju9EzqtL7Sni/_NLAIkeVwoL6vEzK2uSXmZ/public/icon-dark-32x32.png" [V0_FILE]png:file="public/icon-light-32x32.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_MmvM9I5VwEhPADR5ju9EzqtL7Sni/DVnRdScnZe8NA9byc6_b4H/public/icon-light-32x32.png" [V0_FILE]xml:file="public/icon.svg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_MmvM9I5VwEhPADR5ju9EzqtL7Sni/l2-w3jDSPuRqpmK6lDq3GH/public/icon.svg" [V0_FILE]jpg:file="public/kpop-band-merchandise.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_MmvM9I5VwEhPADR5ju9EzqtL7Sni/RWuwTm6vMePmZ4TuiDXrOp/public/kpop-band-merchandise.jpg" [V0_FILE]jpg:file="public/minecraft-lego-kits.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_MmvM9I5VwEhPADR5ju9EzqtL7Sni/HOjZ4vkY23MTEDZ6uwGh8C/public/minecraft-lego-kits.jpg" [V0_FILE]png:file="public/placeholder-logo.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_MmvM9I5VwEhPADR5ju9EzqtL7Sni/1uv3SMJqY6_jxcFCTgTEak/public/placeholder-logo.png" [V0_FILE]xml:file="public/placeholder-logo.svg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_MmvM9I5VwEhPADR5ju9EzqtL7Sni/XB_XF8ESrwbAjotfOd5Wmb/public/placeholder-logo.svg" [V0_FILE]jpg:file="public/placeholder-user.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_MmvM9I5VwEhPADR5ju9EzqtL7Sni/ONejAluG3EJATcwwA61bXn/public/placeholder-user.jpg" [V0_FILE]jpg:file="public/placeholder.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_MmvM9I5VwEhPADR5ju9EzqtL7Sni/BlrBc_c6JuPtjsBHFMcNJn/public/placeholder.jpg" [V0_FILE]xml:file="public/placeholder.svg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_MmvM9I5VwEhPADR5ju9EzqtL7Sni/J0QvC3Vjlpi92ZtRdLC4Mx/public/placeholder.svg" [V0_FILE]jpg:file="public/pokemon-trading-cards.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_MmvM9I5VwEhPADR5ju9EzqtL7Sni/1_1YBP9nF1Z81F1oEqqRxW/public/pokemon-trading-cards.jpg" [V0_FILE]jpg:file="public/science-experiment-kit.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_MmvM9I5VwEhPADR5ju9EzqtL7Sni/uOLBIUyQqp3uwwYqVPAq3w/public/science-experiment-kit.jpg" [V0_FILE]jpg:file="public/sustainable-eco-fashion.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_MmvM9I5VwEhPADR5ju9EzqtL7Sni/u08dNQUfMv58_jOY8H__te/public/sustainable-eco-fashion.jpg" [V0_FILE]jpg:file="public/teen-dance-move-video.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_MmvM9I5VwEhPADR5ju9EzqtL7Sni/rUX-vz2x5IOKI68a8Q2e6f/public/teen-dance-move-video.jpg"