almost all linking done exept underdevelopment pages or not developed
This commit is contained in:
priyanshuvish
@@ -8,7 +8,8 @@ import {
|
||||
CheckCircle,
|
||||
Cloud,
|
||||
CloudCog,
|
||||
Code, Database,
|
||||
Code,
|
||||
Database,
|
||||
DollarSign,
|
||||
Eye,
|
||||
Gauge,
|
||||
@@ -26,16 +27,22 @@ import {
|
||||
Target,
|
||||
TrendingUp,
|
||||
Users,
|
||||
X
|
||||
X,
|
||||
} from "lucide-react";
|
||||
import { ImageWithFallback } from "../components/figma/ImageWithFallback";
|
||||
import { Footer } from "../components/Footer";
|
||||
import { Navigation } from "../components/Navigation";
|
||||
import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from "../components/ui/accordion";
|
||||
import {
|
||||
Accordion,
|
||||
AccordionContent,
|
||||
AccordionItem,
|
||||
AccordionTrigger,
|
||||
} from "../components/ui/accordion";
|
||||
import { Badge } from "../components/ui/badge";
|
||||
import { Button } from "../components/ui/button";
|
||||
import { Card, CardContent } from "../components/ui/card";
|
||||
import { ShimmerButton } from "../components/ui/shimmer-button";
|
||||
import { navigateTo } from "@/App";
|
||||
|
||||
// Legacy System Rebuilds Hero Section
|
||||
const LegacySystemRebuildsHero = () => {
|
||||
@@ -55,7 +62,9 @@ const LegacySystemRebuildsHero = () => {
|
||||
animate={{ opacity: 1, y: 0 }}
|
||||
transition={{ duration: 0.6 }}
|
||||
>
|
||||
<span className="text-white/70 text-sm font-medium">Solutions</span>
|
||||
<span className="text-white/70 text-sm font-medium">
|
||||
Solutions
|
||||
</span>
|
||||
</motion.div>
|
||||
|
||||
{/* Main Heading */}
|
||||
@@ -63,12 +72,14 @@ const LegacySystemRebuildsHero = () => {
|
||||
<h1 className="text-4xl md:text-5xl lg:text-6xl font-semibold text-white leading-tight">
|
||||
Legacy System Rebuilds
|
||||
</h1>
|
||||
|
||||
|
||||
<p className="text-lg text-gray-300 leading-relaxed max-w-lg">
|
||||
Modernize your core business operations by transforming outdated, inefficient systems into powerful, scalable, and future-ready solutions.
|
||||
Modernize your core business operations by transforming
|
||||
outdated, inefficient systems into powerful, scalable, and
|
||||
future-ready solutions.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
|
||||
{/* CTAs */}
|
||||
<motion.div
|
||||
initial={{ opacity: 0, y: 20 }}
|
||||
@@ -76,7 +87,10 @@ const LegacySystemRebuildsHero = () => {
|
||||
transition={{ duration: 0.8, delay: 0.3 }}
|
||||
className="flex flex-col sm:flex-row gap-4"
|
||||
>
|
||||
<ShimmerButton className="text-lg px-8 py-4">
|
||||
<ShimmerButton
|
||||
className="text-lg px-8 py-4"
|
||||
onClick={() => navigateTo("/start-a-project")}
|
||||
>
|
||||
<div className="inline-flex items-center gap-2">
|
||||
<MessageSquare className="w-5 h-5 flex-shrink-0" />
|
||||
<span>Get a Free Consultation</span>
|
||||
@@ -89,12 +103,12 @@ const LegacySystemRebuildsHero = () => {
|
||||
>
|
||||
<div className="inline-flex items-center gap-2">
|
||||
<Eye className="w-5 h-5 flex-shrink-0" />
|
||||
<span>Explore Our Modernization Projects</span>
|
||||
<span>Explore Modernization Projects</span>
|
||||
</div>
|
||||
</Button>
|
||||
</motion.div>
|
||||
</motion.div>
|
||||
|
||||
|
||||
{/* Right side with Before/After System Visualization */}
|
||||
<motion.div
|
||||
initial={{ opacity: 0, x: 50 }}
|
||||
@@ -126,18 +140,26 @@ const LegacySystemRebuildsHero = () => {
|
||||
transition={{ duration: 0.8, delay: 1.0 }}
|
||||
className="text-center mb-6"
|
||||
>
|
||||
<h3 className="text-xl font-semibold text-white mb-2">System Transformation</h3>
|
||||
<h3 className="text-xl font-semibold text-white mb-2">
|
||||
System Transformation
|
||||
</h3>
|
||||
<div className="flex items-center justify-center gap-4">
|
||||
<Badge variant="secondary" className="bg-red-500/20 text-red-300 border-red-500/30 text-xs">
|
||||
<Badge
|
||||
variant="secondary"
|
||||
className="bg-red-500/20 text-red-300 border-red-500/30 text-xs"
|
||||
>
|
||||
Legacy
|
||||
</Badge>
|
||||
<ArrowRight className="w-4 h-4 text-accent" />
|
||||
<Badge variant="secondary" className="bg-green-500/20 text-green-300 border-green-500/30 text-xs">
|
||||
<Badge
|
||||
variant="secondary"
|
||||
className="bg-green-500/20 text-green-300 border-green-500/30 text-xs"
|
||||
>
|
||||
Modern
|
||||
</Badge>
|
||||
</div>
|
||||
</motion.div>
|
||||
|
||||
|
||||
{/* Before/After Systems */}
|
||||
<motion.div
|
||||
initial={{ opacity: 0, y: 20 }}
|
||||
@@ -155,7 +177,9 @@ const LegacySystemRebuildsHero = () => {
|
||||
>
|
||||
<Laptop className="w-8 h-8 text-red-400" />
|
||||
</motion.div>
|
||||
<div className="text-red-300 text-xs font-medium">Legacy System</div>
|
||||
<div className="text-red-300 text-xs font-medium">
|
||||
Legacy System
|
||||
</div>
|
||||
<div className="space-y-1">
|
||||
<div className="flex items-center gap-1">
|
||||
<div className="w-1 h-1 bg-red-400 rounded-full"></div>
|
||||
@@ -163,16 +187,20 @@ const LegacySystemRebuildsHero = () => {
|
||||
</div>
|
||||
<div className="flex items-center gap-1">
|
||||
<div className="w-1 h-1 bg-red-400 rounded-full"></div>
|
||||
<span className="text-red-300 text-xs">Insecure</span>
|
||||
<span className="text-red-300 text-xs">
|
||||
Insecure
|
||||
</span>
|
||||
</div>
|
||||
<div className="flex items-center gap-1">
|
||||
<div className="w-1 h-1 bg-red-400 rounded-full"></div>
|
||||
<span className="text-red-300 text-xs">Costly</span>
|
||||
<span className="text-red-300 text-xs">
|
||||
Costly
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
{/* Modern System */}
|
||||
<div className="bg-green-500/10 rounded-lg p-4 border border-green-500/30">
|
||||
<div className="flex flex-col items-center text-center space-y-2">
|
||||
@@ -183,26 +211,34 @@ const LegacySystemRebuildsHero = () => {
|
||||
>
|
||||
<Cloud className="w-8 h-8 text-green-400" />
|
||||
</motion.div>
|
||||
<div className="text-green-300 text-xs font-medium">Modern Platform</div>
|
||||
<div className="text-green-300 text-xs font-medium">
|
||||
Modern Platform
|
||||
</div>
|
||||
<div className="space-y-1">
|
||||
<div className="flex items-center gap-1">
|
||||
<div className="w-1 h-1 bg-green-400 rounded-full"></div>
|
||||
<span className="text-green-300 text-xs">Fast</span>
|
||||
<span className="text-green-300 text-xs">
|
||||
Fast
|
||||
</span>
|
||||
</div>
|
||||
<div className="flex items-center gap-1">
|
||||
<div className="w-1 h-1 bg-green-400 rounded-full"></div>
|
||||
<span className="text-green-300 text-xs">Secure</span>
|
||||
<span className="text-green-300 text-xs">
|
||||
Secure
|
||||
</span>
|
||||
</div>
|
||||
<div className="flex items-center gap-1">
|
||||
<div className="w-1 h-1 bg-green-400 rounded-full"></div>
|
||||
<span className="text-green-300 text-xs">Scalable</span>
|
||||
<span className="text-green-300 text-xs">
|
||||
Scalable
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</motion.div>
|
||||
</div>
|
||||
|
||||
|
||||
{/* Modernization Progress */}
|
||||
<motion.div
|
||||
initial={{ opacity: 0, y: 20 }}
|
||||
@@ -213,56 +249,73 @@ const LegacySystemRebuildsHero = () => {
|
||||
<div className="flex items-center justify-between mb-3">
|
||||
<div className="flex items-center gap-2">
|
||||
<RefreshCw className="w-4 h-4 text-blue-400" />
|
||||
<span className="text-blue-400 text-xs font-mono">Modernization Progress</span>
|
||||
<span className="text-blue-400 text-xs font-mono">
|
||||
Modernization Progress
|
||||
</span>
|
||||
</div>
|
||||
<Badge variant="secondary" className="bg-blue-500/20 text-blue-300 border-blue-500/30 text-xs">
|
||||
<Badge
|
||||
variant="secondary"
|
||||
className="bg-blue-500/20 text-blue-300 border-blue-500/30 text-xs"
|
||||
>
|
||||
In Progress
|
||||
</Badge>
|
||||
</div>
|
||||
|
||||
|
||||
{/* Modernization Phases */}
|
||||
<div className="space-y-2">
|
||||
<motion.div
|
||||
initial={{ opacity: 0, width: 0 }}
|
||||
animate={{ opacity: 1, width: '100%' }}
|
||||
animate={{ opacity: 1, width: "100%" }}
|
||||
transition={{ duration: 1, delay: 2.0 }}
|
||||
className="flex items-center justify-between"
|
||||
>
|
||||
<div className="flex items-center gap-2">
|
||||
<div className="w-2 h-2 bg-green-400 rounded-full"></div>
|
||||
<span className="text-green-300 text-xs">System Audit</span>
|
||||
<span className="text-green-300 text-xs">
|
||||
System Audit
|
||||
</span>
|
||||
</div>
|
||||
<span className="text-green-300 text-xs font-mono">Complete</span>
|
||||
<span className="text-green-300 text-xs font-mono">
|
||||
Complete
|
||||
</span>
|
||||
</motion.div>
|
||||
|
||||
|
||||
<motion.div
|
||||
initial={{ opacity: 0, width: 0 }}
|
||||
animate={{ opacity: 1, width: '75%' }}
|
||||
animate={{ opacity: 1, width: "75%" }}
|
||||
transition={{ duration: 1, delay: 2.2 }}
|
||||
className="flex items-center justify-between"
|
||||
>
|
||||
<div className="flex items-center gap-2">
|
||||
<div className="w-2 h-2 bg-blue-400 rounded-full"></div>
|
||||
<span className="text-blue-300 text-xs">Re-architecture</span>
|
||||
<span className="text-blue-300 text-xs">
|
||||
Re-architecture
|
||||
</span>
|
||||
</div>
|
||||
<span className="text-blue-300 text-xs font-mono">75%</span>
|
||||
<span className="text-blue-300 text-xs font-mono">
|
||||
75%
|
||||
</span>
|
||||
</motion.div>
|
||||
|
||||
|
||||
<motion.div
|
||||
initial={{ opacity: 0, width: 0 }}
|
||||
animate={{ opacity: 1, width: '40%' }}
|
||||
animate={{ opacity: 1, width: "40%" }}
|
||||
transition={{ duration: 1, delay: 2.4 }}
|
||||
className="flex items-center justify-between"
|
||||
>
|
||||
<div className="flex items-center gap-2">
|
||||
<div className="w-2 h-2 bg-orange-400 rounded-full"></div>
|
||||
<span className="text-orange-300 text-xs">Data Migration</span>
|
||||
<span className="text-orange-300 text-xs">
|
||||
Data Migration
|
||||
</span>
|
||||
</div>
|
||||
<span className="text-orange-300 text-xs font-mono">40%</span>
|
||||
<span className="text-orange-300 text-xs font-mono">
|
||||
40%
|
||||
</span>
|
||||
</motion.div>
|
||||
</div>
|
||||
</motion.div>
|
||||
|
||||
|
||||
{/* Performance Improvements */}
|
||||
<motion.div
|
||||
initial={{ opacity: 0, y: 10 }}
|
||||
@@ -271,7 +324,9 @@ const LegacySystemRebuildsHero = () => {
|
||||
className="grid grid-cols-2 gap-3"
|
||||
>
|
||||
<div className="p-3 bg-gradient-to-br from-green-500/20 to-emerald-500/20 rounded-lg border border-green-500/30">
|
||||
<div className="text-green-400 text-lg font-bold">80%</div>
|
||||
<div className="text-green-400 text-lg font-bold">
|
||||
80%
|
||||
</div>
|
||||
<div className="text-white text-xs">Faster</div>
|
||||
</div>
|
||||
<div className="p-3 bg-gradient-to-br from-blue-500/20 to-cyan-500/20 rounded-lg border border-blue-500/30">
|
||||
@@ -280,7 +335,7 @@ const LegacySystemRebuildsHero = () => {
|
||||
</div>
|
||||
</motion.div>
|
||||
</motion.div>
|
||||
|
||||
|
||||
{/* Floating Modernization Elements */}
|
||||
<motion.div
|
||||
initial={{ opacity: 0, scale: 0.8 }}
|
||||
@@ -292,7 +347,7 @@ const LegacySystemRebuildsHero = () => {
|
||||
<Database className="w-6 h-6 text-blue-400" />
|
||||
</div>
|
||||
</motion.div>
|
||||
|
||||
|
||||
{/* Security Enhancement Indicator */}
|
||||
<motion.div
|
||||
initial={{ opacity: 0 }}
|
||||
@@ -322,7 +377,7 @@ const LegacySystemRebuildsHero = () => {
|
||||
></motion.div>
|
||||
</div>
|
||||
</motion.div>
|
||||
|
||||
|
||||
{/* Modernization Status Badge */}
|
||||
<motion.div
|
||||
initial={{ opacity: 0, scale: 0 }}
|
||||
@@ -338,7 +393,7 @@ const LegacySystemRebuildsHero = () => {
|
||||
</div>
|
||||
</motion.div>
|
||||
</motion.div>
|
||||
|
||||
|
||||
{/* Legacy Modernization Features */}
|
||||
<motion.div
|
||||
initial={{ opacity: 0, y: 30 }}
|
||||
@@ -346,15 +401,24 @@ const LegacySystemRebuildsHero = () => {
|
||||
transition={{ duration: 0.8, delay: 3.4 }}
|
||||
className="flex justify-center gap-4 flex-wrap mt-8"
|
||||
>
|
||||
<Badge variant="secondary" className="bg-blue-500/20 text-blue-300 border-blue-500/30">
|
||||
<Badge
|
||||
variant="secondary"
|
||||
className="bg-blue-500/20 text-blue-300 border-blue-500/30"
|
||||
>
|
||||
<RefreshCw className="w-3 h-3 mr-1" />
|
||||
Modernize
|
||||
</Badge>
|
||||
<Badge variant="secondary" className="bg-green-500/20 text-green-300 border-green-500/30">
|
||||
<Badge
|
||||
variant="secondary"
|
||||
className="bg-green-500/20 text-green-300 border-green-500/30"
|
||||
>
|
||||
<Shield className="w-3 h-3 mr-1" />
|
||||
Secure
|
||||
</Badge>
|
||||
<Badge variant="secondary" className="bg-purple-500/20 text-purple-300 border-purple-500/30">
|
||||
<Badge
|
||||
variant="secondary"
|
||||
className="bg-purple-500/20 text-purple-300 border-purple-500/30"
|
||||
>
|
||||
<TrendingUp className="w-3 h-3 mr-1" />
|
||||
Scale
|
||||
</Badge>
|
||||
@@ -384,7 +448,7 @@ const LegacySystemChallenge = () => {
|
||||
Breaking Free from Legacy Limitations
|
||||
</h2>
|
||||
</motion.div>
|
||||
|
||||
|
||||
<div className="grid md:grid-cols-2 gap-12 items-center">
|
||||
{/* Problem */}
|
||||
<motion.div
|
||||
@@ -399,10 +463,17 @@ const LegacySystemChallenge = () => {
|
||||
<div className="w-12 h-12 bg-red-500/20 rounded-xl flex items-center justify-center">
|
||||
<AlertTriangle className="w-6 h-6 text-red-400" />
|
||||
</div>
|
||||
<h3 className="text-2xl font-semibold text-foreground">The Problem</h3>
|
||||
<h3 className="text-2xl font-semibold text-foreground">
|
||||
The Problem
|
||||
</h3>
|
||||
</div>
|
||||
<div className="space-y-4 text-muted-foreground">
|
||||
<p>Outdated legacy systems often hinder innovation, increase operational costs, pose security risks, and struggle to integrate with modern technologies, slowing down business growth and agility.</p>
|
||||
<p>
|
||||
Outdated legacy systems often hinder innovation, increase
|
||||
operational costs, pose security risks, and struggle to
|
||||
integrate with modern technologies, slowing down business
|
||||
growth and agility.
|
||||
</p>
|
||||
<ul className="space-y-2">
|
||||
<li className="flex items-start gap-2">
|
||||
<X className="w-4 h-4 text-red-400 mt-1 flex-shrink-0" />
|
||||
@@ -410,7 +481,9 @@ const LegacySystemChallenge = () => {
|
||||
</li>
|
||||
<li className="flex items-start gap-2">
|
||||
<X className="w-4 h-4 text-red-400 mt-1 flex-shrink-0" />
|
||||
<span>Security vulnerabilities and compliance issues</span>
|
||||
<span>
|
||||
Security vulnerabilities and compliance issues
|
||||
</span>
|
||||
</li>
|
||||
<li className="flex items-start gap-2">
|
||||
<X className="w-4 h-4 text-red-400 mt-1 flex-shrink-0" />
|
||||
@@ -439,14 +512,24 @@ const LegacySystemChallenge = () => {
|
||||
<div className="w-12 h-12 bg-green-500/20 rounded-xl flex items-center justify-center">
|
||||
<CheckCircle className="w-6 h-6 text-green-400" />
|
||||
</div>
|
||||
<h3 className="text-2xl font-semibold text-foreground">Our Solution</h3>
|
||||
<h3 className="text-2xl font-semibold text-foreground">
|
||||
Our Solution
|
||||
</h3>
|
||||
</div>
|
||||
<div className="space-y-4 text-muted-foreground">
|
||||
<p>WDI specializes in strategically rebuilding and modernizing legacy systems. We help you migrate to robust, scalable, and secure platforms that improve performance, reduce technical debt, and unlock new business capabilities.</p>
|
||||
<p>
|
||||
WDI specializes in strategically rebuilding and
|
||||
modernizing legacy systems. We help you migrate to robust,
|
||||
scalable, and secure platforms that improve performance,
|
||||
reduce technical debt, and unlock new business
|
||||
capabilities.
|
||||
</p>
|
||||
<ul className="space-y-2">
|
||||
<li className="flex items-start gap-2">
|
||||
<CheckCircle className="w-4 h-4 text-green-400 mt-1 flex-shrink-0" />
|
||||
<span>Strategic modernization with minimal disruption</span>
|
||||
<span>
|
||||
Strategic modernization with minimal disruption
|
||||
</span>
|
||||
</li>
|
||||
<li className="flex items-start gap-2">
|
||||
<CheckCircle className="w-4 h-4 text-green-400 mt-1 flex-shrink-0" />
|
||||
@@ -478,38 +561,42 @@ const LegacySystemIncludes = () => {
|
||||
{
|
||||
icon: Search,
|
||||
title: "System Audit & Assessment",
|
||||
description: "In-depth analysis of existing system, code, and infrastructure."
|
||||
description:
|
||||
"In-depth analysis of existing system, code, and infrastructure.",
|
||||
},
|
||||
{
|
||||
icon: CloudCog,
|
||||
title: "Re-platforming & Migration",
|
||||
description: "Moving applications to new platforms (cloud, modern OS)."
|
||||
description: "Moving applications to new platforms (cloud, modern OS).",
|
||||
},
|
||||
{
|
||||
icon: Code,
|
||||
title: "Code Refactoring & Optimization",
|
||||
description: "Cleaning and improving existing codebases for efficiency."
|
||||
description: "Cleaning and improving existing codebases for efficiency.",
|
||||
},
|
||||
{
|
||||
icon: Database,
|
||||
title: "Database Modernization",
|
||||
description: "Upgrading or migrating databases for better performance and scalability."
|
||||
description:
|
||||
"Upgrading or migrating databases for better performance and scalability.",
|
||||
},
|
||||
{
|
||||
icon: Network,
|
||||
title: "API Development",
|
||||
description: "Creating robust APIs for seamless integration with other systems."
|
||||
description:
|
||||
"Creating robust APIs for seamless integration with other systems.",
|
||||
},
|
||||
{
|
||||
icon: Palette,
|
||||
title: "UI/UX Revitalization",
|
||||
description: "Designing modern, intuitive user interfaces for enhanced usability."
|
||||
description:
|
||||
"Designing modern, intuitive user interfaces for enhanced usability.",
|
||||
},
|
||||
{
|
||||
icon: ArrowUpDown,
|
||||
title: "Data Migration Strategy",
|
||||
description: "Secure and accurate transfer of historical data."
|
||||
}
|
||||
description: "Secure and accurate transfer of historical data.",
|
||||
},
|
||||
];
|
||||
|
||||
return (
|
||||
@@ -526,7 +613,7 @@ const LegacySystemIncludes = () => {
|
||||
Our Comprehensive Legacy Modernization Services
|
||||
</h2>
|
||||
</motion.div>
|
||||
|
||||
|
||||
<motion.div
|
||||
initial={{ opacity: 0, y: 40 }}
|
||||
whileInView={{ opacity: 1, y: 0 }}
|
||||
@@ -606,28 +693,31 @@ const LegacySystemBenefits = () => {
|
||||
{
|
||||
icon: Gauge,
|
||||
title: "Enhanced Performance",
|
||||
description: "Drastically improve speed, reliability, and responsiveness."
|
||||
description:
|
||||
"Drastically improve speed, reliability, and responsiveness.",
|
||||
},
|
||||
{
|
||||
icon: DollarSign,
|
||||
title: "Reduced Operational Costs",
|
||||
description: "Lower maintenance, energy, and resource expenditure."
|
||||
description: "Lower maintenance, energy, and resource expenditure.",
|
||||
},
|
||||
{
|
||||
icon: Shield,
|
||||
title: "Improved Security",
|
||||
description: "Address vulnerabilities and meet current security standards."
|
||||
description:
|
||||
"Address vulnerabilities and meet current security standards.",
|
||||
},
|
||||
{
|
||||
icon: Scale,
|
||||
title: "Increased Agility & Scalability",
|
||||
description: "Adapt quickly to market changes and scale operations effortlessly."
|
||||
description:
|
||||
"Adapt quickly to market changes and scale operations effortlessly.",
|
||||
},
|
||||
{
|
||||
icon: Network,
|
||||
title: "Seamless Integrations",
|
||||
description: "Connect with modern tools and third-party services."
|
||||
}
|
||||
description: "Connect with modern tools and third-party services.",
|
||||
},
|
||||
];
|
||||
|
||||
return (
|
||||
@@ -644,7 +734,7 @@ const LegacySystemBenefits = () => {
|
||||
Unlock New Potential with Modernized Systems
|
||||
</h2>
|
||||
</motion.div>
|
||||
|
||||
|
||||
<motion.div
|
||||
initial={{ opacity: 0, y: 40 }}
|
||||
whileInView={{ opacity: 1, y: 0 }}
|
||||
@@ -729,39 +819,46 @@ const LegacySystemProcess = () => {
|
||||
const steps = [
|
||||
{
|
||||
title: "Discovery & Assessment",
|
||||
description: "Comprehensive analysis of the existing system, business needs, and future goals.",
|
||||
icon: Search
|
||||
description:
|
||||
"Comprehensive analysis of the existing system, business needs, and future goals.",
|
||||
icon: Search,
|
||||
},
|
||||
{
|
||||
title: "Strategy & Roadmap",
|
||||
description: "Define the modernization approach (rebuild, re-platform, re-architect) and create a detailed plan.",
|
||||
icon: Target
|
||||
title: "Strategy & Roadmap",
|
||||
description:
|
||||
"Define the modernization approach (rebuild, re-platform, re-architect) and create a detailed plan.",
|
||||
icon: Target,
|
||||
},
|
||||
{
|
||||
title: "Architecture & Design",
|
||||
description: "Design the new system's architecture, UI/UX, and data models.",
|
||||
icon: Building
|
||||
description:
|
||||
"Design the new system's architecture, UI/UX, and data models.",
|
||||
icon: Building,
|
||||
},
|
||||
{
|
||||
title: "Phased Development",
|
||||
description: "Iterative development and migration, minimizing disruption to current operations.",
|
||||
icon: GitBranch
|
||||
description:
|
||||
"Iterative development and migration, minimizing disruption to current operations.",
|
||||
icon: GitBranch,
|
||||
},
|
||||
{
|
||||
title: "Rigorous Testing",
|
||||
description: "Comprehensive testing to ensure functionality, performance, and data integrity.",
|
||||
icon: Shield
|
||||
description:
|
||||
"Comprehensive testing to ensure functionality, performance, and data integrity.",
|
||||
icon: Shield,
|
||||
},
|
||||
{
|
||||
title: "Deployment & Cutover",
|
||||
description: "Seamless transition to the new system with minimal downtime.",
|
||||
icon: Rocket
|
||||
description:
|
||||
"Seamless transition to the new system with minimal downtime.",
|
||||
icon: Rocket,
|
||||
},
|
||||
{
|
||||
title: "Post-Modernization Support",
|
||||
description: "Ongoing maintenance, optimization, and future enhancements.",
|
||||
icon: Headphones
|
||||
}
|
||||
description:
|
||||
"Ongoing maintenance, optimization, and future enhancements.",
|
||||
icon: Headphones,
|
||||
},
|
||||
];
|
||||
|
||||
return (
|
||||
@@ -782,12 +879,12 @@ const LegacySystemProcess = () => {
|
||||
<div className="relative">
|
||||
{/* Timeline line */}
|
||||
<div className="absolute left-1/2 transform -translate-x-1/2 h-full w-0.5 bg-gradient-to-b from-accent via-accent/50 to-transparent hidden lg:block"></div>
|
||||
|
||||
|
||||
<div className="space-y-16">
|
||||
{steps.map((step, index) => {
|
||||
const IconComponent = step.icon;
|
||||
const isEven = index % 2 === 0;
|
||||
|
||||
|
||||
return (
|
||||
<motion.div
|
||||
key={index}
|
||||
@@ -795,15 +892,23 @@ const LegacySystemProcess = () => {
|
||||
whileInView={{ opacity: 1, x: 0 }}
|
||||
transition={{ duration: 0.8, delay: index * 0.2 }}
|
||||
viewport={{ once: true }}
|
||||
className={`flex items-center ${isEven ? 'lg:flex-row' : 'lg:flex-row-reverse'} flex-col lg:gap-16 gap-8`}
|
||||
className={`flex items-center ${
|
||||
isEven ? "lg:flex-row" : "lg:flex-row-reverse"
|
||||
} flex-col lg:gap-16 gap-8`}
|
||||
>
|
||||
<div className={`flex-1 ${isEven ? 'lg:text-right' : 'lg:text-left'} text-center lg:text-left`}>
|
||||
<div
|
||||
className={`flex-1 ${
|
||||
isEven ? "lg:text-right" : "lg:text-left"
|
||||
} text-center lg:text-left`}
|
||||
>
|
||||
<div className="bg-gray-900/50 backdrop-blur-md rounded-2xl border border-gray-800 p-8 hover:border-accent/30 transition-all duration-300 shadow-lg hover:shadow-xl">
|
||||
<div className="flex items-center gap-4 mb-4 justify-center lg:justify-start">
|
||||
<div className="w-12 h-12 bg-accent/20 rounded-xl flex items-center justify-center">
|
||||
<IconComponent className="w-6 h-6 text-accent" />
|
||||
</div>
|
||||
<div className="text-2xl font-bold text-accent">0{index + 1}</div>
|
||||
<div className="text-2xl font-bold text-accent">
|
||||
0{index + 1}
|
||||
</div>
|
||||
</div>
|
||||
<h3 className="text-2xl font-semibold text-white mb-4">
|
||||
{step.title}
|
||||
@@ -813,10 +918,10 @@ const LegacySystemProcess = () => {
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
{/* Timeline dot */}
|
||||
<div className="w-4 h-4 bg-accent rounded-full border-4 border-black z-10 hidden lg:block"></div>
|
||||
|
||||
|
||||
<div className="flex-1 hidden lg:block"></div>
|
||||
</motion.div>
|
||||
);
|
||||
@@ -834,28 +939,31 @@ const LegacySystemAudience = () => {
|
||||
{
|
||||
icon: Building,
|
||||
title: "Enterprises",
|
||||
description: "Burdened by outdated software and high maintenance costs."
|
||||
description: "Burdened by outdated software and high maintenance costs.",
|
||||
},
|
||||
{
|
||||
icon: Shield,
|
||||
title: "Organizations with Security Risks",
|
||||
description: "Facing security risks due to unpatched or unsupported systems."
|
||||
description:
|
||||
"Facing security risks due to unpatched or unsupported systems.",
|
||||
},
|
||||
{
|
||||
icon: Network,
|
||||
title: "Companies with Integration Issues",
|
||||
description: "Struggling with integration issues between legacy and modern applications."
|
||||
description:
|
||||
"Struggling with integration issues between legacy and modern applications.",
|
||||
},
|
||||
{
|
||||
icon: TrendingUp,
|
||||
title: "Scaling Businesses",
|
||||
description: "Seeking to scale but limited by current infrastructure."
|
||||
description: "Seeking to scale but limited by current infrastructure.",
|
||||
},
|
||||
{
|
||||
icon: Users,
|
||||
title: "IT Departments",
|
||||
description: "Looking to reduce technical debt and improve developer productivity."
|
||||
}
|
||||
description:
|
||||
"Looking to reduce technical debt and improve developer productivity.",
|
||||
},
|
||||
];
|
||||
|
||||
return (
|
||||
@@ -872,7 +980,7 @@ const LegacySystemAudience = () => {
|
||||
Ideal For...
|
||||
</h2>
|
||||
</motion.div>
|
||||
|
||||
|
||||
<motion.div
|
||||
initial={{ opacity: 0, y: 40 }}
|
||||
whileInView={{ opacity: 1, y: 0 }}
|
||||
@@ -958,30 +1066,36 @@ const LegacySystemCaseStudies = () => {
|
||||
{
|
||||
title: "Manufacturing ERP Modernization",
|
||||
client: "Manufacturing Company",
|
||||
description: "Rebuilt a core ERP system from legacy mainframe to modern cloud architecture, reducing processing time by 60% and improving data accuracy while maintaining 99.9% uptime during the transition process.",
|
||||
image: "https://images.unsplash.com/photo-1565514158740-3011dbf5b2ed?w=400&h=300&fit=crop&auto=format",
|
||||
description:
|
||||
"Rebuilt a core ERP system from legacy mainframe to modern cloud architecture, reducing processing time by 60% and improving data accuracy while maintaining 99.9% uptime during the transition process.",
|
||||
image:
|
||||
"https://images.unsplash.com/photo-1565514158740-3011dbf5b2ed?w=400&h=300&fit=crop&auto=format",
|
||||
results: "60% faster processing, improved accuracy",
|
||||
engagement: "Complete ERP transformation",
|
||||
gradient: "from-blue-500/20 to-cyan-500/20"
|
||||
gradient: "from-blue-500/20 to-cyan-500/20",
|
||||
},
|
||||
{
|
||||
title: "Financial Services Platform Re-platform",
|
||||
client: "Financial Institution",
|
||||
description: "Migrated an outdated financial platform to cloud infrastructure, achieving 99.9% uptime and enabling new service offerings while reducing operational costs by 40% and improving security compliance.",
|
||||
image: "https://images.unsplash.com/photo-1563013544-824ae1b704d3?w=400&h=300&fit=crop&auto=format",
|
||||
description:
|
||||
"Migrated an outdated financial platform to cloud infrastructure, achieving 99.9% uptime and enabling new service offerings while reducing operational costs by 40% and improving security compliance.",
|
||||
image:
|
||||
"https://images.unsplash.com/photo-1563013544-824ae1b704d3?w=400&h=300&fit=crop&auto=format",
|
||||
results: "99.9% uptime, 40% cost reduction",
|
||||
engagement: "Financial platform modernization",
|
||||
gradient: "from-green-500/20 to-emerald-500/20"
|
||||
gradient: "from-green-500/20 to-emerald-500/20",
|
||||
},
|
||||
{
|
||||
title: "Healthcare System Integration",
|
||||
client: "Healthcare Provider",
|
||||
description: "Modernized legacy patient management system with cloud-based architecture, enabling real-time data access, improving patient care coordination, and achieving HIPAA compliance with enhanced security.",
|
||||
image: "https://images.unsplash.com/photo-1576091160399-112ba8d25d1f?w=400&h=300&fit=crop&auto=format",
|
||||
description:
|
||||
"Modernized legacy patient management system with cloud-based architecture, enabling real-time data access, improving patient care coordination, and achieving HIPAA compliance with enhanced security.",
|
||||
image:
|
||||
"https://images.unsplash.com/photo-1576091160399-112ba8d25d1f?w=400&h=300&fit=crop&auto=format",
|
||||
results: "Real-time access, HIPAA compliant",
|
||||
engagement: "Healthcare system overhaul",
|
||||
gradient: "from-purple-500/20 to-pink-500/20"
|
||||
}
|
||||
gradient: "from-purple-500/20 to-pink-500/20",
|
||||
},
|
||||
];
|
||||
|
||||
return (
|
||||
@@ -998,7 +1112,7 @@ const LegacySystemCaseStudies = () => {
|
||||
Businesses Reimagined with Modern Systems
|
||||
</h2>
|
||||
</motion.div>
|
||||
|
||||
|
||||
<motion.div
|
||||
initial={{ opacity: 0, y: 40 }}
|
||||
whileInView={{ opacity: 1, y: 0 }}
|
||||
@@ -1027,19 +1141,24 @@ const LegacySystemCaseStudies = () => {
|
||||
<div className="text-xs text-gray-400 mb-2 uppercase tracking-wider">
|
||||
{study.client}
|
||||
</div>
|
||||
<Badge variant="secondary" className="text-xs bg-accent/20 text-accent border-accent/30">
|
||||
<Badge
|
||||
variant="secondary"
|
||||
className="text-xs bg-accent/20 text-accent border-accent/30"
|
||||
>
|
||||
{study.results}
|
||||
</Badge>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<h3 className="text-xl font-semibold text-white mb-4 leading-tight">
|
||||
{study.title}
|
||||
</h3>
|
||||
</div>
|
||||
|
||||
|
||||
<div className="px-8 pb-6 flex-1">
|
||||
<div className={`relative rounded-xl overflow-hidden bg-gradient-to-br ${study.gradient} p-4 border border-white/10`}>
|
||||
<div
|
||||
className={`relative rounded-xl overflow-hidden bg-gradient-to-br ${study.gradient} p-4 border border-white/10`}
|
||||
>
|
||||
<ImageWithFallback
|
||||
src={study.image}
|
||||
alt={study.title}
|
||||
@@ -1047,7 +1166,7 @@ const LegacySystemCaseStudies = () => {
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div className="px-8 pb-6">
|
||||
<p className="text-gray-300 text-sm leading-relaxed mb-4">
|
||||
{study.description}
|
||||
@@ -1059,14 +1178,16 @@ const LegacySystemCaseStudies = () => {
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div className="p-8 pt-0 mt-auto">
|
||||
<Button
|
||||
variant="ghost"
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="sm"
|
||||
className="w-full justify-between text-accent hover:text-accent hover:bg-accent/10 group-hover:translate-x-1 transition-all duration-300 h-auto py-3"
|
||||
>
|
||||
<span className="text-sm font-medium">VIEW FULL CASE STUDY</span>
|
||||
<span className="text-sm font-medium">
|
||||
VIEW FULL CASE STUDY
|
||||
</span>
|
||||
<ArrowRight className="w-4 h-4" />
|
||||
</Button>
|
||||
</div>
|
||||
@@ -1102,20 +1223,26 @@ const LegacySystemInlineCTA = () => {
|
||||
<div className="inline-block p-[2px] rounded-full bg-gradient-to-r from-accent via-blue-500 to-green-500">
|
||||
<div className="bg-background rounded-full px-6 py-3 flex items-center gap-2">
|
||||
<RefreshCw className="w-5 h-5 text-foreground" />
|
||||
<span className="text-foreground text-base font-medium">System Modernization</span>
|
||||
<span className="text-foreground text-base font-medium">
|
||||
System Modernization
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<h2 className="text-4xl lg:text-5xl font-semibold text-foreground leading-tight">
|
||||
Ready to Future-Proof Your{" "}
|
||||
<span className="text-accent">Business Operations?</span>
|
||||
</h2>
|
||||
|
||||
|
||||
<p className="text-xl text-muted-foreground leading-relaxed max-w-2xl mx-auto">
|
||||
Unlock efficiency, security, and scalability with our expert modernization services.
|
||||
Unlock efficiency, security, and scalability with our expert
|
||||
modernization services.
|
||||
</p>
|
||||
|
||||
<ShimmerButton className="text-xl px-10 py-5 rounded-2xl shadow-lg hover:shadow-xl">
|
||||
|
||||
<ShimmerButton
|
||||
className="text-xl px-10 py-5 rounded-2xl shadow-lg hover:shadow-xl"
|
||||
onClick={() => navigateTo("/start-a-project")}
|
||||
>
|
||||
<div className="inline-flex items-center gap-3">
|
||||
<Search className="w-6 h-6 flex-shrink-0" />
|
||||
<span>Get Your System Audit</span>
|
||||
@@ -1133,20 +1260,25 @@ const LegacySystemFAQs = () => {
|
||||
const faqs = [
|
||||
{
|
||||
question: "How long does a typical legacy system rebuild take?",
|
||||
answer: "The timeline for legacy system rebuilds varies significantly based on system complexity, scope, and business requirements. Simple system modernizations typically take 4-8 months, while complex enterprise-wide transformations can take 12-24 months. Our approach includes: Assessment and planning (4-6 weeks), phased development and migration (8-16 months), testing and validation (4-8 weeks), and deployment with support (2-4 weeks). We use agile methodologies and phased rollouts to minimize business disruption and deliver value incrementally throughout the project lifecycle."
|
||||
answer:
|
||||
"The timeline for legacy system rebuilds varies significantly based on system complexity, scope, and business requirements. Simple system modernizations typically take 4-8 months, while complex enterprise-wide transformations can take 12-24 months. Our approach includes: Assessment and planning (4-6 weeks), phased development and migration (8-16 months), testing and validation (4-8 weeks), and deployment with support (2-4 weeks). We use agile methodologies and phased rollouts to minimize business disruption and deliver value incrementally throughout the project lifecycle.",
|
||||
},
|
||||
{
|
||||
question: "What are the common risks associated with modernization projects?",
|
||||
answer: "Legacy modernization projects carry several risks that we actively mitigate: Data loss or corruption during migration (addressed through comprehensive backup and validation strategies), business disruption and downtime (minimized via phased rollouts and parallel systems), cost overruns and timeline delays (managed through detailed planning and agile execution), user adoption challenges (solved with training and change management), and integration failures with existing systems (prevented through thorough testing and compatibility analysis). We employ risk mitigation strategies including pilot programs, rollback plans, comprehensive testing, stakeholder communication, and experienced project management to ensure successful outcomes."
|
||||
question:
|
||||
"What are the common risks associated with modernization projects?",
|
||||
answer:
|
||||
"Legacy modernization projects carry several risks that we actively mitigate: Data loss or corruption during migration (addressed through comprehensive backup and validation strategies), business disruption and downtime (minimized via phased rollouts and parallel systems), cost overruns and timeline delays (managed through detailed planning and agile execution), user adoption challenges (solved with training and change management), and integration failures with existing systems (prevented through thorough testing and compatibility analysis). We employ risk mitigation strategies including pilot programs, rollback plans, comprehensive testing, stakeholder communication, and experienced project management to ensure successful outcomes.",
|
||||
},
|
||||
{
|
||||
question: "Do you support data migration from older databases?",
|
||||
answer: "Yes, we provide comprehensive data migration services for all major legacy database systems including: Mainframe databases (IBM DB2, IMS), legacy SQL systems (older versions of Oracle, SQL Server, MySQL), flat file systems and custom databases, cloud migration from on-premise to AWS/Azure/GCP, and cross-platform migrations between different database technologies. Our migration process includes: data assessment and mapping, migration strategy development, data cleansing and transformation, validation and integrity checking, performance optimization, and rollback planning. We ensure zero data loss and maintain data integrity throughout the migration process with comprehensive testing and validation procedures."
|
||||
answer:
|
||||
"Yes, we provide comprehensive data migration services for all major legacy database systems including: Mainframe databases (IBM DB2, IMS), legacy SQL systems (older versions of Oracle, SQL Server, MySQL), flat file systems and custom databases, cloud migration from on-premise to AWS/Azure/GCP, and cross-platform migrations between different database technologies. Our migration process includes: data assessment and mapping, migration strategy development, data cleansing and transformation, validation and integrity checking, performance optimization, and rollback planning. We ensure zero data loss and maintain data integrity throughout the migration process with comprehensive testing and validation procedures.",
|
||||
},
|
||||
{
|
||||
question: "What technologies do you use for rebuilding legacy systems?",
|
||||
answer: "We use modern, enterprise-grade technologies based on your specific requirements: Cloud platforms (AWS, Azure, Google Cloud), containerization (Docker, Kubernetes), microservices architecture, modern programming languages (Java, C#, Python, Node.js), database technologies (PostgreSQL, MongoDB, Redis), API technologies (REST, GraphQL), and CI/CD pipelines for automated deployment. Frontend technologies include React, Angular, Vue.js for web applications and React Native, Flutter for mobile. We select technologies based on factors like scalability requirements, performance needs, integration requirements, security standards, maintenance considerations, and your team's expertise. Our architects design future-proof solutions that can evolve with your business needs."
|
||||
}
|
||||
answer:
|
||||
"We use modern, enterprise-grade technologies based on your specific requirements: Cloud platforms (AWS, Azure, Google Cloud), containerization (Docker, Kubernetes), microservices architecture, modern programming languages (Java, C#, Python, Node.js), database technologies (PostgreSQL, MongoDB, Redis), API technologies (REST, GraphQL), and CI/CD pipelines for automated deployment. Frontend technologies include React, Angular, Vue.js for web applications and React Native, Flutter for mobile. We select technologies based on factors like scalability requirements, performance needs, integration requirements, security standards, maintenance considerations, and your team's expertise. Our architects design future-proof solutions that can evolve with your business needs.",
|
||||
},
|
||||
];
|
||||
|
||||
return (
|
||||
@@ -1163,7 +1295,7 @@ const LegacySystemFAQs = () => {
|
||||
Frequently Asked Questions
|
||||
</h2>
|
||||
</motion.div>
|
||||
|
||||
|
||||
<motion.div
|
||||
initial={{ opacity: 0, y: 40 }}
|
||||
whileInView={{ opacity: 1, y: 0 }}
|
||||
@@ -1173,13 +1305,15 @@ const LegacySystemFAQs = () => {
|
||||
>
|
||||
<Accordion type="single" collapsible className="space-y-8">
|
||||
{faqs.map((faq, index) => (
|
||||
<AccordionItem
|
||||
key={index}
|
||||
value={`item-${index}`}
|
||||
<AccordionItem
|
||||
key={index}
|
||||
value={`item-${index}`}
|
||||
className="bg-gray-900/50 backdrop-blur-md rounded-2xl border border-gray-800 px-10 shadow-lg"
|
||||
>
|
||||
<AccordionTrigger className="text-left hover:no-underline py-10 text-xl">
|
||||
<span className="font-semibold text-white">{faq.question}</span>
|
||||
<span className="font-semibold text-white">
|
||||
{faq.question}
|
||||
</span>
|
||||
</AccordionTrigger>
|
||||
<AccordionContent className="text-gray-300 pb-10 text-lg leading-relaxed">
|
||||
{faq.answer}
|
||||
@@ -1215,7 +1349,9 @@ const LegacySystemFinalCTA = () => {
|
||||
<div className="inline-block p-[2px] rounded-full bg-gradient-to-r from-accent via-blue-500 to-green-500">
|
||||
<div className="bg-background rounded-full px-6 py-3 flex items-center gap-2">
|
||||
<RefreshCw className="w-5 h-5 text-foreground" />
|
||||
<span className="text-foreground text-base font-medium">Modernization Excellence</span>
|
||||
<span className="text-foreground text-base font-medium">
|
||||
Modernization Excellence
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</motion.div>
|
||||
@@ -1224,7 +1360,7 @@ const LegacySystemFinalCTA = () => {
|
||||
Evolve Your Enterprise with{" "}
|
||||
<span className="text-accent">WDI's Modernization Expertise</span>
|
||||
</h2>
|
||||
|
||||
|
||||
<motion.p
|
||||
initial={{ opacity: 0, y: 20 }}
|
||||
whileInView={{ opacity: 1, y: 0 }}
|
||||
@@ -1232,7 +1368,8 @@ const LegacySystemFinalCTA = () => {
|
||||
viewport={{ once: true }}
|
||||
className="text-xl text-muted-foreground mb-12 max-w-2xl mx-auto leading-relaxed"
|
||||
>
|
||||
Don't let old technology hold you back. WDI helps you leap forward with robust, high-performing, and sustainable digital solutions.
|
||||
Don't let old technology hold you back. WDI helps you leap forward
|
||||
with robust, high-performing, and sustainable digital solutions.
|
||||
</motion.p>
|
||||
|
||||
<motion.div
|
||||
@@ -1242,7 +1379,10 @@ const LegacySystemFinalCTA = () => {
|
||||
viewport={{ once: true }}
|
||||
className="space-y-8"
|
||||
>
|
||||
<ShimmerButton className="px-12 py-6 text-xl rounded-2xl shadow-2xl hover:shadow-accent/25">
|
||||
<ShimmerButton
|
||||
className="px-12 py-6 text-xl rounded-2xl shadow-2xl hover:shadow-accent/25"
|
||||
onClick={() => navigateTo("/start-a-project")}
|
||||
>
|
||||
<div className="inline-flex items-center gap-3">
|
||||
<Calendar className="w-6 h-6 flex-shrink-0" />
|
||||
<span>Schedule a Consultation</span>
|
||||
@@ -1271,61 +1411,61 @@ export const LegacySystemRebuilds = () => {
|
||||
return (
|
||||
<div className="dark min-h-screen">
|
||||
<Navigation />
|
||||
|
||||
|
||||
{/* Hero Section */}
|
||||
<section className="bg-black">
|
||||
<LegacySystemRebuildsHero />
|
||||
</section>
|
||||
|
||||
|
||||
{/* Challenge */}
|
||||
<section className="bg-background">
|
||||
<LegacySystemChallenge />
|
||||
</section>
|
||||
|
||||
|
||||
{/* What's Included */}
|
||||
<section className="bg-card">
|
||||
<LegacySystemIncludes />
|
||||
</section>
|
||||
|
||||
|
||||
{/* Benefits */}
|
||||
<section className="bg-background">
|
||||
<LegacySystemBenefits />
|
||||
</section>
|
||||
|
||||
|
||||
{/* Process */}
|
||||
<section className="bg-card">
|
||||
<LegacySystemProcess />
|
||||
</section>
|
||||
|
||||
|
||||
{/* Target Audience */}
|
||||
<section className="bg-background">
|
||||
<LegacySystemAudience />
|
||||
</section>
|
||||
|
||||
|
||||
{/* Case Studies */}
|
||||
<section className="bg-card">
|
||||
<LegacySystemCaseStudies />
|
||||
</section>
|
||||
|
||||
|
||||
{/* Mid-Page CTA */}
|
||||
<section className="bg-background">
|
||||
<LegacySystemInlineCTA />
|
||||
</section>
|
||||
|
||||
|
||||
{/* FAQs */}
|
||||
<section className="bg-card">
|
||||
<LegacySystemFAQs />
|
||||
</section>
|
||||
|
||||
|
||||
{/* Final CTA */}
|
||||
<section className="bg-background">
|
||||
<LegacySystemFinalCTA />
|
||||
</section>
|
||||
|
||||
|
||||
{/* Footer */}
|
||||
<section className="bg-card">
|
||||
<Footer />
|
||||
</section>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user