98552163a8
Complete frontend implementation with: - Next.js 16 with App Router and TypeScript - Tailwind CSS v4 with custom violet theme - shadcn/ui components with Lucide React icons - Landing page with hero, services, pricing, testimonials, FAQ - Service selection page with toggle - Login/Register pages with social auth UI - Multi-step checkout flow - Client dashboard with stats, projects, support tickets - Billing page with subscription, payment methods, invoices - All mock data and TypeScript types 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
27 lines
900 B
TypeScript
27 lines
900 B
TypeScript
import { Card, CardContent } from '@/components/ui/card'
|
|
import { LucideIcon } from 'lucide-react'
|
|
|
|
interface ServiceCardProps {
|
|
icon: LucideIcon
|
|
title: string
|
|
description: string
|
|
}
|
|
|
|
export function ServiceCard({ icon: Icon, title, description }: ServiceCardProps) {
|
|
return (
|
|
<Card className="glow-card bg-card border-border hover:border-primary transition-all duration-300 rounded-xl">
|
|
<CardContent className="p-6">
|
|
<div className="flex flex-col gap-4">
|
|
<div className="p-3 bg-primary/10 text-primary rounded-xl w-fit">
|
|
<Icon className="w-8 h-8" />
|
|
</div>
|
|
<div className="flex flex-col gap-2">
|
|
<h3 className="text-foreground font-bold text-xl">{title}</h3>
|
|
<p className="text-muted-foreground text-sm leading-relaxed">{description}</p>
|
|
</div>
|
|
</div>
|
|
</CardContent>
|
|
</Card>
|
|
)
|
|
}
|