Skip to content

Commit 27d58c7

Browse files
mathcelomathcelo
authored
Merge pull request #2 from mathcelo/theme
Adding theme
2 parents a383eb6 + 691e71b commit 27d58c7

12 files changed

Lines changed: 567 additions & 484 deletions

File tree

‎src/app/about/page.tsx‎

Lines changed: 184 additions & 174 deletions
Large diffs are not rendered by default.

‎src/app/components/Entry.tsx‎

Lines changed: 36 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -1,37 +1,45 @@
1-
"use client";
1+
'use client';
22

33
import React from 'react';
44

55
interface EntryProps {
6-
organization: string;
7-
title: string;
8-
location: string;
9-
date: string;
10-
descriptions?: string[];
6+
organization: string;
7+
title: string;
8+
location: string;
9+
date: string;
10+
descriptions?: string[];
1111
}
1212

13-
const Entry: React.FC<EntryProps> = ({ organization, title, location, date, descriptions }) => {
14-
return (
15-
<div className="mb-6">
16-
<div className="flex justify-between items-start">
17-
<div>
18-
<h3 className="text-lg font-semibold text-gray-200">{organization}</h3>
19-
<p className="text-md text-gray-400">{title}</p>
20-
</div>
21-
<div className="text-right">
22-
<p className="text-sm text-gray-300 italic">{location}</p>
23-
<p className="text-sm text-gray-300">{date}</p>
24-
</div>
25-
</div>
26-
{descriptions && (
27-
<ul className="mt-2 ml-4 list-disc list-outside text-sm text-gray-300">
28-
{descriptions.map((description, index) => (
29-
<li key={index}>{description}</li>
30-
))}
31-
</ul>
32-
)}
13+
const Entry: React.FC<EntryProps> = ({
14+
organization,
15+
title,
16+
location,
17+
date,
18+
descriptions,
19+
}) => {
20+
return (
21+
<div className='mb-6'>
22+
<div className='flex justify-between items-start flex-wrap gap-2'>
23+
<div>
24+
<h3 className='text-lg font-semibold text-neutral-8'>
25+
{organization}
26+
</h3>
27+
<p className='text-md text-neutral-6'>{title}</p>
3328
</div>
34-
);
29+
<div className='text-right min-w-[150px]'>
30+
<p className='text-sm italic text-neutral-5'>{location}</p>
31+
<p className='text-sm text-neutral-5'>{date}</p>
32+
</div>
33+
</div>
34+
{descriptions && (
35+
<ul className='mt-2 ml-4 list-disc list-outside text-sm text-neutral-6 space-y-1'>
36+
{descriptions.map((description, index) => (
37+
<li key={index}>{description}</li>
38+
))}
39+
</ul>
40+
)}
41+
</div>
42+
);
3543
};
3644

37-
export default Entry;
45+
export default Entry;

‎src/app/components/Footer.tsx‎

Lines changed: 18 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -2,23 +2,23 @@ import React from 'react';
22
import { FaLinkedin } from 'react-icons/fa';
33

44
const Footer: React.FC = () => {
5-
return (
6-
<footer className="w-full bg-slate-900 text-gray-400 py-3 text-sm flex justify-center items-center gap-2">
7-
<p className="text-center">
8-
© {new Date().getFullYear()} Marcelo Morales
9-
</p>
10-
{/* LinkedIn Icon */}
11-
<a
12-
href="https://www.linkedin.com/in/marcelo-morales-547138190/" // Replace with your actual LinkedIn URL
13-
target="_blank"
14-
rel="noopener noreferrer"
15-
className="text-gray-400 hover:text-gray-300 transition duration-300"
16-
aria-label="LinkedIn Profile"
17-
>
18-
<FaLinkedin size={18} />
19-
</a>
20-
</footer>
21-
);
5+
return (
6+
<footer className='w-full bg-neutral-1 text-neutral-5 py-3 text-sm flex justify-center items-center gap-2'>
7+
<p className='text-center'>
8+
© {new Date().getFullYear()} Marcelo Morales
9+
</p>
10+
{/* LinkedIn Icon */}
11+
<a
12+
href='https://www.linkedin.com/in/marcelo-morales-547138190/'
13+
target='_blank'
14+
rel='noopener noreferrer'
15+
className='text-neutral-5 hover:text-primary-1 transition duration-300'
16+
aria-label='LinkedIn Profile'
17+
>
18+
<FaLinkedin size={18} />
19+
</a>
20+
</footer>
21+
);
2222
};
2323

24-
export default Footer;
24+
export default Footer;

‎src/app/components/Header.tsx‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -3,12 +3,12 @@ import Link from 'next/link';
33

44
const Header: React.FC = () => {
55
return (
6-
<header className='w-full bg-slate-900 text-gray-300 py-4 px-8 shadow-md'>
6+
<header className='w-full bg-neutral-1 text-neutral-8 py-4 px-8 shadow-md'>
77
<div className='max-w-4xl mx-auto flex items-center justify-between'>
88
{/* Logo / Site Name */}
99
<Link
1010
href='/'
11-
className='text-2xl font-semibold hover:text-cyan-400 transition duration-300'
11+
className='text-2xl font-semibold hover:text-primary-1 transition duration-300'
1212
>
1313
Marcelo Morales
1414
</Link>
@@ -17,19 +17,19 @@ const Header: React.FC = () => {
1717
<nav className='flex gap-6 text-sm'>
1818
<Link
1919
href='/about'
20-
className='hover:text-cyan-400 transition duration-300'
20+
className='hover:text-primary-1 transition duration-300'
2121
>
2222
About
2323
</Link>
2424
{/* <Link
25-
href='/blog'
26-
className='hover:text-cyan-400 transition duration-300'
25+
href="/blog"
26+
className="hover:text-primary-1 transition duration-300"
2727
>
2828
Blog
2929
</Link> */}
3030
<Link
3131
href='/research'
32-
className='hover:text-cyan-400 transition duration-300'
32+
className='hover:text-primary-1 transition duration-300'
3333
>
3434
Research
3535
</Link>

‎src/app/components/Publication.tsx‎

Lines changed: 51 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -1,49 +1,60 @@
1-
"use client";
1+
'use client';
22

33
import React from 'react';
44

55
interface PublicationProps {
6-
title: string;
7-
authors: string[];
8-
booktitle: string;
9-
year: number;
10-
address: string;
11-
url?: string;
12-
publisher?: string;
13-
pages?: string;
14-
highlightName?: string; // Name to be highlighted
6+
title: string;
7+
authors: string[];
8+
booktitle: string;
9+
year: number;
10+
address: string;
11+
url?: string;
12+
publisher?: string;
13+
pages?: string;
14+
highlightName?: string; // Name to be highlighted
1515
}
1616

17-
const Publication: React.FC<PublicationProps> = ({ title, authors, booktitle, year, address, url, highlightName = "Marcelo Morales" }) => {
18-
const formattedAuthors = authors.map((author, index) => (
19-
<span key={index} className={author === highlightName ? 'font-bold' : ''}>
20-
{author}
21-
{index < authors.length - 1 ? ', ' : ''}
22-
</span>
23-
));
17+
const Publication: React.FC<PublicationProps> = ({
18+
title,
19+
authors,
20+
booktitle,
21+
year,
22+
address,
23+
url,
24+
highlightName = 'Marcelo Morales',
25+
}) => {
26+
const formattedAuthors = authors.map((author, index) => (
27+
<span
28+
key={index}
29+
className={author === highlightName ? 'font-bold text-neutral-8' : ''}
30+
>
31+
{author}
32+
{index < authors.length - 1 ? ', ' : ''}
33+
</span>
34+
));
2435

25-
return (
26-
<div className="mb-6">
27-
<h3 className="text-lg font-semibold text-gray-200">
28-
{url ? (
29-
<a
30-
href={url}
31-
target="_blank"
32-
rel="noopener noreferrer"
33-
className="hover:text-cyan-400 transition duration-300"
34-
>
35-
{title}
36-
</a>
37-
) : (
38-
title
39-
)}
40-
</h3>
41-
<p className="text-md text-gray-400">{formattedAuthors}</p>
42-
<p className="text-sm text-gray-300 italic">
43-
{booktitle}, {year}, {address}
44-
</p>
45-
</div>
46-
);
36+
return (
37+
<div className='mb-6'>
38+
<h3 className='text-lg font-semibold text-neutral-8'>
39+
{url ? (
40+
<a
41+
href={url}
42+
target='_blank'
43+
rel='noopener noreferrer'
44+
className='hover:text-primary-1 transition duration-300'
45+
>
46+
{title}
47+
</a>
48+
) : (
49+
title
50+
)}
51+
</h3>
52+
<p className='text-md text-neutral-6'>{formattedAuthors}</p>
53+
<p className='text-sm italic text-neutral-5'>
54+
{booktitle}, {year}, {address}
55+
</p>
56+
</div>
57+
);
4758
};
4859

49-
export default Publication;
60+
export default Publication;

‎src/app/components/PublicationList.tsx‎

Lines changed: 58 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -1,47 +1,68 @@
1-
"use client";
1+
'use client';
22

33
import React, { useEffect, useState } from 'react';
44
import Publication from './Publication';
55

66
interface PublicationData {
7-
type: string;
8-
author: string[];
9-
title: string;
10-
booktitle: string;
11-
year: number;
12-
address: string;
13-
url?: string;
14-
publisher?: string;
15-
pages?: string;
7+
type: string;
8+
author: string[];
9+
title: string;
10+
booktitle: string;
11+
year: number;
12+
address: string;
13+
url?: string;
14+
publisher?: string;
15+
pages?: string;
1616
}
1717

1818
const PublicationList: React.FC = () => {
19-
const [publications, setPublications] = useState<PublicationData[]>([]);
20-
21-
useEffect(() => {
22-
fetch('/publications.json')
23-
.then((response) => response.json())
24-
.then((data) => setPublications(data))
25-
.catch((error) => console.error("Error loading publications data:", error));
26-
}, []);
27-
28-
return (
29-
<div className="px-4 pb-4">
30-
{publications.map((pub, index) => (
31-
<Publication
32-
key={index}
33-
title={pub.title}
34-
authors={pub.author}
35-
booktitle={pub.booktitle}
36-
year={pub.year}
37-
address={pub.address}
38-
url={pub.url}
39-
publisher={pub.publisher}
40-
pages={pub.pages}
41-
/>
42-
))}
43-
</div>
44-
);
19+
const [publications, setPublications] = useState<PublicationData[] | null>(
20+
null
21+
);
22+
const [error, setError] = useState<string | null>(null);
23+
24+
useEffect(() => {
25+
fetch('/publications.json')
26+
.then((res) => {
27+
if (!res.ok) throw new Error('Failed to load publication data.');
28+
return res.json();
29+
})
30+
.then((data) => setPublications(data))
31+
.catch((err) => {
32+
console.error('Error loading publications data:', err);
33+
setError('Could not load publications.');
34+
});
35+
}, []);
36+
37+
if (error) {
38+
return <p className='text-neutral-5 italic'>⚠️ {error}</p>;
39+
}
40+
41+
if (publications === null) {
42+
return <p className='text-neutral-6 italic'>Loading publications...</p>;
43+
}
44+
45+
if (publications.length === 0) {
46+
return <p className='text-neutral-6 italic'>No publications found.</p>;
47+
}
48+
49+
return (
50+
<div className='px-4 pb-4'>
51+
{publications.map((pub, index) => (
52+
<Publication
53+
key={index}
54+
title={pub.title}
55+
authors={pub.author}
56+
booktitle={pub.booktitle}
57+
year={pub.year}
58+
address={pub.address}
59+
url={pub.url}
60+
publisher={pub.publisher}
61+
pages={pub.pages}
62+
/>
63+
))}
64+
</div>
65+
);
4566
};
4667

47-
export default PublicationList;
68+
export default PublicationList;

0 commit comments

Comments
 (0)