Merge version_1 into main #2
193
src/app/page.tsx
193
src/app/page.tsx
@@ -28,80 +28,36 @@ export default function LandingPage() {
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "Work",
|
||||
id: "work",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
id: "about",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
{ name: "Work", id: "work" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="Fraol Teshome"
|
||||
button={{ text: "Get Started", href: "#contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplitDoubleCarousel
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
variant: "gradient-bars"}}
|
||||
title="Fraol Teshome"
|
||||
description="Architecting the digital future. Specializing in high-performance web platforms, CLI infrastructure, and seamless mobile ecosystems."
|
||||
leftCarouselItems={[
|
||||
{
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZiIYQ6DOcSusSKN0sXuJoJCDV/futuristic-3d-web-building-interface-mod-1774703140225-9f9c3b2a.png?_wi=1",
|
||||
imageAlt: "Website Building 3D",
|
||||
},
|
||||
{
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZiIYQ6DOcSusSKN0sXuJoJCDV/floating-3d-cli-terminal-tool-icon-in-cy-1774703140873-cd9b7c80.png?_wi=1",
|
||||
imageAlt: "CLI Tools 3D",
|
||||
},
|
||||
{
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZiIYQ6DOcSusSKN0sXuJoJCDV/intricate-3d-mobile-application-wirefram-1774703143048-43834ae3.png?_wi=1",
|
||||
imageAlt: "Mobile Apps 3D",
|
||||
},
|
||||
{
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZiIYQ6DOcSusSKN0sXuJoJCDV/futuristic-3d-web-building-interface-mod-1774703140225-9f9c3b2a.png?_wi=2",
|
||||
imageAlt: "Website Building 3D",
|
||||
},
|
||||
{
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZiIYQ6DOcSusSKN0sXuJoJCDV/floating-3d-cli-terminal-tool-icon-in-cy-1774703140873-cd9b7c80.png?_wi=2",
|
||||
imageAlt: "CLI Tools 3D",
|
||||
},
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZiIYQ6DOcSusSKN0sXuJoJCDV/futuristic-3d-web-building-interface-mod-1774703140225-9f9c3b2a.png", imageAlt: "Website Building 3D" },
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZiIYQ6DOcSusSKN0sXuJoJCDV/floating-3d-cli-terminal-tool-icon-in-cy-1774703140873-cd9b7c80.png", imageAlt: "CLI Tools 3D" },
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZiIYQ6DOcSusSKN0sXuJoJCDV/intricate-3d-mobile-application-wirefram-1774703143048-43834ae3.png", imageAlt: "Mobile Apps 3D" },
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZiIYQ6DOcSusSKN0sXuJoJCDV/futuristic-3d-web-building-interface-mod-1774703140225-9f9c3b2a.png", imageAlt: "Website Building 3D" },
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZiIYQ6DOcSusSKN0sXuJoJCDV/floating-3d-cli-terminal-tool-icon-in-cy-1774703140873-cd9b7c80.png", imageAlt: "CLI Tools 3D" }
|
||||
]}
|
||||
rightCarouselItems={[
|
||||
{
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZiIYQ6DOcSusSKN0sXuJoJCDV/intricate-3d-mobile-application-wirefram-1774703143048-43834ae3.png?_wi=2",
|
||||
imageAlt: "Mobile Apps 3D",
|
||||
},
|
||||
{
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZiIYQ6DOcSusSKN0sXuJoJCDV/floating-3d-cli-terminal-tool-icon-in-cy-1774703140873-cd9b7c80.png?_wi=3",
|
||||
imageAlt: "CLI Tools 3D",
|
||||
},
|
||||
{
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZiIYQ6DOcSusSKN0sXuJoJCDV/futuristic-3d-web-building-interface-mod-1774703140225-9f9c3b2a.png?_wi=3",
|
||||
imageAlt: "Website Building 3D",
|
||||
},
|
||||
{
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZiIYQ6DOcSusSKN0sXuJoJCDV/intricate-3d-mobile-application-wirefram-1774703143048-43834ae3.png?_wi=3",
|
||||
imageAlt: "Mobile Apps 3D",
|
||||
},
|
||||
{
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZiIYQ6DOcSusSKN0sXuJoJCDV/floating-3d-cli-terminal-tool-icon-in-cy-1774703140873-cd9b7c80.png?_wi=4",
|
||||
imageAlt: "CLI Tools 3D",
|
||||
},
|
||||
]}
|
||||
buttons={[
|
||||
{
|
||||
text: "View Projects",
|
||||
href: "#work",
|
||||
},
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZiIYQ6DOcSusSKN0sXuJoJCDV/intricate-3d-mobile-application-wirefram-1774703143048-43834ae3.png", imageAlt: "Mobile Apps 3D" },
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZiIYQ6DOcSusSKN0sXuJoJCDV/floating-3d-cli-terminal-tool-icon-in-cy-1774703140873-cd9b7c80.png", imageAlt: "CLI Tools 3D" },
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZiIYQ6DOcSusSKN0sXuJoJCDV/futuristic-3d-web-building-interface-mod-1774703140225-9f9c3b2a.png", imageAlt: "Website Building 3D" },
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZiIYQ6DOcSusSKN0sXuJoJCDV/intricate-3d-mobile-application-wirefram-1774703143048-43834ae3.png", imageAlt: "Mobile Apps 3D" },
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZiIYQ6DOcSusSKN0sXuJoJCDV/floating-3d-cli-terminal-tool-icon-in-cy-1774703140873-cd9b7c80.png", imageAlt: "CLI Tools 3D" }
|
||||
]}
|
||||
buttons={[{ text: "View Projects", href: "#work" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -110,45 +66,20 @@ export default function LandingPage() {
|
||||
useInvertedBackground={true}
|
||||
title="Engineering Vision"
|
||||
description={[
|
||||
"With a focus on robust architecture and delightful user experiences, I turn complex requirements into elegant, high-impact digital products.",
|
||||
"My workflow blends deep technical expertise in CLI tooling with high-fidelity UI design for web and mobile platforms.",
|
||||
]}
|
||||
"With a focus on robust architecture and delightful user experiences, I turn complex requirements into elegant, high-impact digital products.", "My workflow blends deep technical expertise in CLI tooling with high-fidelity UI design for web and mobile platforms."]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="work" data-section="work">
|
||||
<ProductCardTwo
|
||||
animationType="blur-reveal"
|
||||
textboxLayout="split"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "p1",
|
||||
brand: "System",
|
||||
name: "Website Engine",
|
||||
price: "Build",
|
||||
rating: 5,
|
||||
reviewCount: "100+",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZiIYQ6DOcSusSKN0sXuJoJCDV/sleek-3d-render-of-a-website-builder-int-1774703140453-5d8ae9ca.png",
|
||||
},
|
||||
{
|
||||
id: "p2",
|
||||
brand: "System",
|
||||
name: "CLI Core",
|
||||
price: "Develop",
|
||||
rating: 5,
|
||||
reviewCount: "50+",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZiIYQ6DOcSusSKN0sXuJoJCDV/3d-metallic-cli-tool-gears-and-command-i-1774703140702-e3fc69b2.png",
|
||||
},
|
||||
{
|
||||
id: "p3",
|
||||
brand: "System",
|
||||
name: "Mobile Suite",
|
||||
price: "Scale",
|
||||
rating: 5,
|
||||
reviewCount: "75+",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZiIYQ6DOcSusSKN0sXuJoJCDV/modern-3d-mobile-app-development-concept-1774703140648-ccbdad2b.png",
|
||||
},
|
||||
{ id: "p1", brand: "System", name: "Website Engine", price: "Build", rating: 5, reviewCount: "100+", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZiIYQ6DOcSusSKN0sXuJoJCDV/sleek-3d-render-of-a-website-builder-int-1774703140453-5d8ae9ca.png" },
|
||||
{ id: "p2", brand: "System", name: "CLI Core", price: "Develop", rating: 5, reviewCount: "50+", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZiIYQ6DOcSusSKN0sXuJoJCDV/3d-metallic-cli-tool-gears-and-command-i-1774703140702-e3fc69b2.png" },
|
||||
{ id: "p3", brand: "System", name: "Mobile Suite", price: "Scale", rating: 5, reviewCount: "75+", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZiIYQ6DOcSusSKN0sXuJoJCDV/modern-3d-mobile-app-development-concept-1774703140648-ccbdad2b.png" },
|
||||
]}
|
||||
title="Technical Showcase"
|
||||
description="My core competencies visualized as 3D-driven product systems."
|
||||
@@ -162,46 +93,11 @@ export default function LandingPage() {
|
||||
gridVariant="four-items-2x2-equal-grid"
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Alex R.",
|
||||
role: "CTO",
|
||||
company: "Innovate",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/front-view-portrait-beautiful-woman_23-2148317338.jpg?_wi=1",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Sarah J.",
|
||||
role: "Product Lead",
|
||||
company: "Growth",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/smiling-young-woman-with-arms-crossed-office_23-2148180659.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Mike D.",
|
||||
role: "Founder",
|
||||
company: "DevStudio",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/workplace-violence-taking-place-colleagues_23-2149361854.jpg",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "Emily P.",
|
||||
role: "Engineer",
|
||||
company: "Systems",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/smiling-african-american-man-posing-library_74855-1619.jpg",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "David L.",
|
||||
role: "VP Engineering",
|
||||
company: "TechFlow",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/front-view-portrait-beautiful-woman_23-2148317338.jpg?_wi=2",
|
||||
},
|
||||
{ id: "1", name: "Alex R.", role: "CTO", company: "Innovate", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/front-view-portrait-beautiful-woman_23-2148317338.jpg" },
|
||||
{ id: "2", name: "Sarah J.", role: "Product Lead", company: "Growth", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/smiling-young-woman-with-arms-crossed-office_23-2148180659.jpg" },
|
||||
{ id: "3", name: "Mike D.", role: "Founder", company: "DevStudio", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/workplace-violence-taking-place-colleagues_23-2149361854.jpg" },
|
||||
{ id: "4", name: "Emily P.", role: "Engineer", company: "Systems", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/smiling-african-american-man-posing-library_74855-1619.jpg" },
|
||||
{ id: "5", name: "David L.", role: "VP Engineering", company: "TechFlow", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/front-view-portrait-beautiful-woman_23-2148317338.jpg" },
|
||||
]}
|
||||
title="Client Impact"
|
||||
description="Building trust through consistent high-quality output."
|
||||
@@ -212,8 +108,7 @@ export default function LandingPage() {
|
||||
<ContactCenter
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "radial-gradient",
|
||||
}}
|
||||
variant: "radial-gradient"}}
|
||||
tag="Contact"
|
||||
title="Start a Project"
|
||||
description="Ready to bring your technical vision to life? Let's talk."
|
||||
@@ -223,38 +118,8 @@ export default function LandingPage() {
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoEmphasis
|
||||
columns={[
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "Portfolio",
|
||||
href: "#work",
|
||||
},
|
||||
{
|
||||
label: "About",
|
||||
href: "#about",
|
||||
},
|
||||
{
|
||||
label: "Contact",
|
||||
href: "#contact",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "GitHub",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "LinkedIn",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Twitter",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{ items: [{ label: "Portfolio", href: "#work" }, { label: "About", href: "#about" }, { label: "Contact", href: "#contact" }] },
|
||||
{ items: [{ label: "GitHub", href: "#" }, { label: "LinkedIn", href: "#" }, { label: "Twitter", href: "#" }] }
|
||||
]}
|
||||
logoText="Fraol Teshome"
|
||||
/>
|
||||
|
||||
Reference in New Issue
Block a user