104 lines
4.1 KiB
TypeScript
104 lines
4.1 KiB
TypeScript
import React, { useState, useEffect, useCallback } from 'react';
|
|
import { ChevronLeft, ChevronRight } from 'lucide-react';
|
|
// import { navigateTo } from './Router';
|
|
import { navigateTo } from '../components/Router';
|
|
import svgPaths from "../imports/svg-i1joeov37f";
|
|
import { StatsSection } from '../components/StatsSection';
|
|
import { LogosSection } from '../components/LogosSection';
|
|
import { ServicesSection } from '../components/ServicesSection';
|
|
import { ServicesSectionNew } from '../components/ServiceSectionNew';
|
|
import { LearningEnvionment } from '../components/LearningEnvionment';
|
|
import { motion } from "motion/react";
|
|
import { BrandedTag } from '../components/about/BrandedTag';
|
|
import { PrimaryCTAButton } from '../components/PrimaryCTAButton';
|
|
import { VirtualSpaceSection } from '../components/VirtualSpaceSection';
|
|
import { useNavigate } from 'react-router-dom';
|
|
import HeroSection from '../components/HeroSection';
|
|
interface SlideData {
|
|
id: number;
|
|
title: string;
|
|
backgroundImage: string;
|
|
shortTitle: string;
|
|
ctaText: string;
|
|
}
|
|
|
|
export default function HomePageNew() {
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const navigate = useNavigate()
|
|
return (
|
|
<>
|
|
<HeroSection />
|
|
<StatsSection />
|
|
<LogosSection />
|
|
<ServicesSectionNew />
|
|
{/* <LearningEnvionment /> */}
|
|
<div>
|
|
<div className="mx-auto text-center py-16 px-4 bg-gradient-to-r from-blue-900 via-gray-400 to-black exp-our-head-tab-sec" >
|
|
{/* Branded Tag */}
|
|
<motion.div
|
|
initial={{ opacity: 0, y: -20 }}
|
|
whileInView={{ opacity: 1, y: 0 }}
|
|
transition={{ duration: 0.6 }}
|
|
viewport={{ once: true }}
|
|
>
|
|
<BrandedTag
|
|
text="Virtual Learning Environment"
|
|
className="justify-center"
|
|
variant="white"
|
|
/>
|
|
</motion.div>
|
|
|
|
{/* Main Heading */}
|
|
<motion.h2
|
|
className="text-5xl font-bold leading-tight mb-4 max-lg:text-4xl max-md:text-3xl text-white"
|
|
initial={{ opacity: 0, y: 30 }}
|
|
whileInView={{ opacity: 1, y: 0 }}
|
|
transition={{ duration: 0.8, delay: 0.2 }}
|
|
viewport={{ once: true }}
|
|
>
|
|
Experience Our Space Virtually
|
|
</motion.h2>
|
|
|
|
{/* Subheading */}
|
|
<motion.p
|
|
className="text-lg leading-relaxed max-w-2xl mx-auto max-lg:text-base mb-6 text-white/90"
|
|
initial={{ opacity: 0, y: 20 }}
|
|
whileInView={{ opacity: 1, y: 0 }}
|
|
transition={{ duration: 0.8, delay: 0.4 }}
|
|
viewport={{ once: true }}
|
|
>
|
|
Take a virtual walk through our state-of-the-art facility designed to inspire leadership excellence and foster collaborative learning.
|
|
</motion.p>
|
|
|
|
{/* Main CTA Button - Explore Our Space */}
|
|
<motion.div
|
|
className="flex justify-center"
|
|
initial={{ opacity: 0, y: 20 }}
|
|
whileInView={{ opacity: 1, y: 0 }}
|
|
transition={{ duration: 0.8, delay: 0.6 }}
|
|
viewport={{ once: true }}
|
|
>
|
|
<div className="hero-slide-button">
|
|
<PrimaryCTAButton
|
|
text="Explore Our Space"
|
|
onClick={() => navigate('/services/learning-facility')}
|
|
ariaLabel="Explore our virtual learning space and facilities"
|
|
/>
|
|
</div>
|
|
</motion.div>
|
|
</div>
|
|
<VirtualSpaceSection />
|
|
</div>
|
|
</>
|
|
|
|
);
|
|
} |