diff --git a/src/components/configurator/StepServices.tsx b/src/components/configurator/StepServices.tsx index f741913..e99a423 100644 --- a/src/components/configurator/StepServices.tsx +++ b/src/components/configurator/StepServices.tsx @@ -15,31 +15,28 @@ import type { StepProps } from './WizardContainer'; interface ServiceOption { id: string; icon: React.ElementType; - title: string; - description: string; + titleKey: string; + descriptionKey: string; } const SERVICES: ServiceOption[] = [ { id: 'web', icon: Globe, - title: 'Web Design & Development', - description: - 'Bespoke websites and web applications built from scratch — pixel-perfect design, blazing performance, and clean code.', + titleKey: 'services.web.title', + descriptionKey: 'services.web.description', }, { id: 'systems', icon: Cog, - title: 'Custom Systems', - description: - 'Purpose-built CRMs, internal tools, and business platforms crafted to match exactly how your team works.', + titleKey: 'services.systems.title', + descriptionKey: 'services.systems.description', }, { id: 'infrastructure', icon: Server, - title: 'Digital Infrastructure', - description: - 'Private cloud hosting, data sovereignty, DevOps pipelines, and security hardening — your stack, fully owned.', + titleKey: 'services.infrastructure.title', + descriptionKey: 'services.infrastructure.description', }, ]; @@ -78,9 +75,11 @@ interface ServiceCardProps { option: ServiceOption; selected: boolean; onToggle: () => void; + title: string; + description: string; } -function ServiceCard({ option, selected, onToggle }: ServiceCardProps) { +function ServiceCard({ option, selected, onToggle, title, description }: ServiceCardProps) { const Icon = option.icon; return ( @@ -117,9 +116,9 @@ function ServiceCard({ option, selected, onToggle }: ServiceCardProps) { selected ? 'text-primary-dark' : 'text-on-surface', )} > - {option.title} + {title}

-

{option.description}

+

{description}

{/* Checkbox */} @@ -160,9 +159,11 @@ function ServiceCard({ option, selected, onToggle }: ServiceCardProps) { interface AIToggleProps { enabled: boolean; onToggle: () => void; + label: string; + description: string; } -function AIToggle({ enabled, onToggle }: AIToggleProps) { +function AIToggle({ enabled, onToggle, label, description }: AIToggleProps) { return (