poduck/smoothschedule
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(i18n): Internationalize marketing pages and components

Browse Source 
- HomePage.tsx: Add translation keys for features, testimonials, section titles
- FeaturesPage.tsx: Add translation keys for automation engine, multi-tenancy sections
- Hero.tsx: Add translation keys for headline, CTAs, trust signals, visual content
- ContactPage.tsx: Add translation keys for form headings, success messages
- PricingPage.tsx: Add translation keys for FAQ section
- PrivacyPolicyPage.tsx: Full internationalization of 15-section privacy policy
- TermsOfServicePage.tsx: Full internationalization of 16-section terms of service
- Footer.tsx & Navbar.tsx: Add translation keys for brand name, aria-labels

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
poduck
2025-12-03 22:25:11 -05:00
parent c7f241b30a
commit bc094f2f80
10 changed files with 599 additions and 216 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
frontend/src/components/marketing/Hero.tsx
View File

@@ -21,16 +21,16 @@ const Hero: React.FC = () => {
<div className="inline-flex items-center gap-2 px-3 py-1 rounded-full bg-brand-50 dark:bg-brand-900/30 border border-brand-100 dark:border-brand-800 mb-6">
<span className="flex h-2 w-2 rounded-full bg-brand-600 dark:bg-brand-400 animate-pulse" />
<span className="text-sm font-medium text-brand-700 dark:text-brand-300">
New: Automation Marketplace
{t('marketing.hero.badge')}
</span>
</div>
<h1 className="text-4xl sm:text-5xl lg:text-6xl font-bold tracking-tight text-gray-900 dark:text-white mb-6">
The Operating System for <span className="text-brand-600 dark:text-brand-400">Service Businesses</span>
{t('marketing.hero.title')} <span className="text-brand-600 dark:text-brand-400">{t('marketing.hero.titleHighlight')}</span>
</h1>
<p className="text-lg sm:text-xl text-gray-600 dark:text-gray-400 mb-8 max-w-2xl mx-auto lg:mx-0">
Orchestrate your entire operation with intelligent scheduling and powerful automation. No coding required.
{t('marketing.hero.description')}
</p>
<div className="flex flex-col sm:flex-row gap-4 justify-center lg:justify-start mb-10">
@@ -38,7 +38,7 @@ const Hero: React.FC = () => {
to="/signup"
className="inline-flex items-center justify-center px-6 py-3 text-base font-medium text-white bg-brand-600 hover:bg-brand-700 rounded-lg transition-colors shadow-lg shadow-brand-600/20"
>
Start Free Trial
{t('marketing.hero.startFreeTrial')}
<ArrowRight className="ml-2 h-5 w-5" />
</Link>
<Link
@@ -46,22 +46,22 @@ const Hero: React.FC = () => {
className="inline-flex items-center justify-center px-6 py-3 text-base font-medium text-gray-700 dark:text-gray-200 bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-700 hover:bg-gray-50 dark:hover:bg-gray-700 rounded-lg transition-colors"
>
<Play className="mr-2 h-5 w-5 fill-current" />
Watch Demo
{t('marketing.hero.watchDemo')}
</Link>
</div>
<div className="flex flex-wrap gap-x-8 gap-y-4 justify-center lg:justify-start text-sm text-gray-500 dark:text-gray-400">
<div className="flex items-center gap-2">
<CheckCircle2 className="h-4 w-4 text-green-500" />
<span>No credit card required</span>
<span>{t('marketing.hero.noCreditCard')}</span>
</div>
<div className="flex items-center gap-2">
<CheckCircle2 className="h-4 w-4 text-green-500" />
<span>14-day free trial</span>
<span>{t('marketing.hero.freeTrial')}</span>
</div>
<div className="flex items-center gap-2">
<CheckCircle2 className="h-4 w-4 text-green-500" />
<span>Cancel anytime</span>
<span>{t('marketing.hero.cancelAnytime')}</span>
</div>
</div>
</div>
@@ -74,17 +74,17 @@ const Hero: React.FC = () => {
<div className="inline-flex p-4 bg-brand-500/20 rounded-2xl mb-6">
<CheckCircle2 className="w-16 h-16 text-brand-400" />
</div>
<h3 className="text-2xl font-bold text-white mb-2">Automated Success</h3>
<p className="text-gray-400">Your business, running on autopilot.</p>
<h3 className="text-2xl font-bold text-white mb-2">{t('marketing.hero.visualContent.automatedSuccess')}</h3>
<p className="text-gray-400">{t('marketing.hero.visualContent.autopilot')}</p>
<div className="mt-8 grid grid-cols-2 gap-4">
<div className="bg-gray-800/50 p-3 rounded-lg border border-gray-700">
<div className="text-green-400 font-bold">+24%</div>
<div className="text-xs text-gray-500">Revenue</div>
<div className="text-xs text-gray-500">{t('marketing.hero.visualContent.revenue')}</div>
</div>
<div className="bg-gray-800/50 p-3 rounded-lg border border-gray-700">
<div className="text-blue-400 font-bold">-40%</div>
<div className="text-xs text-gray-500">No-Shows</div>
<div className="text-xs text-gray-500">{t('marketing.hero.visualContent.noShows')}</div>
</div>
</div>
</div>
@@ -96,8 +96,8 @@ const Hero: React.FC = () => {
<CheckCircle2 className="w-6 h-6" />
</div>
<div>
<div className="text-sm font-medium text-gray-900 dark:text-white">Revenue Optimized</div>
<div className="text-xs text-gray-500 dark:text-gray-400">+$2,400 this week</div>
<div className="text-sm font-medium text-gray-900 dark:text-white">{t('marketing.hero.visualContent.revenueOptimized')}</div>
<div className="text-xs text-gray-500 dark:text-gray-400">{t('marketing.hero.visualContent.thisWeek')}</div>
</div>
</div>
</div>