changes and scroll top
This commit is contained in:
priyanshuvish
@@ -15,15 +15,11 @@ interface ContactProps {
|
||||
|
||||
export function Contact({ topic }: ContactProps) {
|
||||
const [formData, setFormData] = useState({
|
||||
firstName: '',
|
||||
lastName: '',
|
||||
email: '',
|
||||
phone: '',
|
||||
company: '',
|
||||
jobTitle: '',
|
||||
subject: topic || '',
|
||||
message: '',
|
||||
source: ''
|
||||
name: '',
|
||||
mobileNumber: '',
|
||||
emailId: '',
|
||||
interestedIn: topic || '',
|
||||
message: ''
|
||||
});
|
||||
|
||||
const [isSubmitted, setIsSubmitted] = useState(false);
|
||||
@@ -31,13 +27,13 @@ export function Contact({ topic }: ContactProps) {
|
||||
|
||||
useEffect(() => {
|
||||
console.log('Contact component mounted with topic:', topic);
|
||||
// Set default subject based on topic parameter
|
||||
// Set default interested in based on topic parameter
|
||||
if (topic) {
|
||||
const subject = getTopicSubject(topic);
|
||||
console.log('Setting form subject to:', subject);
|
||||
const interestedIn = getTopicSubject(topic);
|
||||
console.log('Setting form interestedIn to:', interestedIn);
|
||||
setFormData(prev => ({
|
||||
...prev,
|
||||
subject: subject
|
||||
interestedIn: interestedIn
|
||||
}));
|
||||
}
|
||||
}, [topic]);
|
||||
@@ -77,7 +73,7 @@ export function Contact({ topic }: ContactProps) {
|
||||
|
||||
if (isSubmitted) {
|
||||
return (
|
||||
<div className="min-h-screen" style={{ backgroundColor: '#F7F7FD' }}>
|
||||
<div className="min-h-screen" style={{ backgroundColor: '#FFFFFF' }}>
|
||||
<div className="section-margin-x py-24">
|
||||
<div className="max-w-2xl mx-auto text-center">
|
||||
<div className="w-20 h-20 bg-green-100 rounded-full flex items-center justify-center mx-auto mb-6">
|
||||
@@ -100,19 +96,19 @@ export function Contact({ topic }: ContactProps) {
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="min-h-screen" style={{ backgroundColor: '#F7F7FD' }}>
|
||||
{/* Hero Section with CTA Banner Styling */}
|
||||
<section className="relative h-[600px] overflow-hidden">
|
||||
{/* Background Image */}
|
||||
<div className="min-h-screen" style={{ backgroundColor: '#FFFFFF' }}>
|
||||
{/* Hero Section with Google Map Background */}
|
||||
<section className="relative h-[600px] overflow-hidden">
|
||||
{/* Google Map Background */}
|
||||
<div className="absolute inset-0">
|
||||
<ImageWithFallback
|
||||
src="https://images.unsplash.com/photo-1600880292203-757bb62b4baf?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2940&q=80"
|
||||
alt="Professional business meeting and consultation"
|
||||
src="https://images.unsplash.com/photo-1569336415962-a4bd9f69cd83?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2940&q=80"
|
||||
alt="Google Maps showing office location and navigation"
|
||||
className="w-full h-full object-cover"
|
||||
/>
|
||||
|
||||
{/* 40% black overlay for better text readability */}
|
||||
<div className="absolute inset-0 bg-black/70" />
|
||||
{/* Dark overlay for better text readability */}
|
||||
<div className="absolute inset-0 bg-black/60" />
|
||||
</div>
|
||||
|
||||
{/* Content Container */}
|
||||
@@ -120,22 +116,16 @@ export function Contact({ topic }: ContactProps) {
|
||||
{/* Hero Content Block */}
|
||||
<div className="text-center max-w-4xl mx-auto">
|
||||
{/* Branded Tag */}
|
||||
<BrandedTag text="Get In Touch" variant="white" />
|
||||
<BrandedTag text="Contact Us" variant="white" />
|
||||
|
||||
{/* Main Headline */}
|
||||
<h1 className="text-h1-white mb-6">
|
||||
Ready to transform your leadership?
|
||||
<span
|
||||
className="italic"
|
||||
style={{ color: 'var(--color-brand-accent)' }}
|
||||
>
|
||||
{" "}Let's connect{" "}
|
||||
</span>
|
||||
Reach us
|
||||
</h1>
|
||||
|
||||
{/* Supporting Text */}
|
||||
<p className="text-body-lg-white opacity-90 max-w-3xl mx-auto">
|
||||
To start your development journey.
|
||||
Get in touch with us to start your leadership development journey.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
@@ -161,7 +151,7 @@ export function Contact({ topic }: ContactProps) {
|
||||
|
||||
{/* Contact Details */}
|
||||
<div className="p-8 space-y-8">
|
||||
{/* Office Location */}
|
||||
{/* Corporate Office */}
|
||||
<div className="flex items-start gap-4">
|
||||
<div
|
||||
className="w-12 h-12 rounded-lg flex items-center justify-center flex-shrink-0"
|
||||
@@ -170,28 +160,31 @@ export function Contact({ topic }: ContactProps) {
|
||||
<MapPin className="w-6 h-6" style={{ color: 'var(--color-brand-primary)' }} />
|
||||
</div>
|
||||
<div>
|
||||
<h3 className="text-h3 mb-2">Office Location</h3>
|
||||
<h3 className="text-h3 mb-2">Corporate Office</h3>
|
||||
<p className="text-body text-muted">
|
||||
123 Leadership Avenue<br />
|
||||
Business District, New Delhi<br />
|
||||
110001, India
|
||||
Leadership Centre Pvt. Ltd.<br />
|
||||
No. 107, 1st Floor<br />
|
||||
T.V. Industrial Estate, Worli<br />
|
||||
Mumbai 400030
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Phone */}
|
||||
{/* Registered Office */}
|
||||
<div className="flex items-start gap-4">
|
||||
<div
|
||||
className="w-12 h-12 rounded-lg flex items-center justify-center flex-shrink-0"
|
||||
style={{ backgroundColor: 'rgba(248, 195, 1, 0.1)' }}
|
||||
>
|
||||
<Phone className="w-6 h-6" style={{ color: 'var(--color-brand-primary)' }} />
|
||||
<MapPin className="w-6 h-6" style={{ color: 'var(--color-brand-primary)' }} />
|
||||
</div>
|
||||
<div>
|
||||
<h3 className="text-h3 mb-2">Phone</h3>
|
||||
<h3 className="text-h3 mb-2">Registered Office</h3>
|
||||
<p className="text-body text-muted">
|
||||
+91 11 4567 8900<br />
|
||||
+91 98765 43210
|
||||
Kautilya Leadership Services<br />
|
||||
R.S. No. 5/6, Savaroli Kharpada Road<br />
|
||||
Dhamani Taluk, Khalapur District<br />
|
||||
Raigad – 410202
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
@@ -207,26 +200,25 @@ export function Contact({ topic }: ContactProps) {
|
||||
<div>
|
||||
<h3 className="text-h3 mb-2">Email</h3>
|
||||
<p className="text-body text-muted">
|
||||
info@klc.edu<br />
|
||||
leadership@klc.edu
|
||||
connect@leadershipcentre.in<br />
|
||||
connect@kautilyaservices.in
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Business Hours */}
|
||||
{/* Phone */}
|
||||
<div className="flex items-start gap-4">
|
||||
<div
|
||||
className="w-12 h-12 rounded-lg flex items-center justify-center flex-shrink-0"
|
||||
style={{ backgroundColor: 'rgba(248, 195, 1, 0.1)' }}
|
||||
>
|
||||
<Clock className="w-6 h-6" style={{ color: 'var(--color-brand-primary)' }} />
|
||||
<Phone className="w-6 h-6" style={{ color: 'var(--color-brand-primary)' }} />
|
||||
</div>
|
||||
<div>
|
||||
<h3 className="text-h3 mb-2">Business Hours</h3>
|
||||
<h3 className="text-h3 mb-2">Phone</h3>
|
||||
<p className="text-body text-muted">
|
||||
Monday - Friday: 9:00 AM - 6:00 PM<br />
|
||||
Saturday: 10:00 AM - 4:00 PM<br />
|
||||
Sunday: Closed
|
||||
+91-22-2084 0097<br />
|
||||
+91-8928738661
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
@@ -280,7 +272,7 @@ export function Contact({ topic }: ContactProps) {
|
||||
>
|
||||
<Send className="w-5 h-5" style={{ color: 'var(--color-brand-primary)' }} />
|
||||
</div>
|
||||
<h2 className="text-h3">Send us a Message</h2>
|
||||
<h2 className="text-h3">Enquiry Form</h2>
|
||||
</div>
|
||||
<p className="text-body text-muted">
|
||||
Fill out the form below and we'll get back to you within 24 hours.
|
||||
@@ -290,184 +282,99 @@ export function Contact({ topic }: ContactProps) {
|
||||
{/* Form Content */}
|
||||
<div className="p-8">
|
||||
<form onSubmit={handleSubmit} className="space-y-6">
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-6">
|
||||
<div>
|
||||
<label className="text-body font-medium mb-3 block" style={{ color: 'var(--color-black)' }}>
|
||||
First Name *
|
||||
</label>
|
||||
<Input
|
||||
type="text"
|
||||
required
|
||||
value={formData.firstName}
|
||||
onChange={(e) => handleInputChange('firstName', e.target.value)}
|
||||
placeholder="John"
|
||||
className="w-full h-12 border-gray-200 focus:border-blue-500 focus:ring-blue-500"
|
||||
style={{
|
||||
fontFamily: 'var(--font-family-base)',
|
||||
fontSize: 'var(--font-body)'
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<label className="text-body font-medium mb-3 block" style={{ color: 'var(--color-black)' }}>
|
||||
Last Name *
|
||||
</label>
|
||||
<Input
|
||||
type="text"
|
||||
required
|
||||
value={formData.lastName}
|
||||
onChange={(e) => handleInputChange('lastName', e.target.value)}
|
||||
placeholder="Doe"
|
||||
className="w-full h-12 border-gray-200 focus:border-blue-500 focus:ring-blue-500"
|
||||
style={{
|
||||
fontFamily: 'var(--font-family-base)',
|
||||
fontSize: 'var(--font-body)'
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-6">
|
||||
<div>
|
||||
<label className="text-body font-medium mb-3 block" style={{ color: 'var(--color-black)' }}>
|
||||
Email Address *
|
||||
</label>
|
||||
<Input
|
||||
type="email"
|
||||
required
|
||||
value={formData.email}
|
||||
onChange={(e) => handleInputChange('email', e.target.value)}
|
||||
placeholder="john.doe@company.com"
|
||||
className="w-full h-12 border-gray-200 focus:border-blue-500 focus:ring-blue-500"
|
||||
style={{
|
||||
fontFamily: 'var(--font-family-base)',
|
||||
fontSize: 'var(--font-body)'
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<label className="text-body font-medium mb-3 block" style={{ color: 'var(--color-black)' }}>
|
||||
Phone Number
|
||||
</label>
|
||||
<Input
|
||||
type="tel"
|
||||
value={formData.phone}
|
||||
onChange={(e) => handleInputChange('phone', e.target.value)}
|
||||
placeholder="+91 98765 43210"
|
||||
className="w-full h-12 border-gray-200 focus:border-blue-500 focus:ring-blue-500"
|
||||
style={{
|
||||
fontFamily: 'var(--font-family-base)',
|
||||
fontSize: 'var(--font-body)'
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-6">
|
||||
<div>
|
||||
<label className="text-body font-medium mb-3 block" style={{ color: 'var(--color-black)' }}>
|
||||
Company/Organization
|
||||
</label>
|
||||
<Input
|
||||
type="text"
|
||||
value={formData.company}
|
||||
onChange={(e) => handleInputChange('company', e.target.value)}
|
||||
placeholder="Company Name"
|
||||
className="w-full h-12 border-gray-200 focus:border-blue-500 focus:ring-blue-500"
|
||||
style={{
|
||||
fontFamily: 'var(--font-family-base)',
|
||||
fontSize: 'var(--font-body)'
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<label className="text-body font-medium mb-3 block" style={{ color: 'var(--color-black)' }}>
|
||||
Job Title
|
||||
</label>
|
||||
<Input
|
||||
type="text"
|
||||
value={formData.jobTitle}
|
||||
onChange={(e) => handleInputChange('jobTitle', e.target.value)}
|
||||
placeholder="CEO, HR Director, etc."
|
||||
className="w-full h-12 border-gray-200 focus:border-blue-500 focus:ring-blue-500"
|
||||
style={{
|
||||
fontFamily: 'var(--font-family-base)',
|
||||
fontSize: 'var(--font-body)'
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-6">
|
||||
<div>
|
||||
<label className="text-body font-medium mb-3 block" style={{ color: 'var(--color-black)' }}>
|
||||
Subject/Interest Area *
|
||||
</label>
|
||||
<Select
|
||||
value={formData.subject}
|
||||
onValueChange={(value) => handleInputChange('subject', value)}
|
||||
>
|
||||
<SelectTrigger
|
||||
className="w-full h-12 border-gray-200 focus:border-blue-500 focus:ring-blue-500"
|
||||
style={{
|
||||
fontFamily: 'var(--font-family-base)',
|
||||
fontSize: 'var(--font-body)'
|
||||
}}
|
||||
>
|
||||
<SelectValue placeholder="Select a subject" />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
<SelectItem value="Leadership Pipeline Development">Leadership Pipeline Development</SelectItem>
|
||||
<SelectItem value="Executive Coaching">Executive Coaching</SelectItem>
|
||||
<SelectItem value="Management Development">Management Development</SelectItem>
|
||||
<SelectItem value="Culture Competence">Culture Competence</SelectItem>
|
||||
<SelectItem value="Consulting Services">Consulting Services</SelectItem>
|
||||
<SelectItem value="Learning Facility">Learning Facility Tour</SelectItem>
|
||||
<SelectItem value="Online Courses">Online Learning Programs</SelectItem>
|
||||
<SelectItem value="General Inquiry">General Inquiry</SelectItem>
|
||||
</SelectContent>
|
||||
</Select>
|
||||
</div>
|
||||
<div>
|
||||
<label className="text-body font-medium mb-3 block" style={{ color: 'var(--color-black)' }}>
|
||||
How did you hear about us?
|
||||
</label>
|
||||
<Select
|
||||
value={formData.source}
|
||||
onValueChange={(value) => handleInputChange('source', value)}
|
||||
>
|
||||
<SelectTrigger
|
||||
className="w-full h-12 border-gray-200 focus:border-blue-500 focus:ring-blue-500"
|
||||
style={{
|
||||
fontFamily: 'var(--font-family-base)',
|
||||
fontSize: 'var(--font-body)'
|
||||
}}
|
||||
>
|
||||
<SelectValue placeholder="Select an option" />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
<SelectItem value="Website">Website</SelectItem>
|
||||
<SelectItem value="Google Search">Google Search</SelectItem>
|
||||
<SelectItem value="Social Media">Social Media</SelectItem>
|
||||
<SelectItem value="Referral">Referral</SelectItem>
|
||||
<SelectItem value="Event/Conference">Event/Conference</SelectItem>
|
||||
<SelectItem value="LinkedIn">LinkedIn</SelectItem>
|
||||
<SelectItem value="Email Marketing">Email Marketing</SelectItem>
|
||||
<SelectItem value="Other">Other</SelectItem>
|
||||
</SelectContent>
|
||||
</Select>
|
||||
</div>
|
||||
<div>
|
||||
<label className="text-body font-medium mb-3 block" style={{ color: 'var(--color-black)' }}>
|
||||
Name *
|
||||
</label>
|
||||
<Input
|
||||
type="text"
|
||||
required
|
||||
value={formData.name}
|
||||
onChange={(e) => handleInputChange('name', e.target.value)}
|
||||
placeholder="Enter your full name"
|
||||
className="w-full h-12 border-gray-200 focus:border-blue-500 focus:ring-blue-500"
|
||||
style={{
|
||||
fontFamily: 'var(--font-family-base)',
|
||||
fontSize: 'var(--font-body)'
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="text-body font-medium mb-3 block" style={{ color: 'var(--color-black)' }}>
|
||||
Message *
|
||||
Mobile Number *
|
||||
</label>
|
||||
<Input
|
||||
type="tel"
|
||||
required
|
||||
value={formData.mobileNumber}
|
||||
onChange={(e) => handleInputChange('mobileNumber', e.target.value)}
|
||||
placeholder="+91 98765 43210"
|
||||
className="w-full h-12 border-gray-200 focus:border-blue-500 focus:ring-blue-500"
|
||||
style={{
|
||||
fontFamily: 'var(--font-family-base)',
|
||||
fontSize: 'var(--font-body)'
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="text-body font-medium mb-3 block" style={{ color: 'var(--color-black)' }}>
|
||||
Email Id *
|
||||
</label>
|
||||
<Input
|
||||
type="email"
|
||||
required
|
||||
value={formData.emailId}
|
||||
onChange={(e) => handleInputChange('emailId', e.target.value)}
|
||||
placeholder="example@company.com"
|
||||
className="w-full h-12 border-gray-200 focus:border-blue-500 focus:ring-blue-500"
|
||||
style={{
|
||||
fontFamily: 'var(--font-family-base)',
|
||||
fontSize: 'var(--font-body)'
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="text-body font-medium mb-3 block" style={{ color: 'var(--color-black)' }}>
|
||||
Interested In *
|
||||
</label>
|
||||
<Select
|
||||
value={formData.interestedIn}
|
||||
onValueChange={(value: string) => handleInputChange('interestedIn', value)}
|
||||
>
|
||||
<SelectTrigger
|
||||
className="w-full h-12 border-gray-200 focus:border-blue-500 focus:ring-blue-500"
|
||||
style={{
|
||||
fontFamily: 'var(--font-family-base)',
|
||||
fontSize: 'var(--font-body)'
|
||||
}}
|
||||
>
|
||||
<SelectValue placeholder="Select your area of interest" />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
<SelectItem value="Leadership Development">Leadership Development</SelectItem>
|
||||
<SelectItem value="Executive Coaching">Executive Coaching</SelectItem>
|
||||
<SelectItem value="Management Development">Management Development</SelectItem>
|
||||
<SelectItem value="Culture Competence">Culture Competence</SelectItem>
|
||||
<SelectItem value="Consulting Services">Consulting Services</SelectItem>
|
||||
<SelectItem value="Learning Facility">Learning Facility</SelectItem>
|
||||
<SelectItem value="Online Courses">Online Courses</SelectItem>
|
||||
<SelectItem value="General Inquiry">General Inquiry</SelectItem>
|
||||
</SelectContent>
|
||||
</Select>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="text-body font-medium mb-3 block" style={{ color: 'var(--color-black)' }}>
|
||||
Enter Message *
|
||||
</label>
|
||||
<Textarea
|
||||
required
|
||||
value={formData.message}
|
||||
onChange={(e) => handleInputChange('message', e.target.value)}
|
||||
placeholder="Tell us about your leadership development needs, goals, or any specific questions you have..."
|
||||
placeholder="Please enter your message or inquiry..."
|
||||
rows={6}
|
||||
className="w-full border-gray-200 focus:border-blue-500 focus:ring-blue-500 resize-none"
|
||||
style={{
|
||||
@@ -486,7 +393,6 @@ export function Contact({ topic }: ContactProps) {
|
||||
text={isSubmitting ? "Sending Message..." : "Send Message"}
|
||||
onClick={() => {}}
|
||||
ariaLabel="Send contact message"
|
||||
disabled={isSubmitting}
|
||||
className="w-full sm:w-auto"
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -60,7 +60,7 @@ export function FooterNew() {
|
||||
Webcast
|
||||
</button>
|
||||
<button
|
||||
onClick={() => navigateTo('/about')}
|
||||
onClick={() => navigateTo('/about-us')}
|
||||
className="block text-small-white transition-all duration-300 text-left"
|
||||
style={{
|
||||
color: 'white',
|
||||
@@ -108,7 +108,7 @@ export function FooterNew() {
|
||||
FAQs
|
||||
</button>
|
||||
<button
|
||||
onClick={() => navigateTo('/services/learning-facility')}
|
||||
onClick={() => navigateTo('/learning-facility')}
|
||||
className="block text-small-white transition-all duration-300 text-left"
|
||||
style={{
|
||||
color: 'white',
|
||||
@@ -243,14 +243,14 @@ export function FooterNew() {
|
||||
{/* Legal Links */}
|
||||
<div className="flex flex-col lg:flex-row lg:items-center space-y-2 lg:space-y-0 lg:space-x-8">
|
||||
<button
|
||||
onClick={() => navigateTo('/privacy')}
|
||||
className="text-body-white transition-colors duration-300 hover:text-yellow-300 text-left"
|
||||
onClick={() => navigateTo('/privacy-policy')}
|
||||
className="text-body-white transition-colors duration-300 hover:text-yellow-300 text-left cursor-pointer"
|
||||
style={{ color: 'rgba(255, 255, 255, 0.85)' }}
|
||||
>
|
||||
Privacy and Cookie Policy
|
||||
</button>
|
||||
<button
|
||||
onClick={() => navigateTo('/terms')}
|
||||
onClick={() => navigateTo('/term-condition')}
|
||||
className="text-body-white transition-colors duration-300 cursor-pointer text-left hover:text-yellow-300"
|
||||
style={{ color: 'rgba(255, 255, 255, 0.85)' }}
|
||||
>
|
||||
|
||||
@@ -1127,7 +1127,7 @@ export function LearningFacilityNew() {
|
||||
|
||||
{/* Amenities Section */}
|
||||
<section className="py-20" style={{ backgroundColor: 'rgba(0, 0, 0, 0.03)' }}>
|
||||
<div className="container mx-auto section-margin-x">
|
||||
<div className="mx-auto section-margin-x">
|
||||
<div className="text-center mb-16 max-w-4xl mx-auto">
|
||||
<h2 className="text-h2 mb-6">
|
||||
World-Class <span className="text-primary">Amenities</span>
|
||||
@@ -1138,7 +1138,9 @@ export function LearningFacilityNew() {
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="relative overflow-hidden w-screen" aria-label="Amenities ticker" style={{ marginLeft: 'calc(50% - 50vw)', marginRight: 'calc(50% - 50vw)' }}>
|
||||
</div>
|
||||
<div className="relative w-full">
|
||||
<div className="relative overflow-hidden">
|
||||
<div className="flex items-stretch gap-4 whitespace-nowrap scroll-left" style={{ animationDuration: '35s' }}>
|
||||
{[0, 1].map((loop) => (
|
||||
<div key={`amenities-loop-${loop}`} className="flex items-stretch gap-4">
|
||||
|
||||
@@ -32,7 +32,8 @@ import {
|
||||
Grid,
|
||||
List,
|
||||
X,
|
||||
DollarSign
|
||||
DollarSign,
|
||||
ShoppingCart
|
||||
} from 'lucide-react';
|
||||
import { motion } from 'motion/react';
|
||||
import { navigateTo } from './Router';
|
||||
@@ -633,12 +634,12 @@ export function LearningOnline() {
|
||||
<>
|
||||
{/* Grid View */}
|
||||
{viewMode === 'grid' && (
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-3 gap-6">
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-2 gap-6">
|
||||
{currentCourses.map((course) => (
|
||||
<div key={course.id} className="w-full">
|
||||
<CourseCard
|
||||
course={course}
|
||||
className="h-[560px] flex flex-col w-full"
|
||||
className="h-[600px] flex flex-col w-full"
|
||||
onAddToCart={handleAddToCart}
|
||||
/>
|
||||
</div>
|
||||
@@ -788,7 +789,7 @@ export function LearningOnline() {
|
||||
)}
|
||||
</div>
|
||||
<Button
|
||||
onClick={(e) => {
|
||||
onClick={(e: React.MouseEvent) => {
|
||||
e.stopPropagation();
|
||||
const cartItem: CartItem = {
|
||||
id: course.id,
|
||||
|
||||
@@ -537,7 +537,7 @@ export function Navigation({ currentPage }: NavigationProps) {
|
||||
) : (
|
||||
<div className="hidden md:flex items-center">
|
||||
<Button
|
||||
onClick={() => navigate('/leadership-journey')}
|
||||
onClick={() => navigate('/self-learner-signup')}
|
||||
className="management-dev-glassmorphic-btn text-body px-8 py-4 min-h-[52px] border transition-all duration-300 group"
|
||||
style={{
|
||||
fontFamily: 'var(--font-family-base)',
|
||||
|
||||
14
src/components/ScrollToTop.tsx
Normal file
14
src/components/ScrollToTop.tsx
Normal file
@@ -0,0 +1,14 @@
|
||||
import { useEffect } from "react";
|
||||
import { useLocation } from "react-router-dom";
|
||||
|
||||
const ScrollToTop = () => {
|
||||
const { pathname } = useLocation();
|
||||
|
||||
useEffect(() => {
|
||||
window.scrollTo(0, 0);
|
||||
}, [pathname]);
|
||||
|
||||
return null;
|
||||
};
|
||||
|
||||
export default ScrollToTop;
|
||||
@@ -520,14 +520,14 @@ export function SelfLearnerSignIn() {
|
||||
Looking for corporate access?{' '}
|
||||
</span>
|
||||
<button
|
||||
onClick={() => navigateTo('/corporate-login')}
|
||||
onClick={() => navigateTo('/contact')}
|
||||
className="text-blue-600 hover:text-blue-700 transition-colors font-medium"
|
||||
style={{
|
||||
fontSize: 'var(--font-small)',
|
||||
fontFamily: 'var(--font-family-base)'
|
||||
}}
|
||||
>
|
||||
Corporate Sign In
|
||||
Contact Us
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -394,11 +394,15 @@ export function SelfLearnerSignUp() {
|
||||
}}
|
||||
>
|
||||
I agree to the{' '}
|
||||
<span className="text-blue-600 hover:text-blue-700 cursor-pointer">
|
||||
<span className="text-blue-600 hover:text-blue-700 cursor-pointer"
|
||||
onClick={() => navigateTo('/term-condition')}
|
||||
>
|
||||
Terms of Service
|
||||
</span>{' '}
|
||||
and{' '}
|
||||
<span className="text-blue-600 hover:text-blue-700 cursor-pointer">
|
||||
<span className="text-blue-600 hover:text-blue-700 cursor-pointer"
|
||||
onClick={() => navigateTo('/privacy-policy')}
|
||||
>
|
||||
Privacy Policy
|
||||
</span>
|
||||
</Label>
|
||||
|
||||
@@ -14,7 +14,6 @@ import { BrandedTag } from '../about/BrandedTag';
|
||||
import { PrimaryCTAButton } from '../PrimaryCTAButton';
|
||||
import { TestimonialsSection } from '../TestimonialsSection';
|
||||
import { CTABannerSection } from '../CTABannerSection';
|
||||
import Slider from "react-slick";
|
||||
// import ImageWithFallback from "./ImageWithFallback"; // your custom component
|
||||
|
||||
import {
|
||||
|
||||
Reference in New Issue
Block a user