Skip to content

Commit 3f6133b

Browse files
author
Marcus
committed
change theme, add about page
1 parent 611133c commit 3f6133b

15 files changed

Lines changed: 445 additions & 477 deletions

File tree

‎app/(app)/about/page.tsx‎

Lines changed: 163 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,169 @@
1+
import { PortableBlock } from "@/components/portable-text";
12
import SectionWrapper from "@/components/ui/section-wrapper";
3+
import { getProfile } from "@/sanity/lib/query";
4+
import {
5+
Download,
6+
Github,
7+
GraduationCap,
8+
Linkedin,
9+
Mail,
10+
MapPin,
11+
Twitch,
12+
Twitter,
13+
} from "lucide-react";
14+
import Image from "next/image";
15+
import Link from "next/link";
16+
17+
export default async function AboutPage() {
18+
const profile = await getProfile();
19+
20+
if (!profile) {
21+
return (
22+
<SectionWrapper>
23+
<p className="text-center text-muted-foreground">Profile not found.</p>
24+
</SectionWrapper>
25+
);
26+
}
227

3-
export default function AboutPage() {
428
return (
5-
<SectionWrapper className="h-full min-h-screen z-50">
6-
<div>
7-
<h1 className="text-4xl font-bold mb-4">About Me</h1>
8-
<p className="text-lg text-gray-700">
9-
Welcome to my portfolio! I am a passionate software engineer with a focus on building
10-
innovative and efficient applications. My journey in tech has been driven by a love for
11-
problem-solving and continuous learning.
12-
</p>
13-
<p className="mt-4 text-lg text-gray-700">
14-
Feel free to explore my projects and get in touch if you&apos;d like to collaborate or
15-
learn more about my work!
16-
</p>
17-
</div>
29+
<SectionWrapper>
30+
<article className="max-w-4xl mx-auto">
31+
<div className="flex flex-col md:flex-row items-center gap-8 mb-10">
32+
{profile.profileImage?.url && (
33+
<Image
34+
src={profile.profileImage.url}
35+
alt={profile.profileImage.alt || profile.fullName}
36+
width={180}
37+
height={180}
38+
className="rounded-xl object-cover shadow-lg"
39+
/>
40+
)}
41+
<div>
42+
<h1 className="text-3xl font-bold">{profile.fullName}</h1>
43+
{profile.headline && <p className="text-muted-foreground mt-1">{profile.headline}</p>}
44+
<p className="mt-2 text-sm">
45+
<Link
46+
href={profile.currentCompanyLink}
47+
target="_blank"
48+
rel="noopener noreferrer"
49+
className="text-primary hover:underline"
50+
>
51+
{profile.currentCompany}
52+
</Link>
53+
</p>
54+
<div className="flex items-center gap-4 mt-3 text-sm text-muted-foreground">
55+
{profile.location && (
56+
<span className="flex items-center gap-1">
57+
<MapPin size={16} /> {profile.location}
58+
</span>
59+
)}
60+
{profile.email && (
61+
<span className="flex items-center gap-1">
62+
<Mail size={16} /> {profile.email}
63+
</span>
64+
)}
65+
</div>
66+
<div className="flex gap-3 mt-4">
67+
{profile.socialLinks?.github && (
68+
<Link href={profile.socialLinks.github} target="_blank" rel="noopener">
69+
<Github className="h-5 w-5 hover:text-primary transition-colors" />
70+
</Link>
71+
)}
72+
{profile.socialLinks?.linkedin && (
73+
<Link href={profile.socialLinks.linkedin} target="_blank" rel="noopener">
74+
<Linkedin className="h-5 w-5 hover:text-primary transition-colors" />
75+
</Link>
76+
)}
77+
{profile.socialLinks?.twitter && (
78+
<Link href={profile.socialLinks.twitter} target="_blank" rel="noopener">
79+
<Twitter className="h-5 w-5 hover:text-primary transition-colors" />
80+
</Link>
81+
)}
82+
{profile.socialLinks?.twitch && (
83+
<Link href={profile.socialLinks.twitch} target="_blank" rel="noopener">
84+
<Twitch className="h-5 w-5 hover:text-primary transition-colors" />
85+
</Link>
86+
)}
87+
</div>
88+
</div>
89+
</div>
90+
91+
{profile.fullBio && (
92+
<div className="prose dark:prose-invert max-w-none mb-10">
93+
<PortableBlock value={profile.fullBio} />
94+
</div>
95+
)}
96+
97+
{/* {profile.skills && profile.skills.length > 0 && (
98+
<div className="mb-10">
99+
<h2 className="text-xl font-semibold mb-3">Skills</h2>
100+
<div className="flex flex-wrap gap-2">
101+
{profile.skills.map((skill) => (
102+
<span
103+
key={skill}
104+
className="px-3 py-1 text-sm bg-primary/10 rounded-full text-primary font-medium"
105+
>
106+
{skill}
107+
</span>
108+
))}
109+
</div>
110+
</div>
111+
)} */}
112+
{profile.education && profile.education.length > 0 && (
113+
<div className="mb-10">
114+
<h2 className="text-xl font-semibold mb-3 flex gap-2">
115+
<GraduationCap />
116+
Education
117+
</h2>
118+
<div className="space-y-4">
119+
{profile.education.map((edu, idx) => (
120+
<div
121+
key={idx}
122+
className="flex flex-col sm:flex-row items-start sm:items-center gap-4 border rounded-lg p-4 bg-muted"
123+
>
124+
{edu.logo?.url && (
125+
<Image
126+
src={edu.logo.url}
127+
alt={edu.logo.alt || edu.school}
128+
width={64}
129+
height={64}
130+
className="rounded-md object-contain bg-background p-1 shadow-sm"
131+
/>
132+
)}
133+
<div className="flex-1">
134+
<h3 className="font-medium text-lg">{edu.school}</h3>
135+
<p className="text-sm text-muted-foreground">
136+
{edu.degree}
137+
{edu.major && ` — ${edu.major}`}
138+
</p>
139+
<div className="flex items-center flex-wrap gap-3 text-sm text-muted-foreground mt-1">
140+
{edu.years && <span>{edu.years}</span>}
141+
{edu.location && (
142+
<span className="flex items-center gap-1">
143+
<MapPin size={14} /> {edu.location}
144+
</span>
145+
)}
146+
</div>
147+
{edu.details && <p className="text-sm mt-2 leading-relaxed">{edu.details}</p>}
148+
</div>
149+
</div>
150+
))}
151+
</div>
152+
</div>
153+
)}
154+
155+
{profile.resumeURL && (
156+
<Link
157+
href={profile.resumeURL}
158+
target="_blank"
159+
rel="noopener"
160+
className="inline-flex items-center gap-2 px-4 py-2 bg-primary text-white rounded-lg hover:bg-primary/90 transition"
161+
>
162+
<Download className="h-4 w-4" />
163+
Download Resume
164+
</Link>
165+
)}
166+
</article>
18167
</SectionWrapper>
19168
);
20169
}

‎app/(app)/projects/[slug]/page.tsx‎

Lines changed: 0 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -29,12 +29,6 @@ export default async function ProjectDetails(props: { params: Params }) {
2929

3030
<h1 className="text-4xl font-bold mb-4 text-center">{pet.name}</h1>
3131

32-
{pet.category && (
33-
<p className="text-sm text-muted-foreground mb-4 capitalize text-center">
34-
{pet.category}
35-
</p>
36-
)}
37-
3832
<div className="flex flex-wrap justify-center gap-2 mb-8">
3933
{pet.techStack?.map((tech) => (
4034
<span

‎app/(app)/projects/page.tsx‎

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import { Badge } from "@/components/ui/badge";
12
import { Button } from "@/components/ui/button";
23
import SectionWrapper from "@/components/ui/section-wrapper";
34
import { getAllPets } from "@/sanity/lib/query";
@@ -8,7 +9,7 @@ export default async function ProjectsPage() {
89
const projects = await getAllPets();
910
console.log(projects);
1011
return (
11-
<SectionWrapper>
12+
<SectionWrapper className="max-w-7xl">
1213
<div className="">
1314
<h1 className="text-4xl md:text-5xl font-bold text-center mb-12">Projects</h1>
1415

@@ -18,7 +19,7 @@ export default async function ProjectsPage() {
1819
key={project._id}
1920
className={`flex flex-col md:flex-row ${
2021
index % 2 === 1 ? "md:flex-row-reverse" : ""
21-
} bg-muted/10 dark:bg-muted/20 border border-border/50 rounded-xl overflow-hidden shadow-sm hover:shadow-lg transition-all duration-300 group`}
22+
} bg-muted border border-border/50 rounded-xl overflow-hidden shadow-sm hover:shadow-lg transition-all duration-300 group`}
2223
>
2324
{project.coverImage?.url && (
2425
<div className="relative w-full aspect-[4/3]">
@@ -35,9 +36,9 @@ export default async function ProjectsPage() {
3536
<div className="flex flex-col justify-between p-6 w-full">
3637
<div>
3738
{project.category && (
38-
<span className="inline-block bg-primary/10 text-primary text-xs font-medium px-2 py-1 rounded mb-2">
39+
<Badge variant={"secondary"} className="px-2 py-1 mb-2">
3940
{project.category}
40-
</span>
41+
</Badge>
4142
)}
4243
<h2 className="text-xl font-semibold mb-2">{project.name}</h2>
4344
<p className="text-muted-foreground text-sm mt-2 line-clamp-3">
@@ -47,7 +48,7 @@ export default async function ProjectsPage() {
4748

4849
{/* Links */}
4950
<div className="mt-6 flex items-center gap-4">
50-
<Button variant={"secondary"}>
51+
<Button>
5152
<Link href={`/projects/${project.slug}`}>View Details</Link>
5253
</Button>
5354

‎app/components/ProjectCard.tsx‎

Lines changed: 0 additions & 71 deletions
This file was deleted.

0 commit comments

Comments
 (0)