diff --git a/app/en/services/client.tsx b/app/en/services/client.tsx index 7fbf67b..b8bba94 100644 --- a/app/en/services/client.tsx +++ b/app/en/services/client.tsx @@ -8,6 +8,7 @@ import { ArrowLeft, Cloud, Bot, Settings, Database, Code, Zap, Server, Monitor, import { Button } from '@/components/ui/button'; import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card'; import { useLanguage } from '@/contexts/LanguageContext'; +import { AuroraBackground } from '@/components/ui/aurora-background'; interface TechIconProps { name: string; @@ -174,223 +175,225 @@ export default function ServicesClient() { ]; return ( -
- {/* Header */} -
-
-
- - - {t('common.backToHome')} - -
/
-
{t('common.services')}
+ +
+ {/* Header */} +
+
+
+ + + {t('common.backToHome')} + +
/
+
{t('common.services')}
+
-
-
+ - {/* Hero Section */} -
-
-
-
-

-

- {t('services.subtitle')} -

+ {/* Hero Section */} +
+ {/* Removed bg-gradient-to-br background */} +
+
+

+

+ {t('services.subtitle')} +

+

-

-
+ - {/* Stats Section with Icons */} -
-
-
- {stats.map((stat, index) => { - const Icon = stat.icon; - return ( -
- - -
{stat.number}
-
{stat.label}
- -
- ); - })} + {/* Stats Section with Icons */} +
+
+
+ {stats.map((stat, index) => { + const Icon = stat.icon; + return ( +
+ + +
{stat.number}
+
{stat.label}
+ +
+ ); + })} +
-
-
+ - {/* Services Grid */} -
-
-
-

{t('services.completeTechSolutions')}

-

- {t('services.expertServices')} -

+ {/* Services Grid */} +
+
+
+

{t('services.completeTechSolutions')}

+

+ {t('services.expertServices')} +

+
+ +
+ {services.map((service, index) => { + const Icon = service.icon; + return ( + + +
+ +
+ + {service.title} + + + {service.description} + + + + {/* Technology Icons */} +
+ {service.techIcons.map((TechIcon, techIndex) => ( +
+ +
+ ))} +
+ +
+ {service.features.map((feature, featureIndex) => ( +
+
+ {feature} +
+ ))} +
+ + + + + + ); + })} +
- -
- {services.map((service, index) => { - const Icon = service.icon; - return ( - +
+ + {/* Complete Technology Stack with REAL Logos */} +
+
+
+

+

+ {t('services.comprehensiveExpertise')} +

+

+ +
+ {Object.entries(technologyStack).map(([category, technologies], categoryIndex) => ( + -
- -
- - {service.title} - - - {service.description} - + {category} - - {/* Technology Icons */} -
- {service.techIcons.map((TechIcon, techIndex) => ( + +
+ {technologies.map((tech, techIndex) => (
- -
- ))} -
- -
- {service.features.map((feature, featureIndex) => ( -
-
- {feature} + {/* Real Logo from techicons.dev with proper fallback */} +
+ +
+
+
+ {tech.name} +
+
+ {tech.category} +
+
))}
- - - - ); - })} -
-
-
- - {/* Complete Technology Stack with REAL Logos */} -
-
-
-

-

- {t('services.comprehensiveExpertise')} -

-

- -
- {Object.entries(technologyStack).map(([category, technologies], categoryIndex) => ( - - - {category} - - -
- {technologies.map((tech, techIndex) => ( -
- {/* Real Logo from techicons.dev with proper fallback */} -
- -
-
-
- {tech.name} -
-
- {tech.category} -
-
-
- ))} -
- - - ))} + ))} +
-
-
+ - {/* Why Choose Us Section */} -
-
-
-

{t('services.whyChoose')}

-
-
- - -

{t('common.expertTeam')}

-

{t('services.expertTeamDesc')}

- -
-
- - -

{t('common.provenResults')}

-

{t('services.provenResultsDesc')}

- -
-
- - -

{t('common.partnershipApproach')}

-

{t('services.partnershipDesc')}

- + {/* Why Choose Us Section */} +
+
+
+

{t('services.whyChoose')}

+
+
+ + +

{t('common.expertTeam')}

+

{t('services.expertTeamDesc')}

+ +
+
+ + +

{t('common.provenResults')}

+

{t('services.provenResultsDesc')}

+ +
+
+ + +

{t('common.partnershipApproach')}

+

{t('services.partnershipDesc')}

+ +
-
-
+ - {/* CTA Section */} -
-
-

{t('services.readyToStart')}

-

- {t('services.readyToStartDesc')} -

-
- - + {/* CTA Section */} +
+
+

{t('services.readyToStart')}

+

+ {t('services.readyToStartDesc')} +

+
+ + +
-
-
-
+ + + ); } \ No newline at end of file diff --git a/app/page.tsx b/app/page.tsx index d7d707e..fc4d5bc 100644 --- a/app/page.tsx +++ b/app/page.tsx @@ -1,13 +1,14 @@ import { Metadata } from 'next'; import { generatePageMetadata } from '@/lib/metadata'; import dynamic from 'next/dynamic'; -import ImmersiveCloudVisualization from '@/components/immersive-cloud-visualization'; +import { AuroraBackground } from '@/components/ui/aurora-background'; // Critical components - load immediately import EnhancedHeader from '@/components/enhanced-header-fixed'; import Hero from '@/components/hero'; import Footer from '@/components/footer'; import PolishLanguageWrapper from '@/components/PolishLanguageWrapper'; +import { GlowingEffect } from '@/components/ui/glowing-effect'; // Cloud visualization loaded lazily inside the component itself @@ -53,15 +54,24 @@ export default function Home() { return (
- + - + + + + + + + + + +
diff --git a/app/services/ai-ml/client.tsx b/app/services/ai-ml/client.tsx index c233dd1..636f107 100644 --- a/app/services/ai-ml/client.tsx +++ b/app/services/ai-ml/client.tsx @@ -5,6 +5,7 @@ import { Bot, Brain, Cpu, TrendingUp, Zap, Target } from 'lucide-react'; import { Button } from '@/components/ui/button'; import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card'; import { useLanguage } from '@/contexts/LanguageContext'; +import { AuroraBackground } from '@/components/ui/aurora-background'; export default function AIMachineLearningClient() { const { t } = useLanguage(); @@ -85,186 +86,188 @@ export default function AIMachineLearningClient() { ]; return ( -
- {/* Header */} -
-
-
- -
/
-
{t('services.aiMl.title')}
+ +
+ {/* Header */} +
+
+
+ +
/
+
{t('services.aiMl.title')}
+
-
-
+ - {/* Hero Section */} -
-
-
-
-
- -
-

-

- {t('services.aiMl.heroDescription')} -

-
- - + {/* Hero Section */} +
+ {/* Removed bg-gradient-to-br background */} +
+
+
+ +
+

+

+ {t('services.aiMl.heroDescription')} +

+
+ + +

-
-

+ - {/* Features Section */} -
-
-
-

{t('services.aiMl.featuresTitle')}

-

- {t('services.aiMl.featuresDescription')} -

+ {/* Features Section */} +
+
+
+

{t('services.aiMl.featuresTitle')}

+

+ {t('services.aiMl.featuresDescription')} +

+
+ +
+ {features.map((feature, index) => { + const Icon = feature.icon; + return ( + + +
+ +
+ {feature.title} + + + + {feature.description} + + + + ); + })} +
- -
- {features.map((feature, index) => { - const Icon = feature.icon; - return ( +
+ + {/* AI Services Grid */} +
+
+
+

{t('services.aiMl.aiServicesTitle')}

+

+ {t('services.aiMl.aiServicesDescription')} +

+
+ +
+ {aiServices.map((category, index) => ( -
- -
- {feature.title} + {category.category} - - {feature.description} - +
+ {category.services.map((service, serviceIndex) => ( +
+
+ {service} +
+ ))} +
- ); - })} + ))} +
-
-
+ - {/* AI Services Grid */} -
-
-
-

{t('services.aiMl.aiServicesTitle')}

-

- {t('services.aiMl.aiServicesDescription')} -

-
- -
- {aiServices.map((category, index) => ( - - - {category.category} - - -
- {category.services.map((service, serviceIndex) => ( -
-
- {service} -
- ))} -
- - - ))} + {/* Technologies Section */} +
+
+
+

{t('services.aiMl.technologiesTitle')}

+

+ {t('services.aiMl.technologiesDescription')} +

+
+ +
+ {technologies.map((tech, index) => ( +
+ {tech} +
+ ))} +
-
-
+ - {/* Technologies Section */} -
-
-
-

{t('services.aiMl.technologiesTitle')}

-

- {t('services.aiMl.technologiesDescription')} -

-
- -
- {technologies.map((tech, index) => ( -
- {tech} -
- ))} + {/* Use Cases Section */} +
+
+
+

{t('services.aiMl.useCasesTitle')}

+

+ {t('services.aiMl.useCasesDescription')} +

+
+ +
+ {useCases.map((useCase, index) => ( + + + {useCase.title} + + {useCase.description} + + + +
+ {useCase.metrics.map((metric, metricIndex) => ( +
+
+ {metric} +
+ ))} +
+ + + ))} +
-
-
+ - {/* Use Cases Section */} -
-
-
-

{t('services.aiMl.useCasesTitle')}

-

- {t('services.aiMl.useCasesDescription')} + {/* CTA Section */} +

+
+

{t('services.aiMl.readyTitle')}

+

+ {t('services.aiMl.readyDescription')}

+
+ + +
- -
- {useCases.map((useCase, index) => ( - - - {useCase.title} - - {useCase.description} - - - -
- {useCase.metrics.map((metric, metricIndex) => ( -
-
- {metric} -
- ))} -
- - - ))} -
-
-
- - {/* CTA Section */} -
-
-

{t('services.aiMl.readyTitle')}

-

- {t('services.aiMl.readyDescription')} -

-
- - -
-
-
-
+ + + ); } \ No newline at end of file diff --git a/app/services/ai-ml/page.tsx b/app/services/ai-ml/page.tsx index c5b8ab7..07e8348 100644 --- a/app/services/ai-ml/page.tsx +++ b/app/services/ai-ml/page.tsx @@ -1,6 +1,7 @@ import { Metadata } from 'next'; import { generatePageMetadata } from '@/lib/metadata'; import AIMachineLearningClient from './client'; +import { AuroraBackground } from '@/components/ui/aurora-background'; export const metadata: Metadata = generatePageMetadata( '/services/ai-ml', @@ -12,5 +13,9 @@ export const metadata: Metadata = generatePageMetadata( export default function AIMachineLearningPage() { - return ; + return ( + + + + ); } \ No newline at end of file diff --git a/app/services/app-development/page.tsx b/app/services/app-development/page.tsx index d3c0892..4de6092 100644 --- a/app/services/app-development/page.tsx +++ b/app/services/app-development/page.tsx @@ -3,6 +3,7 @@ import BackToHomeButton from '@/components/BackToHomeButton'; import { Code, Smartphone, Globe, Zap, Shield, Users } from 'lucide-react'; import { Button } from '@/components/ui/button'; import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card'; +import { AuroraBackground } from '@/components/ui/aurora-background'; export const metadata: Metadata = { title: 'Rozwój Aplikacji Web i Mobile - React, Next.js | CloudFloo', @@ -109,213 +110,215 @@ export default function AppDevelopmentPage() { ]; return ( -
- {/* Header */} -
-
-
- -
/
-
Application Development
+ +
+ {/* Header */} +
+
+
+ +
/
+
Application Development
+
-
-
+ - {/* Hero Section */} -
-
-
-
-
- -
-

- Application Development -

-

- Build powerful, scalable applications that drive business growth. From web platforms to mobile apps, - we create custom solutions using modern technologies and best practices. -

-
- - + {/* Hero Section */} +
+ {/* Removed bg-gradient-to-br background */} +
+
+
+ +
+

+ Application Development +

+

+ Build powerful, scalable applications that drive business growth. From web platforms to mobile apps, + we create custom solutions using modern technologies and best practices. +

+
+ + +
-
-
+ - {/* Features Section */} -
-
-
-

Development Expertise

-

- Comprehensive application development services for web, mobile, and enterprise solutions. -

+ {/* Features Section */} +
+
+
+

Development Expertise

+

+ Comprehensive application development services for web, mobile, and enterprise solutions. +

+
+ +
+ {features.map((feature, index) => { + const Icon = feature.icon; + return ( + + +
+ +
+ {feature.title} + + + + {feature.description} + + + + ); + })} +
- -
- {features.map((feature, index) => { - const Icon = feature.icon; - return ( - +
+ + {/* Development Process */} +
+
+
+

Our Development Process

+

+ A proven methodology that ensures successful project delivery from concept to launch. +

+
+ +
+ {developmentProcess.map((process, index) => ( + -
- -
- {feature.title} +
{process.step}
+ {process.title} - {feature.description} + {process.description} - ); - })} + ))} +
-
-
+ - {/* Development Process */} -
-
-
-

Our Development Process

-

- A proven methodology that ensures successful project delivery from concept to launch. -

-
- -
- {developmentProcess.map((process, index) => ( - - -
{process.step}
- {process.title} - - - - {process.description} - - - - ))} + {/* Services Grid */} +
+
+
+

Development Services

+

+ Full-spectrum development services for all your application needs. +

+
+ +
+ {services.map((service, index) => ( + + + {service.category} + + +
+ {service.items.map((item, itemIndex) => ( +
+
+ {item} +
+ ))} +
+ + + ))} +
-
-
+ - {/* Services Grid */} -
-
-
-

Development Services

-

- Full-spectrum development services for all your application needs. -

-
- -
- {services.map((service, index) => ( - - - {service.category} - - -
- {service.items.map((item, itemIndex) => ( -
-
- {item} -
- ))} -
- - - ))} + {/* Technologies Section */} +
+
+
+

Technologies We Use

+

+ Modern frameworks and tools for building high-performance applications. +

+
+ +
+ {technologies.map((tech, index) => ( +
+ {tech} +
+ ))} +
-
-
+ - {/* Technologies Section */} -
-
-
-

Technologies We Use

-

- Modern frameworks and tools for building high-performance applications. -

-
- -
- {technologies.map((tech, index) => ( -
- {tech} -
- ))} + {/* Projects Section */} +
+
+
+

Featured Projects

+

+ Successful applications we've built for clients across various industries. +

+
+ +
+ {projects.map((project, index) => ( + + + {project.title} + + {project.description} + + + +
+ {project.metrics.map((metric, metricIndex) => ( +
+
+ {metric} +
+ ))} +
+ + + ))} +
-
-
+ - {/* Projects Section */} -
-
-
-

Featured Projects

-

- Successful applications we've built for clients across various industries. + {/* CTA Section */} +

+
+

Ready to Build Your Application?

+

+ Let's turn your ideas into powerful applications that drive business success.

+
+ + +
- -
- {projects.map((project, index) => ( - - - {project.title} - - {project.description} - - - -
- {project.metrics.map((metric, metricIndex) => ( -
-
- {metric} -
- ))} -
- - - ))} -
-
-
- - {/* CTA Section */} -
-
-

Ready to Build Your Application?

-

- Let's turn your ideas into powerful applications that drive business success. -

-
- - -
-
-
-
+ + + ); } \ No newline at end of file diff --git a/app/services/client.tsx b/app/services/client.tsx index 9d06628..f1c3eb2 100644 --- a/app/services/client.tsx +++ b/app/services/client.tsx @@ -8,6 +8,7 @@ import { ArrowLeft, Cloud, Bot, Settings, Database, Code, Zap, Server, Monitor, import { Button } from '@/components/ui/button'; import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card'; import { useLanguage } from '@/contexts/LanguageContext'; +import { AuroraBackground } from '@/components/ui/aurora-background'; interface TechIconProps { name: string; @@ -68,15 +69,6 @@ export default function ServicesClient() { color: 'from-orange-500 to-red-500', techIcons: [GitBranch, Package, Workflow, CheckCircle] }, - { - icon: Database, - title: t('services.dataEngineering.title'), - description: t('services.dataEngineering.description'), - href: '/services/data-engineering', - features: ['Data Pipeline Design', 'Real-time Processing', 'Analytics Platforms', 'Data Governance'], - color: 'from-indigo-500 to-blue-500', - techIcons: [HardDrive, BarChart3, Activity, Search] - }, { icon: Code, title: t('services.appDevelopment.title'), @@ -85,15 +77,6 @@ export default function ServicesClient() { features: ['Full-Stack Development', 'Mobile Applications', 'Web Applications', 'Performance Optimization'], color: 'from-green-500 to-emerald-500', techIcons: [Monitor, Smartphone, Code2, Globe] - }, - { - icon: Zap, - title: t('services.edgeComputing.title'), - description: t('services.edgeComputing.description'), - href: '/services/edge-computing', - features: ['Ultra-Low Latency', 'Global Distribution', 'Serverless Functions', 'Real-time Processing'], - color: 'from-teal-500 to-green-500', - techIcons: [Globe, Network, Zap, Activity] } ]; @@ -173,223 +156,225 @@ export default function ServicesClient() { ]; return ( -
- {/* Header */} -
-
-
- - - {t('common.backToHome')} - -
/
-
{t('common.services')}
+ +
+ {/* Header */} +
+
+
+ + + {t('common.backToHome')} + +
/
+
{t('common.services')}
+
-
-
+ - {/* Hero Section */} -
-
-
-
-

-

- {t('services.subtitle')} -

+ {/* Hero Section */} +
+ {/* Removed bg-gradient-to-br background */} +
+
+

+

+ {t('services.subtitle')} +

+

-

-
+ - {/* Stats Section with Icons */} -
-
-
- {stats.map((stat, index) => { - const Icon = stat.icon; - return ( -
- - -
{stat.number}
-
{stat.label}
- -
- ); - })} + {/* Stats Section with Icons */} +
+
+
+ {stats.map((stat, index) => { + const Icon = stat.icon; + return ( +
+ + +
{stat.number}
+
{stat.label}
+ +
+ ); + })} +
-
-
+ - {/* Services Grid */} -
-
-
-

{t('services.completeTechSolutions')}

-

- {t('services.expertServices')} -

+ {/* Services Grid */} +
+
+
+

{t('services.completeTechSolutions')}

+

+ {t('services.expertServices')} +

+
+ +
+ {services.map((service, index) => { + const Icon = service.icon; + return ( + + +
+ +
+ + {service.title} + + + {service.description} + + + + {/* Technology Icons */} +
+ {service.techIcons.map((TechIcon, techIndex) => ( +
+ +
+ ))} +
+ +
+ {service.features.map((feature, featureIndex) => ( +
+
+ {feature} +
+ ))} +
+ + + + + + ); + })} +
- -
- {services.map((service, index) => { - const Icon = service.icon; - return ( - +
+ + {/* Complete Technology Stack with REAL Logos */} +
+
+
+

+

+ {t('services.comprehensiveExpertise')} +

+

+ +
+ {Object.entries(technologyStack).map(([category, technologies], categoryIndex) => ( + -
- -
- - {service.title} - - - {service.description} - + {category} - - {/* Technology Icons */} -
- {service.techIcons.map((TechIcon, techIndex) => ( + +
+ {technologies.map((tech, techIndex) => (
- -
- ))} -
- -
- {service.features.map((feature, featureIndex) => ( -
-
- {feature} + {/* Real Logo from techicons.dev with proper fallback */} +
+ +
+
+
+ {tech.name} +
+
+ {tech.category} +
+
))}
- - - - ); - })} -
-
-
- - {/* Complete Technology Stack with REAL Logos */} -
-
-
-

-

- {t('services.comprehensiveExpertise')} -

-

- -
- {Object.entries(technologyStack).map(([category, technologies], categoryIndex) => ( - - - {category} - - -
- {technologies.map((tech, techIndex) => ( -
- {/* Real Logo from techicons.dev with proper fallback */} -
- -
-
-
- {tech.name} -
-
- {tech.category} -
-
-
- ))} -
- - - ))} + ))} +
-
-
+ - {/* Why Choose Us Section */} -
-
-
-

{t('services.whyChoose')}

-
-
- - -

{t('common.expertTeam')}

-

{t('services.expertTeamDesc')}

- -
-
- - -

{t('common.provenResults')}

-

{t('services.provenResultsDesc')}

- -
-
- - -

{t('common.partnershipApproach')}

-

{t('services.partnershipDesc')}

- + {/* Why Choose Us Section */} +
+
+
+

{t('services.whyChoose')}

+
+
+ + +

{t('common.expertTeam')}

+

{t('services.expertTeamDesc')}

+ +
+
+ + +

{t('common.provenResults')}

+

{t('services.provenResultsDesc')}

+ +
+
+ + +

{t('common.partnershipApproach')}

+

{t('services.partnershipDesc')}

+ +
-
-
+ - {/* CTA Section */} -
-
-

{t('services.readyToStart')}

-

- {t('services.readyToStartDesc')} -

-
- - + {/* CTA Section */} +
+
+

{t('services.readyToStart')}

+

+ {t('services.readyToStartDesc')} +

+
+ + +
-
-
-
+ + + ); } \ No newline at end of file diff --git a/app/services/cloud-solutions/page.tsx b/app/services/cloud-solutions/page.tsx index 390b2aa..100d021 100644 --- a/app/services/cloud-solutions/page.tsx +++ b/app/services/cloud-solutions/page.tsx @@ -1,6 +1,7 @@ import { Metadata } from 'next'; import { generatePageMetadata } from '@/lib/metadata'; import CloudSolutionsClient from './client'; +import { AuroraBackground } from '@/components/ui/aurora-background'; export const metadata: Metadata = generatePageMetadata( '/services/cloud-solutions', @@ -10,5 +11,9 @@ export const metadata: Metadata = generatePageMetadata( ); export default function CloudSolutionsPage() { - return ; + return ( + + + + ); } \ No newline at end of file diff --git a/app/services/devops/page.tsx b/app/services/devops/page.tsx index 594d4cf..e871c2c 100644 --- a/app/services/devops/page.tsx +++ b/app/services/devops/page.tsx @@ -3,6 +3,7 @@ import BackToHomeButton from '@/components/BackToHomeButton'; import { Settings, GitBranch, Zap, Shield, Monitor, Rocket } from 'lucide-react'; import { Button } from '@/components/ui/button'; import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card'; +import { AuroraBackground } from '@/components/ui/aurora-background'; export const metadata: Metadata = { title: 'DevOps i Automatyzacja - CI/CD, Kubernetes | CloudFloo', @@ -91,178 +92,180 @@ export default function DevOpsPage() { ]; return ( -
- {/* Header */} -
-
-
- -
/
-
DevOps & Automation
+ +
+ {/* Header */} +
+
+
+ +
/
+
DevOps & Automation
+
-
-
+ - {/* Hero Section */} -
-
-
-
-
- -
-

- DevOps & Automation -

-

- Accelerate your development lifecycle with modern DevOps practices. We implement automated pipelines, - infrastructure as code, and comprehensive monitoring to ensure fast, reliable, and secure deployments. -

-
- - + {/* Hero Section */} +
+ {/* Removed bg-gradient-to-br background */} +
+
+
+ +
+

+ DevOps & Automation +

+

+ Accelerate your development lifecycle with modern DevOps practices. We implement automated pipelines, + infrastructure as code, and comprehensive monitoring to ensure fast, reliable, and secure deployments. +

+
+ + +
-
-
+ - {/* Features Section */} -
-
-
-

Complete DevOps Solutions

-

- From code commit to production deployment, we automate every step of your development pipeline. -

+ {/* Features Section */} +
+
+
+

Complete DevOps Solutions

+

+ From code commit to production deployment, we automate every step of your development pipeline. +

+
+ +
+ {features.map((feature, index) => { + const Icon = feature.icon; + return ( + + +
+ +
+ {feature.title} + + + + {feature.description} + + + + ); + })} +
- -
- {features.map((feature, index) => { - const Icon = feature.icon; - return ( +
+ + {/* Services Grid */} +
+
+
+

DevOps Service Areas

+

+ Comprehensive DevOps capabilities covering all aspects of modern software delivery. +

+
+ +
+ {services.map((service, index) => ( -
- + {service.category} + + +
+ {service.items.map((item, itemIndex) => ( +
+
+ {item} +
+ ))}
- {feature.title} + + + ))} +
+
+
+ + {/* Benefits Section */} +
+
+
+

DevOps Benefits

+

+ Measurable improvements in speed, reliability, and cost efficiency. +

+
+ +
+ {benefits.map((benefit, index) => ( + + + {benefit.title} +
{benefit.metric}
 - {feature.description} + {benefit.description} - ); - })} -
-
-
- - {/* Services Grid */} -
-
-
-

DevOps Service Areas

-

- Comprehensive DevOps capabilities covering all aspects of modern software delivery. -

-
- -
- {services.map((service, index) => ( - - - {service.category} - - -
- {service.items.map((item, itemIndex) => ( -
-
- {item} -
- ))} -
- - - ))} + ))} +
-
-
+ - {/* Benefits Section */} -
-
-
-

DevOps Benefits

-

- Measurable improvements in speed, reliability, and cost efficiency. -

-
- -
- {benefits.map((benefit, index) => ( - - - {benefit.title} -
{benefit.metric}
- - - - {benefit.description} - - - - ))} + {/* Technologies Section */} +
+
+
+

DevOps Technologies

+

+ Industry-leading tools and platforms for modern DevOps practices. +

+
+ +
+ {technologies.map((tech, index) => ( +
+ {tech} +
+ ))} +
-
-
+ - {/* Technologies Section */} -
-
-
-

DevOps Technologies

-

- Industry-leading tools and platforms for modern DevOps practices. + {/* CTA Section */} +

+
+

Ready to Accelerate Your Development?

+

+ Transform your development process with modern DevOps practices and automation.

+
+ + +
- -
- {technologies.map((tech, index) => ( -
- {tech} -
- ))} -
-
-
- - {/* CTA Section */} -
-
-

Ready to Accelerate Your Development?

-

- Transform your development process with modern DevOps practices and automation. -

-
- - -
-
-
-
+ + + ); } \ No newline at end of file diff --git a/components/TeamCard.tsx b/components/TeamCard.tsx index 73c9a7e..e3a0ef2 100644 --- a/components/TeamCard.tsx +++ b/components/TeamCard.tsx @@ -9,6 +9,7 @@ import { motion } from 'framer-motion'; import { ExternalLink, Github, Linkedin } from 'lucide-react'; import { TeamMember } from '@/data/team'; import { useLanguage } from '@/contexts/LanguageContext'; +import { GlowingEffect } from '@/components/ui/glowing-effect'; interface TeamCardProps { person: TeamMember; @@ -24,6 +25,7 @@ export default function TeamCard({ person }: TeamCardProps) { className="h-full" > +
diff --git a/components/contact.tsx b/components/contact.tsx index 041fbcc..2237201 100644 --- a/components/contact.tsx +++ b/components/contact.tsx @@ -6,6 +6,7 @@ import { Button } from '@/components/ui/button'; import { Input } from '@/components/ui/input'; import { Textarea } from '@/components/ui/textarea'; import { toast } from '@/hooks/use-toast'; +import { GlowingEffect } from '@/components/ui/glowing-effect'; export default function Contact() { const [formData, setFormData] = useState({ @@ -93,6 +94,7 @@ export default function Contact() {
{/* Contact Form */}
+

Send us a message

@@ -173,6 +175,7 @@ export default function Contact() { {/* Contact Info */}
+

Contact Information

{contactInfo.map((info, index) => { @@ -198,6 +201,7 @@ export default function Contact() { {/* Map Placeholder */}
+

Interactive map coming soon

diff --git a/components/enhanced-contact.tsx b/components/enhanced-contact.tsx index fc10b92..af74ca0 100644 --- a/components/enhanced-contact.tsx +++ b/components/enhanced-contact.tsx @@ -10,6 +10,7 @@ import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'; import { useScrollAnimation } from '@/hooks/use-scroll-animation'; import { useLanguage } from '@/contexts/LanguageContext'; import { toast } from '@/hooks/use-toast'; +import { GlowingEffect } from '@/components/ui/glowing-effect'; export default function EnhancedContact() { const { t, isLoaded } = useLanguage(); @@ -177,6 +178,7 @@ export default function EnhancedContact() { animate={formVisible ? "visible" : "hidden"} > + {t('contact.form.title')} @@ -283,52 +285,40 @@ export default function EnhancedContact() { initial="hidden" animate={infoVisible ? "visible" : "hidden"} > - - - - - {t('contact.info.title')} - - - - {contactInfo.map((info, index) => { - const Icon = info.icon; - return ( - { + const Icon = info.icon; + return ( + + + + + - - - -
-
{info.title}
-
- {info.value} -
+ + +
+
{info.title}
+
+ {info.value}
- - ); - })} - - - +
+ + + + ); + })} {/* Map Placeholder */} + (null); @@ -161,6 +162,8 @@ export default function EnhancedProjects() { className="glass border-gray-700 hover:border-neon/50 transition-all duration-500 group cursor-pointer overflow-hidden" onClick={handleProjectClick} > + +
+ ); })} @@ -221,6 +223,7 @@ export default function EnhancedServices() { ))}
+ ))}
diff --git a/components/faq-section.tsx b/components/faq-section.tsx index 2c940bc..080aa77 100644 --- a/components/faq-section.tsx +++ b/components/faq-section.tsx @@ -9,6 +9,7 @@ import { } from '@/components/ui/accordion'; import { useScrollAnimation } from '@/hooks/use-scroll-animation'; import { useLanguage } from '@/contexts/LanguageContext'; +import { GlowingEffect } from '@/components/ui/glowing-effect'; export default function FAQSection() { const { ref, isVisible } = useScrollAnimation(); @@ -69,6 +70,7 @@ export default function FAQSection() { }`} > + {t('faq.tableOfContents')} diff --git a/components/hero.tsx b/components/hero.tsx index 453a5b3..c60fc76 100644 --- a/components/hero.tsx +++ b/components/hero.tsx @@ -37,13 +37,6 @@ export default function Hero() { {/* Optimized static gradient background for fast LCP */}
diff --git a/components/projects.tsx b/components/projects.tsx index af951c3..e20a07d 100644 --- a/components/projects.tsx +++ b/components/projects.tsx @@ -4,6 +4,7 @@ import { ExternalLink, Github, ArrowRight } from 'lucide-react'; import { Button } from '@/components/ui/button'; import Image from 'next/image'; import { placeholders, DEFAULT_BLUR } from "@/data/placeholders"; +import { GlowingEffect } from '@/components/ui/glowing-effect'; export default function Projects() { const projects = [ @@ -72,6 +73,7 @@ export default function Projects() { animationDelay: `${index * 0.1}s` }} > +
+
diff --git a/components/ui/aurora-background-demo.tsx b/components/ui/aurora-background-demo.tsx new file mode 100644 index 0000000..568b63d --- /dev/null +++ b/components/ui/aurora-background-demo.tsx @@ -0,0 +1,32 @@ +"use client"; + +import { motion } from "framer-motion"; +import React from "react"; +import { AuroraBackground } from "@/components/ui/aurora-background"; + +export function AuroraBackgroundDemo() { + return ( + + +
+ Background lights are cool you know. +
+
+ And this, is chemical burn. +
+ + + + ); +} \ No newline at end of file diff --git a/components/ui/aurora-background.tsx b/components/ui/aurora-background.tsx new file mode 100644 index 0000000..bb8fc71 --- /dev/null +++ b/components/ui/aurora-background.tsx @@ -0,0 +1,54 @@ +// AuroraBackground supports custom accent color classes via the className prop. +// Example: ... +import { cn } from "@/lib/utils"; +import React, { ReactNode } from "react"; + +interface AuroraBackgroundProps extends React.HTMLProps { + children: ReactNode; + showRadialGradient?: boolean; +} + +export const AuroraBackground = ({ + className, + children, + showRadialGradient = true, + ...props +}: AuroraBackgroundProps) => { + return ( +
+
+
+
+
+ {children} +
+
+ ); +} \ No newline at end of file diff --git a/components/ui/glowing-effect-demo.tsx b/components/ui/glowing-effect-demo.tsx new file mode 100644 index 0000000..cd359cd --- /dev/null +++ b/components/ui/glowing-effect-demo.tsx @@ -0,0 +1,81 @@ +"use client"; + +import { Box, Lock, Search, Settings, Sparkles } from "lucide-react"; +import { GlowingEffect } from "@/components/ui/glowing-effect"; +import { cn } from "@/lib/utils"; + +export function GlowingEffectDemo() { + return ( +
    + } + title="Do things the right way" + description="Running out of copy so I'll write anything." + /> + } + title="The best AI code editor ever." + description="Yes, it's true. I'm not even kidding. Ask my mom if you don't believe me." + /> + } + title="You should buy Aceternity UI Pro" + description="It's the best money you'll ever spend" + /> + } + title="This card is also built by Cursor" + description="I'm not even kidding. Ask my mom if you don't believe me." + /> + } + title="Coming soon on Aceternity UI" + description="I'm writing the code as I record this, no shit." + /> +
+ ); +} + +interface GridItemProps { + area: string; + icon: React.ReactNode; + title: string; + description: React.ReactNode; +} + +const GridItem = ({ area, icon, title, description }: GridItemProps) => { + return ( +
  • +
    + +
    +
    +
    + {icon} +
    +
    +

    + {title} +

    +

    + {description} +

    +
    +
    +
    +
    +
    • + ); +}; \ No newline at end of file diff --git a/components/ui/glowing-effect.tsx b/components/ui/glowing-effect.tsx new file mode 100644 index 0000000..3b0289c --- /dev/null +++ b/components/ui/glowing-effect.tsx @@ -0,0 +1,190 @@ +"use client"; + +import { memo, useCallback, useEffect, useRef } from "react"; +import { cn } from "@/lib/utils"; +import { animate } from "motion/react"; + +interface GlowingEffectProps { + blur?: number; + inactiveZone?: number; + proximity?: number; + spread?: number; + variant?: "default" | "white"; + glow?: boolean; + className?: string; + disabled?: boolean; + movementDuration?: number; + borderWidth?: number; +} +const GlowingEffect = memo( + ({ + blur = 0, + inactiveZone = 0.7, + proximity = 0, + spread = 20, + variant = "default", + glow = false, + className, + movementDuration = 2, + borderWidth = 1, + disabled = true, + }: GlowingEffectProps) => { + const containerRef = useRef(null); + const lastPosition = useRef({ x: 0, y: 0 }); + const animationFrameRef = useRef(0); + + const handleMove = useCallback( + (e?: MouseEvent | { x: number; y: number }) => { + if (!containerRef.current) return; + + if (animationFrameRef.current) { + cancelAnimationFrame(animationFrameRef.current); + } + + animationFrameRef.current = requestAnimationFrame(() => { + const element = containerRef.current; + if (!element) return; + + const { left, top, width, height } = element.getBoundingClientRect(); + const mouseX = e?.x ?? lastPosition.current.x; + const mouseY = e?.y ?? lastPosition.current.y; + + if (e) { + lastPosition.current = { x: mouseX, y: mouseY }; + } + + const center = [left + width * 0.5, top + height * 0.5]; + const distanceFromCenter = Math.hypot( + mouseX - center[0], + mouseY - center[1] + ); + const inactiveRadius = 0.5 * Math.min(width, height) * inactiveZone; + + if (distanceFromCenter < inactiveRadius) { + element.style.setProperty("--active", "0"); + return; + } + + const isActive = + mouseX > left - proximity && + mouseX < left + width + proximity && + mouseY > top - proximity && + mouseY < top + height + proximity; + + element.style.setProperty("--active", isActive ? "1" : "0"); + + if (!isActive) return; + + const currentAngle = + parseFloat(element.style.getPropertyValue("--start")) || 0; + let targetAngle = + (180 * Math.atan2(mouseY - center[1], mouseX - center[0])) / + Math.PI + + 90; + + const angleDiff = ((targetAngle - currentAngle + 180) % 360) - 180; + const newAngle = currentAngle + angleDiff; + + animate(currentAngle, newAngle, { + duration: movementDuration, + ease: [0.16, 1, 0.3, 1], + onUpdate: (value) => { + element.style.setProperty("--start", String(value)); + }, + }); + }); + }, + [inactiveZone, proximity, movementDuration] + ); + + useEffect(() => { + if (disabled) return; + + const handleScroll = () => handleMove(); + const handlePointerMove = (e: PointerEvent) => handleMove(e); + + window.addEventListener("scroll", handleScroll, { passive: true }); + document.body.addEventListener("pointermove", handlePointerMove, { + passive: true, + }); + + return () => { + if (animationFrameRef.current) { + cancelAnimationFrame(animationFrameRef.current); + } + window.removeEventListener("scroll", handleScroll); + document.body.removeEventListener("pointermove", handlePointerMove); + }; + }, [handleMove, disabled]); + + return ( + <> +