[V0_FILE]typescriptreact:file="app/layout.tsx" isFixed="true" isQuickEdit="true" import type { Metadata } from "next" import { Inter } from "next/font/google" import "./globals.css" import { Header } from "@/components/header" import type React from "react" // Added import for React const inter = Inter({ subsets: ["latin"] }) export const metadata: Metadata = { title: "1800 CPAP - CPAP Machines, Masks & Supplies", description: "Shop CPAP machines, masks, and supplies for sleep apnea therapy.", } export default function RootLayout({ children, }: { children: React.ReactNode }) { return (

{children} ) } [V0_FILE]typescriptreact:file="app/page.tsx" import { Hero } from "@/components/hero" import { BrandShowcase } from "@/components/brand-showcase" export default function Home() { return (

) } [V0_FILE]typescriptreact:file="components/header.tsx" import Link from "next/link" import { Phone } from "lucide-react" import { Button } from "@/components/ui/button" import { Input } from "@/components/ui/input" import { MainNav } from "./main-nav" import Image from "next/image" export function Header() { return (

Customer Service- Toll free: 1-800-274-1366

International: 1-513-229-0952

Free Shipping on U.S. Orders Over $49

) } [V0_FILE]typescriptreact:file="components/main-nav.tsx" import Link from "next/link" import { Star } from "lucide-react" const navItems = [ { title: "CPAP Masks", href: "/cpap-masks" }, { title: "CPAP Machines", href: "/cpap-machines" }, { title: "Mask Supplies", href: "/mask-supplies" }, { title: "Machine Supplies", href: "/machine-supplies" }, { title: "Comfort / Cleaning", href: "/comfort-cleaning" }, { title: "Sale", href: "/sale" }, { title: "Top Brands", href: "/brands", icon: Star }, { title: "Subscribe & Save", href: "/subscribe" }, ] export function MainNav() { return ( ) } [V0_FILE]typescriptreact:file="components/hero.tsx" import { Button } from "@/components/ui/button" export function Hero() { return (

Your Best
Sleep Awaits!

From machines to mask and filters, we have everything to make your CPAP therapy easier and more effective.

Discover the best options today!

) } [V0_FILE]typescriptreact:file="components/brand-showcase.tsx" import Image from "next/image" import { Button } from "@/components/ui/button" const brands = [ { name: "ResMed", logo: "/placeholder.svg?height=60&width=150", }, { name: "Philips Respironics", logo: "/placeholder.svg?height=60&width=150", }, { name: "Fisher & Paykel Healthcare", logo: "/placeholder.svg?height=60&width=150", }, { name: "ReActHealth", logo: "/placeholder.svg?height=60&width=150", }, { name: "Risk Free Masks", logo: "/placeholder.svg?height=60&width=150", }, ] export function BrandShowcase() { return (

{brands.map((brand) => (

))}

) } [V0_FILE]css:file="app/globals.css" @tailwind base; @tailwind components; @tailwind utilities; :root { --background: 0 0% 100%; --foreground: 222.2 84% 4.9%; --primary: 201 100% 37%; --primary-foreground: 210 40% 98%; } .dark { --background: 222.2 84% 4.9%; --foreground: 210 40% 98%; } @layer base { body { @apply bg-background text-foreground; } } .container { @apply mx-auto max-w-7xl px-4; } [V0_FILE]typescriptreact:file="tailwind.config.ts" import type { Config } from "tailwindcss" const config = { darkMode: ["class"], content: ["./pages/**/*.{ts,tsx}", "./components/**/*.{ts,tsx}", "./app/**/*.{ts,tsx}", "./src/**/*.{ts,tsx}"], prefix: "", theme: { container: { center: true, padding: "2rem", screens: { "2xl": "1400px", }, }, extend: { colors: { border: "hsl(var(--border))", input: "hsl(var(--input))", ring: "hsl(var(--ring))", background: "hsl(var(--background))", foreground: "hsl(var(--foreground))", primary: { DEFAULT: "hsl(var(--primary))", foreground: "hsl(var(--primary-foreground))", }, }, }, }, plugins: [require("tailwindcss-animate")], } satisfies Config export default config

About

Tags

Share

About

Tags

Share

More from johnpopovich-9305

More Templates Like This

About

Tags

Share

About

Tags

Share

More from johnpopovich-9305

More Templates Like This