586 lines
22 KiB
TypeScript
586 lines
22 KiB
TypeScript
|
import React, { useState } from 'react';
|
||
|
|
import { Button } from './ui/button';
|
||
|
|
import { Input } from './ui/input';
|
||
|
|
import { Label } from './ui/label';
|
||
|
|
import { Card, CardContent } from './ui/card';
|
||
|
|
import { Checkbox } from './ui/checkbox';
|
||
|
|
import {
|
||
|
|
BookOpen,
|
||
|
|
Users,
|
||
|
|
Target,
|
||
|
|
Award,
|
||
|
|
ArrowRight,
|
||
|
|
Eye,
|
||
|
|
EyeOff,
|
||
|
|
User
|
||
|
|
} from 'lucide-react';
|
||
|
|
import { navigateTo } from './Router';
|
||
|
|
|
||
|
|
export function SelfLearnerSignIn() {
|
||
|
|
const [email, setEmail] = useState('');
|
||
|
|
const [password, setPassword] = useState('');
|
||
|
|
const [showPassword, setShowPassword] = useState(false);
|
||
|
|
const [rememberMe, setRememberMe] = useState(false);
|
||
|
|
const [isLoading, setIsLoading] = useState(false);
|
||
|
|
|
||
|
|
const handleSignIn = async (e: React.FormEvent) => {
|
||
|
|
e.preventDefault();
|
||
|
|
setIsLoading(true);
|
||
|
|
|
||
|
|
// Simulate authentication
|
||
|
|
setTimeout(() => {
|
||
|
|
setIsLoading(false);
|
||
|
|
// Navigate to dashboard or success page
|
||
|
|
navigateTo('/dashboard');
|
||
|
|
}, 1500);
|
||
|
|
};
|
||
|
|
|
||
|
|
const transformationFeatures = [
|
||
|
|
{
|
||
|
|
icon: BookOpen,
|
||
|
|
title: 'World-Class Content',
|
||
|
|
description: 'Access premium leadership courses from industry experts'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
icon: Users,
|
||
|
|
title: 'Global Community',
|
||
|
|
description: 'Join 25,000+ leaders from top organizations worldwide'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
icon: Award,
|
||
|
|
title: 'Recognized Credentials',
|
||
|
|
description: 'Earn certificates valued by Fortune 500 companies'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
icon: Target,
|
||
|
|
title: 'Personalized Path',
|
||
|
|
description: 'Get customized learning recommendations based on your goals'
|
||
|
|
}
|
||
|
|
];
|
||
|
|
|
||
|
|
const learningFeatures = [
|
||
|
|
{
|
||
|
|
icon: BookOpen,
|
||
|
|
title: 'Expert-Led Programs',
|
||
|
|
description: 'Learn from industry leaders and world-class faculty'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
icon: Users,
|
||
|
|
title: 'Peer Learning Network',
|
||
|
|
description: 'Connect with like-minded professionals and expand your network'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
icon: Target,
|
||
|
|
title: 'Personalized Growth',
|
||
|
|
description: 'Tailored learning paths to accelerate your leadership journey'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
icon: Award,
|
||
|
|
title: 'Recognized Certification',
|
||
|
|
description: 'Industry-recognized credentials to advance your career'
|
||
|
|
}
|
||
|
|
];
|
||
|
|
|
||
|
|
return (
|
||
|
|
<div style={{ backgroundColor: '#FFFFFF' }}>
|
||
|
|
{/* Main Content */}
|
||
|
|
<div className="section-margin-x py-16">
|
||
|
|
<div className="max-w-6xl mx-auto">
|
||
|
|
|
||
|
|
{/* Header Section */}
|
||
|
|
<div className="text-center mb-12">
|
||
|
|
<div className="mb-6">
|
||
|
|
<span
|
||
|
|
className="inline-flex items-center gap-2 px-4 py-2 rounded-full text-sm font-medium"
|
||
|
|
style={{
|
||
|
|
backgroundColor: 'rgba(248, 195, 1, 0.15)',
|
||
|
|
color: 'var(--color-black)',
|
||
|
|
fontFamily: 'var(--font-family-base)'
|
||
|
|
}}
|
||
|
|
>
|
||
|
|
<User className="w-4 h-4" />
|
||
|
|
Individual Learning
|
||
|
|
</span>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<h1
|
||
|
|
className="mb-6"
|
||
|
|
style={{
|
||
|
|
fontSize: 'var(--font-h2)',
|
||
|
|
fontWeight: 'var(--font-weight-h2)',
|
||
|
|
lineHeight: 'var(--line-height-h2)',
|
||
|
|
color: 'var(--color-black)',
|
||
|
|
fontFamily: 'var(--font-family-base)'
|
||
|
|
}}
|
||
|
|
>
|
||
|
|
Welcome Back to Your Leadership Journey
|
||
|
|
</h1>
|
||
|
|
|
||
|
|
<p
|
||
|
|
className="mb-12 max-w-2xl mx-auto"
|
||
|
|
style={{
|
||
|
|
fontSize: 'var(--font-body-lg)',
|
||
|
|
color: 'var(--color-gray-muted)',
|
||
|
|
fontFamily: 'var(--font-family-base)',
|
||
|
|
lineHeight: 'var(--line-height-body-lg)'
|
||
|
|
}}
|
||
|
|
>
|
||
|
|
Continue your transformation with KLC's world-class leadership development
|
||
|
|
programs. Access your personalized learning dashboard and connect with a global
|
||
|
|
community of leaders.
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
{/* Two Column Layout */}
|
||
|
|
<div className="grid grid-cols-1 lg:grid-cols-2 gap-16 items-start">
|
||
|
|
|
||
|
|
{/* Left Column - Content */}
|
||
|
|
<div>
|
||
|
|
{/* Leadership Transformation Section */}
|
||
|
|
<div className="mb-12">
|
||
|
|
<div className="mb-6">
|
||
|
|
<span
|
||
|
|
className="inline-flex items-center gap-2 px-4 py-2 rounded-full text-sm font-medium"
|
||
|
|
style={{
|
||
|
|
backgroundColor: 'rgba(248, 195, 1, 0.15)',
|
||
|
|
color: 'var(--color-black)',
|
||
|
|
fontFamily: 'var(--font-family-base)'
|
||
|
|
}}
|
||
|
|
>
|
||
|
|
⭐ Join KLC Community
|
||
|
|
</span>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<h2
|
||
|
|
className="mb-4"
|
||
|
|
style={{
|
||
|
|
fontSize: 'var(--font-h3)',
|
||
|
|
fontWeight: 'var(--font-weight-h3)',
|
||
|
|
color: 'var(--color-black)',
|
||
|
|
fontFamily: 'var(--font-family-base)'
|
||
|
|
}}
|
||
|
|
>
|
||
|
|
Start Your Leadership Transformation
|
||
|
|
</h2>
|
||
|
|
|
||
|
|
<p
|
||
|
|
className="mb-8"
|
||
|
|
style={{
|
||
|
|
fontSize: 'var(--font-body)',
|
||
|
|
color: 'var(--color-gray-muted)',
|
||
|
|
fontFamily: 'var(--font-family-base)',
|
||
|
|
lineHeight: 'var(--line-height-body)'
|
||
|
|
}}
|
||
|
|
>
|
||
|
|
Join thousands of professionals who have accelerated their careers through KLC's
|
||
|
|
proven leadership development programs. Your journey to becoming an exceptional leader starts here.
|
||
|
|
</p>
|
||
|
|
|
||
|
|
<div className="grid grid-cols-1 md:grid-cols-2 gap-6">
|
||
|
|
{transformationFeatures.map((feature, index) => (
|
||
|
|
<div key={index} className="flex items-start gap-3">
|
||
|
|
<div
|
||
|
|
className="w-8 h-8 rounded-lg flex items-center justify-center flex-shrink-0"
|
||
|
|
style={{ backgroundColor: 'var(--color-primary)' }}
|
||
|
|
>
|
||
|
|
<feature.icon className="w-4 h-4 text-white" />
|
||
|
|
</div>
|
||
|
|
<div className="flex-1">
|
||
|
|
<h3
|
||
|
|
className="font-medium mb-1"
|
||
|
|
style={{
|
||
|
|
fontSize: 'var(--font-small)',
|
||
|
|
color: 'var(--color-black)',
|
||
|
|
fontFamily: 'var(--font-family-base)'
|
||
|
|
}}
|
||
|
|
>
|
||
|
|
{feature.title}
|
||
|
|
</h3>
|
||
|
|
<p
|
||
|
|
style={{
|
||
|
|
fontSize: '0.75rem',
|
||
|
|
color: 'var(--color-gray-muted)',
|
||
|
|
fontFamily: 'var(--font-family-base)',
|
||
|
|
lineHeight: '1.3'
|
||
|
|
}}
|
||
|
|
>
|
||
|
|
{feature.description}
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
))}
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
{/* Your Learning Experience */}
|
||
|
|
<div>
|
||
|
|
<h2
|
||
|
|
className="mb-8"
|
||
|
|
style={{
|
||
|
|
fontSize: 'var(--font-h4)',
|
||
|
|
fontWeight: 'var(--font-weight-h4)',
|
||
|
|
color: 'var(--color-black)',
|
||
|
|
fontFamily: 'var(--font-family-base)'
|
||
|
|
}}
|
||
|
|
>
|
||
|
|
Your Learning Experience
|
||
|
|
</h2>
|
||
|
|
|
||
|
|
<div className="space-y-6">
|
||
|
|
{learningFeatures.map((feature, index) => (
|
||
|
|
<div key={index} className="flex items-start gap-4">
|
||
|
|
<div
|
||
|
|
className="w-12 h-12 rounded-lg flex items-center justify-center flex-shrink-0"
|
||
|
|
style={{ backgroundColor: 'var(--color-primary)' }}
|
||
|
|
>
|
||
|
|
<feature.icon className="w-6 h-6 text-white" />
|
||
|
|
</div>
|
||
|
|
<div className="flex-1">
|
||
|
|
<h3
|
||
|
|
className="font-medium mb-2"
|
||
|
|
style={{
|
||
|
|
fontSize: 'var(--font-body)',
|
||
|
|
color: 'var(--color-black)',
|
||
|
|
fontFamily: 'var(--font-family-base)'
|
||
|
|
}}
|
||
|
|
>
|
||
|
|
{feature.title}
|
||
|
|
</h3>
|
||
|
|
<p
|
||
|
|
style={{
|
||
|
|
fontSize: 'var(--font-small)',
|
||
|
|
color: 'var(--color-gray-muted)',
|
||
|
|
fontFamily: 'var(--font-family-base)',
|
||
|
|
lineHeight: 'var(--line-height-small)'
|
||
|
|
}}
|
||
|
|
>
|
||
|
|
{feature.description}
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
))}
|
||
|
|
</div>
|
||
|
|
|
||
|
|
{/* Existing Account Note */}
|
||
|
|
<div
|
||
|
|
className="mt-8 p-4 rounded-lg border"
|
||
|
|
style={{ backgroundColor: 'rgba(0, 0, 0, 0.02)' }}
|
||
|
|
>
|
||
|
|
<p
|
||
|
|
className="mb-2"
|
||
|
|
style={{
|
||
|
|
fontSize: 'var(--font-small)',
|
||
|
|
fontWeight: '500',
|
||
|
|
color: 'var(--color-black)',
|
||
|
|
fontFamily: 'var(--font-family-base)'
|
||
|
|
}}
|
||
|
|
>
|
||
|
|
Already have an account?
|
||
|
|
</p>
|
||
|
|
<div className="space-y-2">
|
||
|
|
<button
|
||
|
|
onClick={() => navigateTo('/self-learner-signin')}
|
||
|
|
className="block text-blue-600 hover:text-blue-700 transition-colors"
|
||
|
|
style={{
|
||
|
|
fontSize: 'var(--font-small)',
|
||
|
|
fontFamily: 'var(--font-family-base)'
|
||
|
|
}}
|
||
|
|
>
|
||
|
|
Sign in to your account
|
||
|
|
</button>
|
||
|
|
<button
|
||
|
|
onClick={() => navigateTo('/corporate-login')}
|
||
|
|
className="block text-blue-600 hover:text-blue-700 transition-colors"
|
||
|
|
style={{
|
||
|
|
fontSize: 'var(--font-small)',
|
||
|
|
fontFamily: 'var(--font-family-base)'
|
||
|
|
}}
|
||
|
|
>
|
||
|
|
Corporate sign in
|
||
|
|
</button>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
{/* Right Column - Sign In Form */}
|
||
|
|
<div>
|
||
|
|
<Card className="shadow-lg border-0">
|
||
|
|
<CardContent className="p-8">
|
||
|
|
|
||
|
|
{/* Form Header */}
|
||
|
|
<div className="text-center mb-8">
|
||
|
|
<h2
|
||
|
|
className="mb-2"
|
||
|
|
style={{
|
||
|
|
fontSize: 'var(--font-h4)',
|
||
|
|
fontWeight: 'var(--font-weight-h4)',
|
||
|
|
color: 'var(--color-black)',
|
||
|
|
fontFamily: 'var(--font-family-base)'
|
||
|
|
}}
|
||
|
|
>
|
||
|
|
Welcome Back
|
||
|
|
</h2>
|
||
|
|
<p
|
||
|
|
style={{
|
||
|
|
fontSize: 'var(--font-small)',
|
||
|
|
color: 'var(--color-gray-muted)',
|
||
|
|
fontFamily: 'var(--font-family-base)'
|
||
|
|
}}
|
||
|
|
>
|
||
|
|
Sign in to your KLC account
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
{/* Sign In Form */}
|
||
|
|
<form onSubmit={handleSignIn} className="space-y-6">
|
||
|
|
|
||
|
|
{/* Email Field */}
|
||
|
|
<div>
|
||
|
|
<Label
|
||
|
|
htmlFor="email"
|
||
|
|
style={{
|
||
|
|
fontSize: 'var(--font-body)',
|
||
|
|
fontWeight: '500',
|
||
|
|
color: 'var(--color-black)',
|
||
|
|
fontFamily: 'var(--font-family-base)'
|
||
|
|
}}
|
||
|
|
>
|
||
|
|
Email Address *
|
||
|
|
</Label>
|
||
|
|
<Input
|
||
|
|
id="email"
|
||
|
|
type="email"
|
||
|
|
value={email}
|
||
|
|
onChange={(e) => setEmail(e.target.value)}
|
||
|
|
placeholder="you@example.com"
|
||
|
|
required
|
||
|
|
className="mt-2 h-12"
|
||
|
|
style={{
|
||
|
|
fontSize: 'var(--font-body)',
|
||
|
|
fontFamily: 'var(--font-family-base)'
|
||
|
|
}}
|
||
|
|
/>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
{/* Password Field */}
|
||
|
|
<div>
|
||
|
|
<Label
|
||
|
|
htmlFor="password"
|
||
|
|
style={{
|
||
|
|
fontSize: 'var(--font-body)',
|
||
|
|
fontWeight: '500',
|
||
|
|
color: 'var(--color-black)',
|
||
|
|
fontFamily: 'var(--font-family-base)'
|
||
|
|
}}
|
||
|
|
>
|
||
|
|
Password *
|
||
|
|
</Label>
|
||
|
|
<div className="relative mt-2">
|
||
|
|
<Input
|
||
|
|
id="password"
|
||
|
|
type={showPassword ? 'text' : 'password'}
|
||
|
|
value={password}
|
||
|
|
onChange={(e) => setPassword(e.target.value)}
|
||
|
|
placeholder="Enter your password"
|
||
|
|
required
|
||
|
|
className="h-12 pr-12"
|
||
|
|
style={{
|
||
|
|
fontSize: 'var(--font-body)',
|
||
|
|
fontFamily: 'var(--font-family-base)'
|
||
|
|
}}
|
||
|
|
/>
|
||
|
|
<button
|
||
|
|
type="button"
|
||
|
|
onClick={() => setShowPassword(!showPassword)}
|
||
|
|
className="absolute right-3 top-1/2 transform -translate-y-1/2 text-gray-500 hover:text-gray-700"
|
||
|
|
>
|
||
|
|
{showPassword ? <EyeOff className="w-5 h-5" /> : <Eye className="w-5 h-5" />}
|
||
|
|
</button>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
{/* Remember Me & Forgot Password */}
|
||
|
|
<div className="flex items-center justify-between">
|
||
|
|
<div className="flex items-center space-x-2">
|
||
|
|
<Checkbox
|
||
|
|
id="remember"
|
||
|
|
checked={rememberMe}
|
||
|
|
onCheckedChange={setRememberMe}
|
||
|
|
/>
|
||
|
|
<Label
|
||
|
|
htmlFor="remember"
|
||
|
|
style={{
|
||
|
|
fontSize: 'var(--font-small)',
|
||
|
|
color: 'var(--color-black)',
|
||
|
|
fontFamily: 'var(--font-family-base)'
|
||
|
|
}}
|
||
|
|
>
|
||
|
|
Remember me
|
||
|
|
</Label>
|
||
|
|
</div>
|
||
|
|
<button
|
||
|
|
type="button"
|
||
|
|
onClick={() => navigateTo('/forgot-password')}
|
||
|
|
className="text-blue-600 hover:text-blue-700 transition-colors"
|
||
|
|
style={{
|
||
|
|
fontSize: 'var(--font-small)',
|
||
|
|
fontFamily: 'var(--font-family-base)'
|
||
|
|
}}
|
||
|
|
>
|
||
|
|
Forgot password?
|
||
|
|
</button>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
{/* Sign In Button */}
|
||
|
|
<Button
|
||
|
|
type="submit"
|
||
|
|
disabled={isLoading}
|
||
|
|
className="w-full h-14 text-white font-medium flex items-center justify-center gap-2"
|
||
|
|
style={{
|
||
|
|
backgroundColor: 'var(--color-primary)',
|
||
|
|
fontSize: 'var(--font-body)',
|
||
|
|
fontFamily: 'var(--font-family-base)',
|
||
|
|
borderRadius: '10px'
|
||
|
|
}}
|
||
|
|
>
|
||
|
|
{isLoading ? (
|
||
|
|
<div className="w-5 h-5 border-2 border-white border-t-transparent rounded-full animate-spin" />
|
||
|
|
) : (
|
||
|
|
<>
|
||
|
|
Sign In
|
||
|
|
<ArrowRight className="w-5 h-5" />
|
||
|
|
</>
|
||
|
|
)}
|
||
|
|
</Button>
|
||
|
|
</form>
|
||
|
|
|
||
|
|
{/* Demo Credentials */}
|
||
|
|
<div
|
||
|
|
className="mt-8 p-4 rounded-lg border"
|
||
|
|
style={{ backgroundColor: 'rgba(0, 0, 0, 0.02)' }}
|
||
|
|
>
|
||
|
|
<h4
|
||
|
|
className="mb-2 flex items-center gap-2"
|
||
|
|
style={{
|
||
|
|
fontSize: 'var(--font-small)',
|
||
|
|
fontWeight: '500',
|
||
|
|
color: 'var(--color-black)',
|
||
|
|
fontFamily: 'var(--font-family-base)'
|
||
|
|
}}
|
||
|
|
>
|
||
|
|
<div className="w-4 h-4 rounded-full bg-gray-300 flex items-center justify-center">
|
||
|
|
<span className="text-xs text-gray-600">i</span>
|
||
|
|
</div>
|
||
|
|
Demo credentials:
|
||
|
|
</h4>
|
||
|
|
<div
|
||
|
|
style={{
|
||
|
|
fontSize: 'var(--font-small)',
|
||
|
|
color: 'var(--color-gray-muted)',
|
||
|
|
fontFamily: 'var(--font-family-base)',
|
||
|
|
lineHeight: 'var(--line-height-small)'
|
||
|
|
}}
|
||
|
|
>
|
||
|
|
Email: demo@klc.edu.in | Password: demo123
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
{/* Sign Up Links */}
|
||
|
|
<div className="text-center mt-8 space-y-3">
|
||
|
|
<div>
|
||
|
|
<span
|
||
|
|
className="text-gray-600"
|
||
|
|
style={{
|
||
|
|
fontSize: 'var(--font-small)',
|
||
|
|
fontFamily: 'var(--font-family-base)'
|
||
|
|
}}
|
||
|
|
>
|
||
|
|
Don't have an account?{' '}
|
||
|
|
</span>
|
||
|
|
<button
|
||
|
|
onClick={() => navigateTo('/self-learner-signup')}
|
||
|
|
className="text-blue-600 hover:text-blue-700 transition-colors font-medium"
|
||
|
|
style={{
|
||
|
|
fontSize: 'var(--font-small)',
|
||
|
|
fontFamily: 'var(--font-family-base)'
|
||
|
|
}}
|
||
|
|
>
|
||
|
|
Sign up here
|
||
|
|
</button>
|
||
|
|
</div>
|
||
|
|
<div>
|
||
|
|
<span
|
||
|
|
className="text-gray-600"
|
||
|
|
style={{
|
||
|
|
fontSize: 'var(--font-small)',
|
||
|
|
fontFamily: 'var(--font-family-base)'
|
||
|
|
}}
|
||
|
|
>
|
||
|
|
Looking for corporate access?{' '}
|
||
|
|
</span>
|
||
|
|
<button
|
||
|
|
onClick={() => navigateTo('/corporate-login')}
|
||
|
|
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
|
||
|
|
</button>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</CardContent>
|
||
|
|
</Card>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
{/* Need Help Section - Separate Section Below */}
|
||
|
|
<div
|
||
|
|
className="section-margin-x py-12"
|
||
|
|
style={{ backgroundColor: 'rgba(0, 0, 0, 0.02)' }}
|
||
|
|
>
|
||
|
|
<div className="max-w-4xl mx-auto text-center">
|
||
|
|
<h3
|
||
|
|
className="mb-4"
|
||
|
|
style={{
|
||
|
|
fontSize: 'var(--font-h4)',
|
||
|
|
fontWeight: 'var(--font-weight-h4)',
|
||
|
|
color: 'var(--color-black)',
|
||
|
|
fontFamily: 'var(--font-family-base)'
|
||
|
|
}}
|
||
|
|
>
|
||
|
|
Need Help Getting Started?
|
||
|
|
</h3>
|
||
|
|
<p
|
||
|
|
className="mb-6"
|
||
|
|
style={{
|
||
|
|
fontSize: 'var(--font-body)',
|
||
|
|
color: 'var(--color-gray-muted)',
|
||
|
|
fontFamily: 'var(--font-family-base)',
|
||
|
|
lineHeight: 'var(--line-height-body)'
|
||
|
|
}}
|
||
|
|
>
|
||
|
|
Our learning advisors are here to help you choose the right programs and get the most out of your leadership development experience.
|
||
|
|
</p>
|
||
|
|
<Button
|
||
|
|
variant="outline"
|
||
|
|
className="border-2 border-blue-600 text-blue-600 hover:bg-blue-600 hover:text-white"
|
||
|
|
style={{
|
||
|
|
fontSize: 'var(--font-body)',
|
||
|
|
fontFamily: 'var(--font-family-base)',
|
||
|
|
fontWeight: '500',
|
||
|
|
padding: '0.75rem 2rem',
|
||
|
|
borderRadius: '10px'
|
||
|
|
}}
|
||
|
|
>
|
||
|
|
Speak with Learning Advisor
|
||
|
|
</Button>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
}
|