Skip to content

Commit 6af2bb1

Browse files
jonaspmjonaspm
committed
refactor: update project images and descriptions, remove unused styles, and add global styles
1 parent 0b055ee commit 6af2bb1

File tree

14 files changed

+52
-96
lines changed

14 files changed

+52
-96
lines changed

‎src/assets/images/autosolutions.app.png‎

-1.39 MB
Binary file not shown.

‎src/assets/images/autosolutions.mx.png‎

940 KB
Loading

‎src/assets/images/enerlinq.com.png‎

-1.23 MB
Loading

‎src/assets/images/gerardoancer.com.png‎

-988 KB
Loading

‎src/assets/images/hackcuu.com.png‎

-132 KB
Loading

‎src/assets/images/sorteos.click.png‎

-846 KB
Loading

‎src/layouts/Layout.astro‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
---
22
const { title } = Astro.props
3-
import '@/styles/index.css'
3+
import '@/styles/global.css'
44
---
55

66
<!DOCTYPE html>
@@ -9,6 +9,9 @@ import '@/styles/index.css'
99
<meta charset="UTF-8" />
1010
<meta name="viewport" content="width=device-width" />
1111
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
12+
<meta name="description" content="Jonas Perusquia Morales - Chief Technology Officer" />
13+
<meta name="author" content="Jonas Perusquia Morales" />
14+
<meta name="keywords" content="Jonas Perusquia Morales, CTO, Chief Technology Officer, Software Engineer, Web Developer, Jonas Perusquia" />
1215
<meta name="generator" content={Astro.generator} />
1316
<title>{title}</title>
1417
<script type="text/javascript">

‎src/pages/index.astro‎

Lines changed: 48 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import socialNetworks from '@/assets/data/social-networks.json'
55
import skills from '@/assets/data/skills.json'
66
77
import sorteosClickImage from '@/assets/images/sorteos.click.png'
8-
import autosolutionsImage from '@/assets/images/autosolutions.app.png'
8+
import autosolutionsImage from '@/assets/images/autosolutions.mx.png'
99
import enerlinqImage from '@/assets/images/enerlinq.com.png'
1010
import gerardoAncerImage from '@/assets/images/gerardoancer.com.png'
1111
import hackcuuImage from '@/assets/images/hackcuu.com.png'
@@ -15,13 +15,13 @@ const projects = [
1515
{
1616
name: 'Enerlinq',
1717
url: 'https://enerlinq.com',
18-
description: 'Technology and innovation startup company.',
18+
description: 'Technology and innovation consulting company.',
1919
image: await getImage({ src: enerlinqImage }),
2020
},
2121
{
2222
name: 'Autosolutions',
23-
url: 'https://autosolutions.app',
24-
description: 'On-demand services for your vehicle & more.',
23+
url: 'https://autosolutions.mx',
24+
description: 'On-demand auto parts for your vehicle & more.',
2525
image: await getImage({ src: autosolutionsImage }),
2626
},
2727
{
@@ -44,7 +44,7 @@ const projects = [
4444
},
4545
]
4646
47-
const navItems = ['Home', 'Skills', 'Projects', 'Contact']
47+
const navItems = ['Home', 'Bio', 'Skills', 'Projects', 'Contact']
4848
4949
---
5050

@@ -64,7 +64,7 @@ const navItems = ['Home', 'Skills', 'Projects', 'Contact']
6464
</nav>
6565
</header>
6666

67-
<main class="container mx-auto px-6 pt-14 xs:pt-20">
67+
<main class="max-w-7xl mx-auto px-6 pt-14 xs:pt-20">
6868

6969
<!-- HOME SECTION -->
7070
<section id="home" class="py-14 sm:py-20">
@@ -75,6 +75,17 @@ const navItems = ['Home', 'Skills', 'Projects', 'Contact']
7575
<p class="max-w-2xl text-xl text-grayblue-300">
7676
Innovative tech leader with a passion for building scalable solutions and fostering high-performing teams.
7777
</p>
78+
<div class="flex gap-4 mt-6 justify-center lg:justify-start">
79+
{
80+
socialNetworks.map(socialNetwork => (
81+
<a href={socialNetwork.url} class="text-grayblue-300 hover:text-blue-300 transition-transform hover:scale-110">
82+
<div class="h-6 w-6">
83+
<Fragment set:html={socialNetwork.image} />
84+
</div>
85+
</a>
86+
))
87+
}
88+
</div>
7889
</div>
7990
<div class="relative h-64 w-64 overflow-hidden rounded-full border-4 border-blue-300 lg:h-80 lg:w-80">
8091
<Image
@@ -91,20 +102,19 @@ const navItems = ['Home', 'Skills', 'Projects', 'Contact']
91102
</div>
92103
</section>
93104

94-
<!-- GET IN TOUCH SECTION -->
95-
<section id="contact" class="py-14 sm:py-20">
96-
<h2 class="mb-12 text-center text-3xl text-grayblue-100 font-medium">Get in Touch</h2>
97-
<div class="flex justify-center flex-wrap gap-8">
98-
{
99-
socialNetworks.map(socialNetwork => (
100-
<a href={socialNetwork.url} class="flex flex-col items-center text-grayblue-300 hover:text-blue-300 transition-transform hover:scale-110 gap-2">
101-
<div class="h-8 w-8">
102-
<Fragment set:html={socialNetwork.image} />
103-
</div>
104-
<span class="text-xs font-medium bg-grayblue-800 px-2 py-1 rounded-md">{socialNetwork.name}</span>
105-
</a>
106-
))
107-
}
105+
<!-- BIO SECTION -->
106+
<section id="bio" class="py-14 sm:py-20">
107+
<h2 class="mb-12 text-center text-3xl font-medium">About Me</h2>
108+
<div class="mx-auto bg-grayblue-800 p-8 rounded-lg shadow-lg">
109+
<p class="text-lg leading-relaxed text-grayblue-300">
110+
With a passion for technology and over eight years of experience in web development, I've dedicated myself to adopting and implementing the latest industry trends and tools. My portfolio includes a diverse range of cloud projects spanning websites, mobile applications, and desktop software.
111+
</p>
112+
<p class="text-lg leading-relaxed text-grayblue-300 mt-4">
113+
As a self-taught perfectionist and natural leader, I bring strong problem-solving abilities to every project I undertake. My consistently positive, motivating, and inclusive approach enables me to thrive in collaborative environments where knowledge sharing is valued.
114+
</p>
115+
<p class="text-lg leading-relaxed text-grayblue-300 mt-4">
116+
Beyond the professional realm, I find balance through music, sports, and quality time with family.
117+
</p>
108118
</div>
109119
</section>
110120

@@ -121,20 +131,32 @@ const navItems = ['Home', 'Skills', 'Projects', 'Contact']
121131

122132
<section id="projects" class="py-14 sm:py-20">
123133
<h2 class="mb-12 text-center text-3xl font-medium">Featured Projects</h2>
124-
<div class="grid gap-8 md:grid-cols-2 lg:grid-cols-3">
134+
<div class="grid gap-8 md:grid-cols-2">
125135
{
126136
projects.map(project =>
127-
<a href={project.url} class="rounded-lg bg-grayblue-800 p-6 shadow-lg scale-image">
128-
<h3 class="mb-3 text-xl font-semibold text-blue-300">{ project.name }</h3>
129-
<p class="text-grayblue-300 mb-6">{ project.description }</p>
130-
<div class="overflow-hidden aspect-video rounded-lg">
131-
<img class="duration-300 transition-all aspect-video" src={ project.image.src } alt={ project.name }></img>
137+
<a href={project.url} class="rounded-lg bg-grayblue-800 p-6 shadow-lg scale-image grid md:grid-cols-2 gap-4">
138+
<div id="project-info" class="flex flex-col gap-3">
139+
<h3 class="text-xl font-semibold text-blue-300">{ project.name }</h3>
140+
<p class="text-grayblue-300">{ project.description }</p>
141+
</div>
142+
<div class="project-image self-center">
143+
<div class="overflow-hidden aspect-video rounded-lg">
144+
<img class="duration-300 transition-all aspect-video " src={ project.image.src } alt={ project.name }></img>
145+
</div>
132146
</div>
133147
</a>
134148
)
135149
}
136150
</div>
137151
</section>
152+
153+
<!-- GET IN TOUCH SECTION -->
154+
<section id="contact" class="py-14 sm:py-20">
155+
<h2 class="mb-12 text-center text-3xl text-grayblue-100 font-medium">Get in Touch</h2>
156+
<div class="flex justify-center">
157+
<div class="tidycal-embed" data-path="jperusm/15-minute-meeting"></div><script src="https://asset-tidycal.b-cdn.net/js/embed.js" async></script>
158+
</div>
159+
</section>
138160
</main>
139161

140162
<footer class="bg-grayblue-800 py-6 text-center text-sm text-grayblue-400">

‎src/styles/Footer.css‎

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

‎src/styles/Header.css‎

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

0 commit comments

Comments
 (0)