import React, { FC } from 'react'; import { FaRocket, FaAward, FaBuilding } from 'react-icons/fa'; import { IconType } from 'react-icons'; // Type for a single milestone interface Milestone { icon: IconType; iconBg: string; cardBg: string; glowColor: string; title: string; year: string; description: string; } // Constants for customization const CONSTANTS = { BACKGROUND_COLOR: 'bg-gray-900', TITLE: 'MILESTONES', SUBTITLE: 'ACHIEVEMENTS', SUBTITLE_BG: 'bg-cyan-500', }; // Array of milestone data const MILESTONES: Milestone[] = [ { icon: FaRocket, iconBg: 'bg-cyan-500', cardBg: 'bg-gray-800', glowColor: 'cyan', title: 'Founded', year: '2012', description: 'We launched our journey with a vision to merge radical design with cutting-edge technology, setting the stage for a new era of innovation.', }, { icon: FaAward, iconBg: 'bg-pink-500', cardBg: 'bg-purple-900', glowColor: 'pink', title: 'First Award', year: '2015', description: 'Our innovative approach was recognized with our first industry award, validating our vision and driving us to push boundaries even further.', }, { icon: FaBuilding, iconBg: 'bg-yellow-500', cardBg: 'bg-blue-900', glowColor: 'cyan', title: 'Global Expansion', year: '2018', description: 'We expanded globally, establishing offices in key cities around the world, and bringing our unique vision to a wider audience.', }, ]; // Background grid component const BackgroundGrid: FC = () => (

); // Milestone component interface MilestoneProps { milestone: Milestone; index: number; } const Milestone: FC = ({ milestone, index }) => { const isEven = index % 2 === 0; const IconComponent = milestone.icon; return (

{milestone.title}

{milestone.description}

); }; // Main component const MilestonesBrutalistCyberpunk: FC = () => { return (

{CONSTANTS.TITLE}
{CONSTANTS.SUBTITLE}

{MILESTONES.map((milestone, index) => ( ))}

); }; export default MilestonesBrutalistCyberpunk;

{milestone.title}

{CONSTANTS.TITLE} {CONSTANTS.SUBTITLE}

{CONSTANTS.TITLE}
{CONSTANTS.SUBTITLE}

Milestones Components

Cyberpunk Milestones