213 lines
10 KiB
TypeScript
213 lines
10 KiB
TypeScript
"use client";
|
||
|
||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||
import ReactLenis from "lenis/react";
|
||
import ContactCTA from '@/components/sections/contact/ContactCTA';
|
||
import FeatureCardEight from '@/components/sections/feature/FeatureCardEight';
|
||
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
|
||
import HeroBillboard from '@/components/sections/hero/HeroBillboard';
|
||
import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
|
||
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
|
||
import ProductCardOne from '@/components/sections/product/ProductCardOne';
|
||
import TextAbout from '@/components/sections/about/TextAbout';
|
||
|
||
export default function LandingPage() {
|
||
return (
|
||
<ThemeProvider
|
||
defaultButtonVariant="directional-hover"
|
||
defaultTextAnimation="reveal-blur"
|
||
borderRadius="rounded"
|
||
contentWidth="medium"
|
||
sizing="largeSizeMediumTitles"
|
||
background="circleGradient"
|
||
cardStyle="glass-elevated"
|
||
primaryButtonStyle="radial-glow"
|
||
secondaryButtonStyle="glass"
|
||
headingFontWeight="extrabold"
|
||
>
|
||
<ReactLenis root>
|
||
<div id="nav" data-section="nav">
|
||
<NavbarLayoutFloatingOverlay
|
||
navItems={[
|
||
{
|
||
name: "About", id: "#about"},
|
||
{
|
||
name: "Experience", id: "#experience"},
|
||
{
|
||
name: "Projects", id: "#projects"},
|
||
{
|
||
name: "Contact", id: "#contact"},
|
||
]}
|
||
brandName="Kajana Pakirathan"
|
||
/>
|
||
</div>
|
||
|
||
<div id="hero" data-section="hero">
|
||
<HeroBillboard
|
||
background={{
|
||
variant: "gradient-bars"}}
|
||
title="Kajana Pakirathan"
|
||
description="Computer Science student and aspiring IT Professional. Experienced in insurance IT support, customer service, and full-stack web development."
|
||
buttons={[
|
||
{
|
||
text: "View Projects", href: "#projects"},
|
||
{
|
||
text: "Contact Me", href: "#contact"},
|
||
]}
|
||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DaH1SYHce2lBKqLdIyk6kjsOeA/uploaded-1778513062007-765ftdjt.png?_wi=1"
|
||
imageAlt="Kajana Pakirathan Profile"
|
||
mediaAnimation="blur-reveal"
|
||
avatars={[
|
||
{
|
||
src: "http://img.b2bpic.net/free-photo/representation-user-experience-interface-design_23-2150169856.jpg", alt: "User experience design"},
|
||
{
|
||
src: "http://img.b2bpic.net/free-photo/close-up-it-professional-using-tablet-building-ai-algorithms_482257-100475.jpg", alt: "AI algorithm development"},
|
||
{
|
||
src: "http://img.b2bpic.net/free-photo/it-specialist-working-data-center-facility-housing-storage-hardware-close-up_482257-90136.jpg", alt: "IT data center specialist"},
|
||
{
|
||
src: "http://img.b2bpic.net/free-photo/woman-typing-laptop-sitting-home-with-automation-lighting-system_482257-8729.jpg", alt: "Automation professional"},
|
||
{
|
||
src: "http://img.b2bpic.net/free-photo/business-chart-visual-graphics-report-concept_53876-125580.jpg", alt: "Business analytics expert"},
|
||
]}
|
||
marqueeItems={[
|
||
{
|
||
type: "text", text: "IT Support"},
|
||
{
|
||
type: "text", text: "Web Development"},
|
||
{
|
||
type: "text", text: "Problem Solving"},
|
||
{
|
||
type: "text", text: "Data Management"},
|
||
{
|
||
type: "text", text: "Technical Analysis"},
|
||
]}
|
||
/>
|
||
</div>
|
||
|
||
<div id="about" data-section="about">
|
||
<TextAbout
|
||
useInvertedBackground={true}
|
||
title="About Me"
|
||
buttons={[
|
||
{
|
||
text: "Download Resume", href: "#"},
|
||
]}
|
||
/>
|
||
</div>
|
||
|
||
<div id="experience" data-section="experience">
|
||
<FeatureCardEight
|
||
textboxLayout="default"
|
||
useInvertedBackground={false}
|
||
features={[
|
||
{
|
||
title: "Trading Assistant - Sainsbury's", description: "Supported daily shop operations and monitored stock levels across departments, maintaining high efficiency.", imageSrc: "http://img.b2bpic.net/free-photo/customer-marketing-sales-dashboard-graphics-concept_53876-133831.jpg", imageAlt: "Customer Marketing Sales Dashboard Graphics Concept"},
|
||
{
|
||
title: "Intern - Howden Insurance", description: "Managed invoice settlements, accounting records, and transaction data using IBA systems.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DaH1SYHce2lBKqLdIyk6kjsOeA/uploaded-1778513062007-765ftdjt.png?_wi=2", imageAlt: "Customer Marketing Sales Dashboard Graphics Concept"},
|
||
{
|
||
title: "Trainee IT Support Technician - 21CS", description: "Resolved hardware and software issues on Windows systems and assisted users with technical support.", imageSrc: "http://img.b2bpic.net/free-photo/representation-user-experience-interface-design_23-2150169842.jpg?_wi=1", imageAlt: "Customer Marketing Sales Dashboard Graphics Concept"},
|
||
{
|
||
title: "Waitress & Social Media Assistant - Kachori", description: "Delivered excellent customer service and managed digital orders/enquiries through social channels.", imageSrc: "http://img.b2bpic.net/free-photo/closeup-african-american-entrepreneur-analyzing-company-profit_482257-20207.jpg?_wi=1", imageAlt: "Customer Marketing Sales Dashboard Graphics Concept"},
|
||
]}
|
||
title="Work Experience"
|
||
description="Professional history spanning IT support, insurance, and retail operations."
|
||
/>
|
||
</div>
|
||
|
||
<div id="education" data-section="education">
|
||
<FeatureCardEight
|
||
textboxLayout="default"
|
||
useInvertedBackground={true}
|
||
features={[
|
||
{
|
||
title: "BSc (Hons) Computer Science", description: "University of East London, 2025 – Present", imageSrc: "http://img.b2bpic.net/free-photo/business-leader-trader-searching-new-investment-solution_482257-116895.jpg", imageAlt: "Business leader and trader searching for a new investment solution"},
|
||
{
|
||
title: "Cert HE: Computing", description: "University of Wales Trinity Saint David, 2024 – 2025", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DaH1SYHce2lBKqLdIyk6kjsOeA/uploaded-1778513062007-765ftdjt.png?_wi=3", imageAlt: "Business leader and trader searching for a new investment solution"},
|
||
{
|
||
title: "Level 3 Extended Diploma IT", description: "Newham College, 2023 – 2024", imageSrc: "http://img.b2bpic.net/free-photo/representation-user-experience-interface-design_23-2150169842.jpg?_wi=2", imageAlt: "Business leader and trader searching for a new investment solution"},
|
||
]}
|
||
title="Education"
|
||
description="Academic background in Computer Science and Computing."
|
||
/>
|
||
</div>
|
||
|
||
<div id="projects" data-section="projects">
|
||
<ProductCardOne
|
||
animationType="slide-up"
|
||
textboxLayout="default"
|
||
gridVariant="three-columns-all-equal-width"
|
||
useInvertedBackground={false}
|
||
products={[
|
||
{
|
||
id: "p1", name: "Network Implementation", price: "Cisco Packet Tracer", imageSrc: "http://img.b2bpic.net/free-photo/male-expert-uses-tablet-with-chroma-key-display-leveraging-dashboards_482257-126212.jpg"},
|
||
{
|
||
id: "p2", name: "Full-Stack Web App", price: "HTML, CSS, JS", imageSrc: "http://img.b2bpic.net/free-photo/representation-user-experience-interface-design_23-2150169842.jpg?_wi=3"},
|
||
{
|
||
id: "p3", name: "Business Intelligence", price: "Microsoft Specialist", imageSrc: "http://img.b2bpic.net/free-photo/closeup-african-american-entrepreneur-analyzing-company-profit_482257-20207.jpg?_wi=2"},
|
||
{
|
||
id: "p4", name: "Food Safety", price: "Certified", imageSrc: "http://img.b2bpic.net/free-photo/close-up-it-professional-using-tablet-building-ai-algorithms_482257-92639.jpg"},
|
||
{
|
||
id: "p5", name: "Customer Support", price: "Professional", imageSrc: "http://img.b2bpic.net/free-photo/person-talking-colleagues-video-call-communication-using-smartphone-business-meeting-businessman-holding-mobile-phone-online-conference-with-workmates-corporate-office_482257-28475.jpg"},
|
||
{
|
||
id: "p6", name: "Technical Troubleshooting", price: "System Admin", imageSrc: "http://img.b2bpic.net/free-photo/still-life-red-thread-connection_23-2149870852.jpg"},
|
||
]}
|
||
title="Projects & Certifications"
|
||
description="Demonstrating technical proficiency through hands-on development and certifications."
|
||
/>
|
||
</div>
|
||
|
||
<div id="skills" data-section="skills">
|
||
<MetricCardTwo
|
||
animationType="depth-3d"
|
||
textboxLayout="default"
|
||
useInvertedBackground={true}
|
||
gridVariant="uniform-all-items-equal"
|
||
metrics={[
|
||
{
|
||
id: "m1", description: "IT Support, Windows, DNS, TCP/IP", value: "Technical"},
|
||
{
|
||
id: "m2", description: "HTML/CSS, Web Development", value: "Programming"},
|
||
{
|
||
id: "m3", description: "Problem Solving, Communication, Teamwork", value: "Professional"},
|
||
]}
|
||
title="Skills"
|
||
description="Technical and Professional competencies."
|
||
/>
|
||
</div>
|
||
|
||
<div id="contact" data-section="contact">
|
||
<ContactCTA
|
||
tag="Get in touch"
|
||
title="Ready to discuss new opportunities?"
|
||
description="I am open to discuss internships, technical roles, or software engineering positions."
|
||
buttons={[
|
||
{text: "Contact Me", href: "mailto:example@email.com"}
|
||
]}
|
||
background={{ variant: "sparkles-gradient" }}
|
||
useInvertedBackground={true}
|
||
/>
|
||
</div>
|
||
|
||
<div id="footer" data-section="footer">
|
||
<FooterLogoEmphasis
|
||
logoText="Kajana Pakirathan"
|
||
columns={[
|
||
{
|
||
items: [
|
||
{ label: "About", href: "#about" },
|
||
{ label: "Experience", href: "#experience" },
|
||
{ label: "Contact", href: "#contact" },
|
||
],
|
||
},
|
||
{
|
||
items: [
|
||
{ label: "LinkedIn", href: "https://linkedin.com/in/kajana-pakirathan" },
|
||
],
|
||
},
|
||
]}
|
||
/>
|
||
</div>
|
||
</ReactLenis>
|
||
</ThemeProvider>
|
||
);
|
||
} |