bender/15218ff0-7411-4c59-9a11-49840e2e8a8d
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge version_2 into main

Browse Source 
Merge version_2 into main
This commit was merged in pull request #1.
This commit is contained in:
bender
2026-05-10 04:33:11 +00:00
parent 5a0945dbf4 663343e8bc
commit 8414321b6c
1 changed files with 48 additions and 178 deletions
Download Patch File Download Diff File Expand all files Collapse all files

226
src/app/page.tsx
View File

@@ -31,25 +31,15 @@ export default function LandingPage() {
<NavbarStyleCentered
navItems={[
{
name: "About",
id: "about",
},
name: "About", id: "about"},
{
name: "Skills",
id: "skills",
},
name: "Skills", id: "skills"},
{
name: "Projects",
id: "projects",
},
name: "Projects", id: "projects"},
{
name: "Experience",
id: "experience",
},
name: "Experience", id: "experience"},
{
name: "Contact",
id: "contact",
},
name: "Contact", id: "contact"},
]}
brandName="Sion Kim"
/>
@@ -61,39 +51,23 @@ export default function LandingPage() {
description="Web Publisher & Frontend UI Specialist. Building scalable, responsive, and user-focused digital interfaces for enterprise success."
buttons={[
{
text: "View Projects",
href: "#projects",
},
text: "View Projects", href: "#projects"},
{
text: "Contact",
href: "#contact",
},
text: "Contact", href: "#contact"},
]}
slides={[
{
imageSrc: "http://img.b2bpic.net/free-photo/professional-editor-uses-ai-powered-software-pc-reels-creative-office_482257-126981.jpg",
imageAlt: "Hero slide 1",
},
imageSrc: "http://img.b2bpic.net/free-photo/professional-editor-uses-ai-powered-software-pc-reels-creative-office_482257-126981.jpg", imageAlt: "Hero slide 1"},
{
imageSrc: "http://img.b2bpic.net/free-photo/programmer-writes-code-laptop-screen-while-apartment-office-using-java_482257-87273.jpg",
imageAlt: "Hero slide 2",
},
imageSrc: "http://img.b2bpic.net/free-photo/programmer-writes-code-laptop-screen-while-apartment-office-using-java_482257-87273.jpg", imageAlt: "Hero slide 2"},
{
imageSrc: "http://img.b2bpic.net/free-photo/front-view-desk-concept-with-copy-space_23-2148459730.jpg",
imageAlt: "Hero slide 3",
},
imageSrc: "http://img.b2bpic.net/free-photo/front-view-desk-concept-with-copy-space_23-2148459730.jpg", imageAlt: "Hero slide 3"},
{
imageSrc: "http://img.b2bpic.net/free-photo/working-table-with-computer_93675-133811.jpg",
imageAlt: "Hero slide 4",
},
imageSrc: "http://img.b2bpic.net/free-photo/working-table-with-computer_93675-133811.jpg", imageAlt: "Hero slide 4"},
{
imageSrc: "http://img.b2bpic.net/free-photo/african-american-investment-expert-works-home-analyzing-financial-statistics_482257-120570.jpg",
imageAlt: "Hero slide 5",
},
imageSrc: "http://img.b2bpic.net/free-photo/african-american-investment-expert-works-home-analyzing-financial-statistics_482257-120570.jpg", imageAlt: "Hero slide 5"},
{
imageSrc: "http://img.b2bpic.net/free-photo/senior-tech-startup-hr-recruiter-identifying-candidates-job-reviewing-cvs_482257-118780.jpg",
imageAlt: "Hero slide 6",
},
imageSrc: "http://img.b2bpic.net/free-photo/senior-tech-startup-hr-recruiter-identifying-candidates-job-reviewing-cvs_482257-118780.jpg", imageAlt: "Hero slide 6"},
]}
/>
</div>
@@ -103,20 +77,14 @@ export default function LandingPage() {
textboxLayout="split"
useInvertedBackground={false}
title="Detail-Oriented Frontend Specialist"
description="With over X years in the industry, I specialize in transforming complex design requirements into high-performance, accessible, and maintenance-friendly digital experiences. I bridge the gap between design and development through semantic markup and robust CSS architecture."
description="With over 8 years in the industry, I specialize in transforming complex design requirements into high-performance, accessible, and maintenance-friendly digital experiences. I bridge the gap between design and development through semantic markup and robust CSS architecture."
bulletPoints={[
{
title: "Semantic & Accessible",
description: "Writing clean, standard-compliant HTML/CSS with a focus on WCAG compliance.",
},
title: "Semantic & Accessible", description: "Writing clean, standard-compliant HTML/CSS with a focus on WCAG compliance."},
{
title: "Scalable Architecture",
description: "Expert in SCSS and modular component libraries that grow with your project.",
},
title: "Scalable Architecture", description: "Expert in SCSS and modular component libraries that grow with your project."},
{
title: "Performance First",
description: "Optimizing cross-browser compatibility and UI consistency for enterprise-grade performance.",
},
title: "Performance First", description: "Optimizing cross-browser compatibility and UI consistency for enterprise-grade performance."},
]}
imageSrc="http://img.b2bpic.net/free-photo/female-entrepreneur-looking-laptop-while-working-from-home-office_482257-20474.jpg"
mediaAnimation="slide-up"
@@ -130,47 +98,17 @@ export default function LandingPage() {
useInvertedBackground={false}
features={[
{
id: "s1",
title: "Core Foundations",
subtitle: "HTML5, CSS3, JS",
category: "Development",
value: "Expert",
},
id: "s1", title: "Core Foundations", subtitle: "HTML5, CSS3, JS", category: "Development", value: "Expert"},
{
id: "s2",
title: "CSS Architecture",
subtitle: "SCSS, BEM, Modular CSS",
category: "Publishing",
value: "Advanced",
},
id: "s2", title: "CSS Architecture", subtitle: "SCSS, BEM, Modular CSS", category: "Publishing", value: "Advanced"},
{
id: "s3",
title: "UI Consistency",
subtitle: "Design Systems, Figma",
category: "Design Ops",
value: "Advanced",
},
id: "s3", title: "UI Consistency", subtitle: "Design Systems, Figma", category: "Design Ops", value: "Advanced"},
{
id: "s4",
title: "Modern Accessibility",
subtitle: "WCAG Compliance, ARIA",
category: "Access",
value: "Certified",
},
id: "s4", title: "Modern Accessibility", subtitle: "WCAG Compliance, ARIA", category: "Access", value: "Certified"},
{
id: "s5",
title: "Development Flow",
subtitle: "Git, CLI, Gulp/Webpack",
category: "Tools",
value: "Advanced",
},
id: "s5", title: "Development Flow", subtitle: "Git, CLI, Gulp/Webpack", category: "Tools", value: "Advanced"},
{
id: "s6",
title: "Responsive Strategy",
subtitle: "Adaptive & Mobile-first",
category: "UX/UI",
value: "Master",
},
id: "s6", title: "Responsive Strategy", subtitle: "Adaptive & Mobile-first", category: "UX/UI", value: "Master"},
]}
title="Technical Competence"
description="Enterprise-ready skill set for modern digital implementation."
@@ -185,41 +123,17 @@ export default function LandingPage() {
useInvertedBackground={false}
products={[
{
id: "p1",
name: "Samsung Enterprise Portal",
price: "Publishing Lead",
imageSrc: "http://img.b2bpic.net/free-photo/factory-employee-works-mockup-tablet-executives-discussing-strategies_482257-126500.jpg",
},
id: "p1", name: "Samsung Enterprise Portal", price: "Publishing Lead", imageSrc: "http://img.b2bpic.net/free-photo/factory-employee-works-mockup-tablet-executives-discussing-strategies_482257-126500.jpg"},
{
id: "p2",
name: "LG Digital Campaign",
price: "UI Implementation",
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-measuring-tools-still-life_23-2150440939.jpg",
},
id: "p2", name: "LG Digital Campaign", price: "UI Implementation", imageSrc: "http://img.b2bpic.net/free-photo/high-angle-measuring-tools-still-life_23-2150440939.jpg"},
{
id: "p3",
name: "CJ Corporate Platform",
price: "Accessibility Audit",
imageSrc: "http://img.b2bpic.net/free-photo/hands-working-laptop-network-graphic-overlay_53876-124039.jpg",
},
id: "p3", name: "CJ Corporate Platform", price: "Accessibility Audit", imageSrc: "http://img.b2bpic.net/free-photo/hands-working-laptop-network-graphic-overlay_53876-124039.jpg"},
{
id: "p4",
name: "Digital Agency Website",
price: "Performance Dev",
imageSrc: "http://img.b2bpic.net/free-photo/it-specialist-working-data-center-facility-housing-storage-hardware-close-up_482257-90136.jpg",
},
id: "p4", name: "Digital Agency Website", price: "Performance Dev", imageSrc: "http://img.b2bpic.net/free-photo/it-specialist-working-data-center-facility-housing-storage-hardware-close-up_482257-90136.jpg"},
{
id: "p5",
name: "B2B SaaS Dashboard",
price: "Frontend Dev",
imageSrc: "http://img.b2bpic.net/free-photo/top-view-career-guidance-items-designers_23-2149443503.jpg",
},
id: "p5", name: "B2B SaaS Dashboard", price: "Frontend Dev", imageSrc: "http://img.b2bpic.net/free-photo/top-view-career-guidance-items-designers_23-2149443503.jpg"},
{
id: "p6",
name: "Design System 2.0",
price: "Lead Publisher",
imageSrc: "http://img.b2bpic.net/free-photo/tech-startup-company-hr-employee-looking-cvs-doing-background-checks_482257-119132.jpg",
},
id: "p6", name: "Design System 2.0", price: "Lead Publisher", imageSrc: "http://img.b2bpic.net/free-photo/tech-startup-company-hr-employee-looking-cvs-doing-background-checks_482257-119132.jpg"},
]}
title="Enterprise Case Studies"
description="Selected projects showcasing clean code and UI craftsmanship."
@@ -233,25 +147,13 @@ export default function LandingPage() {
tag="Efficiency & Quality"
metrics={[
{
id: "m1",
value: "Concept",
description: "Requirement Analysis & Planning",
},
id: "m1", value: "Concept", description: "Requirement Analysis & Planning"},
{
id: "m2",
value: "Publish",
description: "Semantic & Scalable Implementation",
},
id: "m2", value: "Publish", description: "Semantic & Scalable Implementation"},
{
id: "m3",
value: "QA",
description: "Rigorous Cross-Browser & Accessibility",
},
id: "m3", value: "QA", description: "Rigorous Cross-Browser & Accessibility"},
{
id: "m4",
value: "Live",
description: "Performance Tuning & Maintenance",
},
id: "m4", value: "Live", description: "Performance Tuning & Maintenance"},
]}
metricsAnimation="slide-up"
/>
@@ -265,29 +167,13 @@ export default function LandingPage() {
useInvertedBackground={false}
members={[
{
id: "e1",
name: "Senior Web Publisher",
role: "Digital Agency",
imageSrc: "http://img.b2bpic.net/free-photo/remote-worker-organizing-project-data-reviewing-his-handwritten-notes_482257-126448.jpg",
},
id: "e1", name: "Senior Web Publisher", role: "Digital Agency", imageSrc: "http://img.b2bpic.net/free-photo/remote-worker-organizing-project-data-reviewing-his-handwritten-notes_482257-126448.jpg"},
{
id: "e2",
name: "Frontend Specialist",
role: "Enterprise Corp",
imageSrc: "http://img.b2bpic.net/free-photo/close-up-coding-software-tablet-server-room_482257-118186.jpg",
},
id: "e2", name: "Frontend Specialist", role: "Enterprise Corp", imageSrc: "http://img.b2bpic.net/free-photo/close-up-coding-software-tablet-server-room_482257-118186.jpg"},
{
id: "e3",
name: "UI/UX Publisher",
role: "Design Agency",
imageSrc: "http://img.b2bpic.net/free-photo/development-agency-office-worker-analyzing-project-sales-fintech-startup-businessperson-sitting-desk-marketing-company-office-developing-financial-strategy-accounting-management_482257-40323.jpg",
},
id: "e3", name: "UI/UX Publisher", role: "Design Agency", imageSrc: "http://img.b2bpic.net/free-photo/development-agency-office-worker-analyzing-project-sales-fintech-startup-businessperson-sitting-desk-marketing-company-office-developing-financial-strategy-accounting-management_482257-40323.jpg"},
{
id: "e4",
name: "Frontend Lead",
role: "Software Startup",
imageSrc: "http://img.b2bpic.net/free-photo/pensive-programmer-walking-through-apartment-thinking-how-solve-coding-issues_482257-104090.jpg",
},
id: "e4", name: "Frontend Lead", role: "Software Startup", imageSrc: "http://img.b2bpic.net/free-photo/pensive-programmer-walking-through-apartment-thinking-how-solve-coding-issues_482257-104090.jpg"},
]}
title="Professional Experience"
description="Driving UI excellence in major digital organizations."
@@ -298,16 +184,13 @@ export default function LandingPage() {
<ContactCTA
useInvertedBackground={false}
background={{
variant: "plain",
}}
variant: "plain"}}
tag="Let's Collaborate"
title="Ready for your next enterprise project?"
description="Looking for a reliable Frontend UI Specialist? Let's discuss how my expertise in semantic publishing can elevate your project quality."
buttons={[
{
text: "Send Email",
href: "mailto:hello@example.com",
},
text: "Send Email", href: "mailto:hello@example.com"},
]}
/>
</div>
@@ -317,38 +200,25 @@ export default function LandingPage() {
logoText="Sion Kim"
columns={[
{
title: "Navigation",
items: [
title: "Navigation", items: [
{
label: "Projects",
href: "#projects",
},
label: "Projects", href: "#projects"},
{
label: "About",
href: "#about",
},
label: "About", href: "#about"},
],
},
{
title: "Social",
items: [
title: "Social", items: [
{
label: "GitHub",
href: "#",
},
label: "GitHub", href: "#"},
{
label: "LinkedIn",
href: "#",
},
label: "LinkedIn", href: "#"},
],
},
{
title: "Legal",
items: [
title: "Legal", items: [
{
label: "Privacy Policy",
href: "#",
},
label: "Privacy Policy", href: "#"},
],
},
]}
@@ -358,4 +228,4 @@ export default function LandingPage() {
</ReactLenis>
</ThemeProvider>
);
}
}