FIX: <main> is now in the layout which will define margins
Still having issues with Skills component
This commit is contained in:
parent
633bc9dd11
commit
4e91775608
@ -162,5 +162,4 @@
|
||||
<h3 class="text-sm font-semibold text-gray-200">{tool}</h3>
|
||||
</div>
|
||||
{/each}
|
||||
<!-- <h3 class="text-sm font-semibold text-gray-200">{tools.join(' - ')}</h3> -->
|
||||
</div>
|
||||
|
||||
@ -7,6 +7,8 @@
|
||||
|
||||
<div class="bg-[#1b1b1c]">
|
||||
<Navbar />
|
||||
{@render children()}
|
||||
<main class="mx-[13%] my-[4%] h-fit min-h-screen">
|
||||
{@render children()}
|
||||
</main>
|
||||
<Footer />
|
||||
</div>
|
||||
|
||||
@ -3,38 +3,35 @@
|
||||
import Skills from '../components/skills.svelte';
|
||||
</script>
|
||||
|
||||
<main class="h-fit w-full">
|
||||
<!-- Introduction Section -->
|
||||
<div class="flex flex h-fit w-full">
|
||||
<div class="flex size-full justify-end">
|
||||
<div class="my-16 w-3/4">
|
||||
<h1 class="p-2 font-mono text-6xl font-[900] text-blue-300">
|
||||
Building things that matter.
|
||||
</h1>
|
||||
<p class="my-5 p-2 text-gray-200 italic">
|
||||
I am a <span class="text-blue-300">software engineering student</span> at Embry Riddle
|
||||
Aeronautical University, Prescott. I am interested in
|
||||
<span class="font-semibold">building things that matter</span> and making a difference in the
|
||||
world.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="size-full"></div>
|
||||
</div>
|
||||
|
||||
<div class="flex h-full w-full flex-row">
|
||||
<!-- Left Column -->
|
||||
<div class="flex size-full flex-col items-end">
|
||||
<div class="h-full w-3/4">
|
||||
<Projects />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Right Column -->
|
||||
<div class="flex size-full justify-center">
|
||||
<div class="h-full w-3/4">
|
||||
<Skills />
|
||||
</div>
|
||||
<!-- Introduction Section -->
|
||||
<div class="flex flex h-fit w-full">
|
||||
<div class="flex size-full">
|
||||
<div class="">
|
||||
<h1 class="py-2 font-mono text-6xl font-[900] text-blue-300">Building things that matter.</h1>
|
||||
<p class="my-5 py-2 text-gray-200 italic">
|
||||
I am a <span class="text-blue-300">software engineering student</span> at Embry Riddle
|
||||
Aeronautical University, Prescott. I am interested in
|
||||
<span class="font-semibold">building things that matter</span> and making a difference in the
|
||||
world.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
<!-- DO NOT DELETE THIS -->
|
||||
<div class="size-full"></div>
|
||||
</div>
|
||||
|
||||
<div class="mt-24 flex h-full w-full flex-row">
|
||||
<!-- Left Column -->
|
||||
<div class="flex h-full w-2/3 flex-col">
|
||||
<div class="w-3/4">
|
||||
<Projects />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Right Column -->
|
||||
<div class="flex h-full w-1/3 justify-center">
|
||||
<div class="h-full w-full">
|
||||
<Skills />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -2,182 +2,177 @@
|
||||
import Link from '../../components/link.svelte';
|
||||
</script>
|
||||
|
||||
<main class="flex h-fit flex-col items-center">
|
||||
<!-- First Row -->
|
||||
<div class="w-3/4">
|
||||
<!-- My Name Section -->
|
||||
<div class="w-3/4">
|
||||
<h1 class="py-20 font-mono text-6xl font-[600] text-gray-300">
|
||||
My name is<br />
|
||||
<span class="text-blue-300">Hayden Hargreaves.</span>
|
||||
<br />
|
||||
I like to build tools.
|
||||
</h1>
|
||||
</div>
|
||||
<!-- First Row -->
|
||||
<div class="w-full">
|
||||
<!-- My Name Section -->
|
||||
<div class="my-14 w-3/4">
|
||||
<h1 class="font-mono text-6xl font-[600] text-gray-300">
|
||||
My name is<br />
|
||||
<span class="text-blue-300">Hayden Hargreaves.</span>
|
||||
<br />
|
||||
I like to build tools.
|
||||
</h1>
|
||||
</div>
|
||||
|
||||
<!-- Column Layout for About Page -->
|
||||
<div class="flex h-fit w-full">
|
||||
<!-- Left Column -->
|
||||
<div class="h-full w-2/3">
|
||||
<!-- Personal Information -->
|
||||
<div class="h-fit w-full">
|
||||
<h2 class="py-4 text-2xl font-[600] text-blue-300">Personal Information</h2>
|
||||
<p class="w-3/4 text-gray-200">
|
||||
My name is Hayden Hargreaves, and I am a software engineering student at
|
||||
<Link href="https://prescott.erau.edu" text="Embry Riddle Aeronautical University." />
|
||||
I am also pursing a minor in Cyber Security. I am a freshmen who intends to graduate in Spring,
|
||||
2028. I have a passion for building and seeing my ideas come to life.
|
||||
</p>
|
||||
<p class="my-4 w-3/4 text-gray-200">
|
||||
In my free time I like to workout, play airsoft, go mountain biking, and play video
|
||||
games. I have been playing airsoft for nearly two years and have loved it from day one!
|
||||
I own countless airsoft guns which include an
|
||||
<span class="text-blue-300">Elite Force H&K 416 A5</span>, an
|
||||
<span class="text-blue-300"> Elite Force 1911 TAC</span>, a
|
||||
<span class="text-blue-300">JAG Arms Scattergun Super CQB</span>, and many more.
|
||||
</p>
|
||||
<p class="my-4 w-3/4 text-gray-200">
|
||||
Back at home, I have a dog named <span class="text-blue-300">Penny</span> who is a mini golden-doodle.
|
||||
She was named after the character Penny from the show "The Big Bang Theory". She is a very
|
||||
energetic dog who loves to play and run around. She will be five years old this July!
|
||||
</p>
|
||||
<!-- Column Layout for About Page -->
|
||||
<div class="flex h-fit w-full">
|
||||
<!-- Left Column -->
|
||||
<div class="h-full w-2/3">
|
||||
<!-- Personal Information -->
|
||||
<div class="h-fit w-full">
|
||||
<h2 class="py-4 text-2xl font-[600] text-blue-300">Personal Information</h2>
|
||||
<p class="w-3/4 text-gray-200">
|
||||
My name is Hayden Hargreaves, and I am a software engineering student at
|
||||
<Link href="https://prescott.erau.edu" text="Embry Riddle Aeronautical University." />
|
||||
I am also pursing a minor in Cyber Security. I am a freshmen who intends to graduate in Spring,
|
||||
2028. I have a passion for building and seeing my ideas come to life.
|
||||
</p>
|
||||
<p class="my-4 w-3/4 text-gray-200">
|
||||
In my free time I like to workout, play airsoft, go mountain biking, and play video games.
|
||||
I have been playing airsoft for nearly two years and have loved it from day one! I own
|
||||
countless airsoft guns which include an
|
||||
<span class="text-blue-300">Elite Force H&K 416 A5</span>, an
|
||||
<span class="text-blue-300"> Elite Force 1911 TAC</span>, a
|
||||
<span class="text-blue-300">JAG Arms Scattergun Super CQB</span>, and many more.
|
||||
</p>
|
||||
<p class="my-4 w-3/4 text-gray-200">
|
||||
Back at home, I have a dog named <span class="text-blue-300">Penny</span> who is a mini golden-doodle.
|
||||
She was named after the character Penny from the show "The Big Bang Theory". She is a very
|
||||
energetic dog who loves to play and run around. She will be five years old this July!
|
||||
</p>
|
||||
|
||||
<div class="my-4 flex w-3/4 justify-center">
|
||||
<img
|
||||
class="h-fit w-2/3"
|
||||
src="/pennyBowBG.png"
|
||||
alt="My dog penny with a christmas bow on her head."
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Experience -->
|
||||
<div class="my-8 h-fit w-full">
|
||||
<h2 class="py-4 text-2xl font-[600] text-blue-300">Experience</h2>
|
||||
<p class="mb-4 w-3/4 text-gray-200">
|
||||
I have been programming for nearly <span class="text-blue-300">half a decade</span>. I
|
||||
started programming in high school where I learned web development using HTML, CSS, and
|
||||
some basic JavaScript. From there, I started to learn software development basics using
|
||||
<span class="text-blue-300">Java</span>. Since then I have learned to love
|
||||
<Link href="https://go.dev" text="Go" /> and have dipped my feet into the water of countless
|
||||
programming languages.
|
||||
</p>
|
||||
<p class="my-4 w-3/4 text-gray-200">
|
||||
In the past three years, I have moved from using Window to
|
||||
<span class="text-blue-300">Linux</span>
|
||||
exclusively. I have used countless distributions ranging from Ubuntu to Arch Linux, but I
|
||||
have settled on <span class="text-blue-300">NixOS</span> as my daily driver. During this
|
||||
journey I developed a "need for speed" and this led to me to
|
||||
<span class="text-blue-300">Neovim</span>. Inspired by
|
||||
<Link
|
||||
text="The Primeagen"
|
||||
href="https://x.com/ThePrimeagen?ref_src=twsrc%5Egoogle%7Ctwcamp%5Eserp%7Ctwgr%5Eauthor"
|
||||
/>, I have discovered a love for software toolchain development and have been building
|
||||
many small Neovim plugins to help my day-to-day life as a developer.
|
||||
</p>
|
||||
<p class="w-3/4 text-gray-200">
|
||||
I have been employed as a Staff Accountant at
|
||||
<span class="text-blue-300">Bottom Line Business Solutions (BLBS)</span> since 2020. In
|
||||
2023, following a hack at the previous data hosting company, I was tasked with
|
||||
developing a new data hosting solution. I developed a custom solution using Go and it is
|
||||
hosted on a Linux server on site. Implementing a strong partial and complete backup
|
||||
system and
|
||||
<Link
|
||||
text="RAID 10"
|
||||
href="https://www.techtarget.com/searchstorage/definition/RAID-10-redundant-array-of-independent-disks"
|
||||
/>
|
||||
storage, I was able to ensure that the data is safe and secure. This solution has been in
|
||||
use since 2024 and has been a great success.
|
||||
</p>
|
||||
<p class="my-4 w-3/4 text-gray-200">
|
||||
While working on the data hosting solution, I developed an interest in server management
|
||||
and have since been managing the BLBS server, as well as my own <span
|
||||
class="text-blue-300"
|
||||
>
|
||||
personal server</span
|
||||
>. Both servers run Ubuntu Server and can be accessed remotely and securely using SSH
|
||||
keys. This has been a great learning experience and has helped me develop a strong
|
||||
understanding of server management and the Linux kernel.
|
||||
</p>
|
||||
<p class="my-4 w-3/4 text-gray-200">
|
||||
In September of 2023, I was hired by the <span class="text-blue-300">
|
||||
Backcountry Horsemen of California
|
||||
</span>
|
||||
to rebuild their website. They wanted it to be modeled after their previous site from the
|
||||
90's. I developed the site using raw HTML and TailwindCSS because there was no need for anything
|
||||
fancy for a static website. Plus, I did not have access to their server, just an FTP portal
|
||||
to upload the files. The website was complete in April of 2024 and has since been in use.
|
||||
This opportunity was a great learning experience and helped me realize that I do not want
|
||||
to be a front-end web developer.
|
||||
</p>
|
||||
<p class="my-4 w-3/4 text-gray-200">
|
||||
My most recent endeavor is a research project sponsored by Embry Riddle. I am working
|
||||
with
|
||||
<Link href="https://faculty.erau.edu/Seth.McNeill" text="Dr. Seth McNeill" />
|
||||
to create an <span class="text-blue-300">Acoustic Drone Detection Sensor Network</span>.
|
||||
We are able to detect drones with just sound having a nearly 95% accuracy rate. My
|
||||
portion of this project is the network infrastructure. I have developed an
|
||||
<span class="text-blue-300"> Internet of Things (IoT)</span> network that connects all of
|
||||
the sensors between a gateway. Any data collected by the sensors is sent to AWS where it
|
||||
is processed and then stored locally on a server. This project has been an amazing experience
|
||||
and has helped me to develop a strong understanding of IoT networks and the AWS ecosystem.
|
||||
Furthermore, it has opened my eyes to the world of research and has introduced me to many
|
||||
bright individuals.
|
||||
</p>
|
||||
<div class="my-4 flex w-3/4 justify-center">
|
||||
<img
|
||||
class="h-fit w-2/3"
|
||||
src="/pennyBowBG.png"
|
||||
alt="My dog penny with a christmas bow on her head."
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Right Column -->
|
||||
<div class="h-full w-1/3">
|
||||
<div class="w-full">
|
||||
<!-- Education Section -->
|
||||
<h2 class="py-2 text-xl font-semibold text-blue-300">EDUCATION</h2>
|
||||
<div class="mb-4">
|
||||
<h3 class="text-sm font-semibold text-gray-200">
|
||||
Embry Riddle Aeronautical University - 2028
|
||||
</h3>
|
||||
<p class="py text-xs text-gray-200">
|
||||
Bachelor of Science in Software Engineering with minor in Cyber Intelligence and
|
||||
Security (4.00 GPA)
|
||||
</p>
|
||||
</div>
|
||||
<div class="my-4">
|
||||
<h3 class="text-sm font-semibold text-gray-200">West-MEC Central Campus - 2024</h3>
|
||||
<p class="py text-xs text-gray-200">Coding & Programming (4.00 GPA)</p>
|
||||
</div>
|
||||
<div class="my-4">
|
||||
<h3 class="text-sm font-semibold text-gray-200">Paradise Honors High School - 2024</h3>
|
||||
<p class="py text-xs text-gray-200">Honors Student, 13 out of 213 (4.51 WGPA)</p>
|
||||
</div>
|
||||
<!-- Experience -->
|
||||
<div class="my-8 h-fit w-full">
|
||||
<h2 class="py-4 text-2xl font-[600] text-blue-300">Experience</h2>
|
||||
<p class="mb-4 w-3/4 text-gray-200">
|
||||
I have been programming for nearly <span class="text-blue-300">half a decade</span>. I
|
||||
started programming in high school where I learned web development using HTML, CSS, and
|
||||
some basic JavaScript. From there, I started to learn software development basics using
|
||||
<span class="text-blue-300">Java</span>. Since then I have learned to love
|
||||
<Link href="https://go.dev" text="Go" /> and have dipped my feet into the water of countless
|
||||
programming languages.
|
||||
</p>
|
||||
<p class="my-4 w-3/4 text-gray-200">
|
||||
In the past three years, I have moved from using Window to
|
||||
<span class="text-blue-300">Linux</span>
|
||||
exclusively. I have used countless distributions ranging from Ubuntu to Arch Linux, but I have
|
||||
settled on <span class="text-blue-300">NixOS</span> as my daily driver. During this
|
||||
journey I developed a "need for speed" and this led to me to
|
||||
<span class="text-blue-300">Neovim</span>. Inspired by
|
||||
<Link
|
||||
text="The Primeagen"
|
||||
href="https://x.com/ThePrimeagen?ref_src=twsrc%5Egoogle%7Ctwcamp%5Eserp%7Ctwgr%5Eauthor"
|
||||
/>, I have discovered a love for software toolchain development and have been building
|
||||
many small Neovim plugins to help my day-to-day life as a developer.
|
||||
</p>
|
||||
<p class="w-3/4 text-gray-200">
|
||||
I have been employed as a Staff Accountant at
|
||||
<span class="text-blue-300">Bottom Line Business Solutions (BLBS)</span> since 2020. In
|
||||
2023, following a hack at the previous data hosting company, I was tasked with developing
|
||||
a new data hosting solution. I developed a custom solution using Go and it is hosted on a
|
||||
Linux server on site. Implementing a strong partial and complete backup system and
|
||||
<Link
|
||||
text="RAID 10"
|
||||
href="https://www.techtarget.com/searchstorage/definition/RAID-10-redundant-array-of-independent-disks"
|
||||
/>
|
||||
storage, I was able to ensure that the data is safe and secure. This solution has been in use
|
||||
since 2024 and has been a great success.
|
||||
</p>
|
||||
<p class="my-4 w-3/4 text-gray-200">
|
||||
While working on the data hosting solution, I developed an interest in server management
|
||||
and have since been managing the BLBS server, as well as my own <span
|
||||
class="text-blue-300"
|
||||
>
|
||||
personal server</span
|
||||
>. Both servers run Ubuntu Server and can be accessed remotely and securely using SSH
|
||||
keys. This has been a great learning experience and has helped me develop a strong
|
||||
understanding of server management and the Linux kernel.
|
||||
</p>
|
||||
<p class="my-4 w-3/4 text-gray-200">
|
||||
In September of 2023, I was hired by the <span class="text-blue-300">
|
||||
Backcountry Horsemen of California
|
||||
</span>
|
||||
to rebuild their website. They wanted it to be modeled after their previous site from the 90's.
|
||||
I developed the site using raw HTML and TailwindCSS because there was no need for anything
|
||||
fancy for a static website. Plus, I did not have access to their server, just an FTP portal
|
||||
to upload the files. The website was complete in April of 2024 and has since been in use. This
|
||||
opportunity was a great learning experience and helped me realize that I do not want to be
|
||||
a front-end web developer.
|
||||
</p>
|
||||
<p class="my-4 w-3/4 text-gray-200">
|
||||
My most recent endeavor is a research project sponsored by Embry Riddle. I am working with
|
||||
<Link href="https://faculty.erau.edu/Seth.McNeill" text="Dr. Seth McNeill" />
|
||||
to create an <span class="text-blue-300">Acoustic Drone Detection Sensor Network</span>.
|
||||
We are able to detect drones with just sound having a nearly 95% accuracy rate. My portion
|
||||
of this project is the network infrastructure. I have developed an
|
||||
<span class="text-blue-300"> Internet of Things (IoT)</span> network that connects all of the
|
||||
sensors between a gateway. Any data collected by the sensors is sent to AWS where it is processed
|
||||
and then stored locally on a server. This project has been an amazing experience and has helped
|
||||
me to develop a strong understanding of IoT networks and the AWS ecosystem. Furthermore, it
|
||||
has opened my eyes to the world of research and has introduced me to many bright individuals.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Contact Info Section -->
|
||||
<h2 class="mt-14 py-2 text-xl font-semibold text-blue-300">CONTACTS</h2>
|
||||
<div class="mb-4">
|
||||
<h3 class="text-sm font-semibold text-gray-200">Email</h3>
|
||||
<p class="py text-xs text-gray-200">hhargreaves2006@gmail.com</p>
|
||||
</div>
|
||||
<div class="my-4">
|
||||
<h3 class="text-sm font-semibold text-gray-200">Phone</h3>
|
||||
<p class="py text-xs text-gray-200">(623) 237 - 0838</p>
|
||||
</div>
|
||||
<div class="my-4">
|
||||
<h3 class="text-sm font-semibold text-gray-200">Location</h3>
|
||||
<p class="py text-xs text-gray-200">Prescott, AZ</p>
|
||||
</div>
|
||||
<div class="my-4">
|
||||
<h3 class="text-sm font-semibold text-gray-200">LinkedIn</h3>
|
||||
<p class="py text-xs text-gray-200">Hayden Hargreaves</p>
|
||||
</div>
|
||||
<div class="my-4">
|
||||
<h3 class="text-sm font-semibold text-gray-200">X</h3>
|
||||
<p class="py text-xs text-gray-200">@azpect_3120</p>
|
||||
</div>
|
||||
<div class="my-4">
|
||||
<h3 class="text-sm font-semibold text-gray-200">GitHub</h3>
|
||||
<p class="py text-xs text-gray-200">Azpect3120</p>
|
||||
</div>
|
||||
<!-- Right Column -->
|
||||
<div class="h-full w-1/3">
|
||||
<div class="w-full">
|
||||
<!-- Education Section -->
|
||||
<h2 class="py-2 text-xl font-semibold text-blue-300">EDUCATION</h2>
|
||||
<div class="mb-4">
|
||||
<h3 class="text-sm font-semibold text-gray-200">
|
||||
Embry Riddle Aeronautical University - 2028
|
||||
</h3>
|
||||
<p class="py text-xs text-gray-200">
|
||||
Bachelor of Science in Software Engineering with minor in Cyber Intelligence and
|
||||
Security (4.00 GPA)
|
||||
</p>
|
||||
</div>
|
||||
<div class="my-4">
|
||||
<h3 class="text-sm font-semibold text-gray-200">West-MEC Central Campus - 2024</h3>
|
||||
<p class="py text-xs text-gray-200">Coding & Programming (4.00 GPA)</p>
|
||||
</div>
|
||||
<div class="my-4">
|
||||
<h3 class="text-sm font-semibold text-gray-200">Paradise Honors High School - 2024</h3>
|
||||
<p class="py text-xs text-gray-200">Honors Student, 13 out of 213 (4.51 WGPA)</p>
|
||||
</div>
|
||||
|
||||
<!-- Contact Info Section -->
|
||||
<h2 class="mt-14 py-2 text-xl font-semibold text-blue-300">CONTACTS</h2>
|
||||
<div class="mb-4">
|
||||
<h3 class="text-sm font-semibold text-gray-200">Email</h3>
|
||||
<p class="py text-xs text-gray-200">hhargreaves2006@gmail.com</p>
|
||||
</div>
|
||||
<div class="my-4">
|
||||
<h3 class="text-sm font-semibold text-gray-200">Phone</h3>
|
||||
<p class="py text-xs text-gray-200">(623) 237 - 0838</p>
|
||||
</div>
|
||||
<div class="my-4">
|
||||
<h3 class="text-sm font-semibold text-gray-200">Location</h3>
|
||||
<p class="py text-xs text-gray-200">Prescott, AZ</p>
|
||||
</div>
|
||||
<div class="my-4">
|
||||
<h3 class="text-sm font-semibold text-gray-200">LinkedIn</h3>
|
||||
<p class="py text-xs text-gray-200">Hayden Hargreaves</p>
|
||||
</div>
|
||||
<div class="my-4">
|
||||
<h3 class="text-sm font-semibold text-gray-200">X</h3>
|
||||
<p class="py text-xs text-gray-200">@azpect_3120</p>
|
||||
</div>
|
||||
<div class="my-4">
|
||||
<h3 class="text-sm font-semibold text-gray-200">GitHub</h3>
|
||||
<p class="py text-xs text-gray-200">Azpect3120</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
</div>
|
||||
|
||||
@ -11,37 +11,35 @@
|
||||
});
|
||||
</script>
|
||||
|
||||
<main class="mx-[7.5%] my-[5%] min-h-screen">
|
||||
<!-- Header -->
|
||||
<div class="my-8 w-1/2">
|
||||
<h1 class="font-mono text-6xl font-[900] text-blue-300">Blog Posts.</h1>
|
||||
<p class="my-5 py-2 text-gray-200 italic">
|
||||
Here you can find a list of all the blog posts I have written. Some of them are about my
|
||||
projects, some are about my thoughts, and some are about my experiences. I hope you enjoy!
|
||||
<!-- Header -->
|
||||
<div class="my-8 w-1/2">
|
||||
<h1 class="font-mono text-6xl font-[900] text-blue-300">Blog Posts.</h1>
|
||||
<p class="my-5 py-2 text-gray-200 italic">
|
||||
Here you can find a list of all the blog posts I have written. Some of them are about my
|
||||
projects, some are about my thoughts, and some are about my experiences. I hope you enjoy!
|
||||
</p>
|
||||
</div>
|
||||
<!-- Posts List -->
|
||||
<div class="w-2/3">
|
||||
{#if data.posts.length === 0}
|
||||
<h2 class="py-8 text-6xl font-semibold text-gray-300 italic opacity-30">404</h2>
|
||||
<p class="w-2/3 text-gray-300">
|
||||
Uh oh! There are no posts to show. Check back later for more content! If you think this is a
|
||||
mistake or have any interesting ideas, please let me know by sending me an
|
||||
<Link href="mailto:hhargreaves2006@gmail.com" text="email" />.
|
||||
</p>
|
||||
</div>
|
||||
<!-- Posts List -->
|
||||
<div class="w-2/3">
|
||||
{#if data.posts.length === 0}
|
||||
<h2 class="py-8 text-6xl font-semibold text-gray-300 italic opacity-30">404</h2>
|
||||
<p class="w-2/3 text-gray-300">
|
||||
Uh oh! There are no posts to show. Check back later for more content! If you think this is a
|
||||
mistake or have any interesting ideas, please let me know by sending me an
|
||||
<Link href="mailto:hhargreaves2006@gmail.com" text="email" />.
|
||||
</p>
|
||||
{/if}
|
||||
{#each data.posts as post}
|
||||
<div class="group my-5 rounded-sm border-l-4 border-blue-300 px-4">
|
||||
<h2 class="text-xl">
|
||||
<a href={post.path} class="group relative inline-block no-underline">
|
||||
<span class="relative z-10 text-gray-300">{post.title}</span>
|
||||
<span
|
||||
class="absolute bottom-0 left-0 h-[3px] w-0 bg-blue-300 transition-all duration-300 group-hover:w-full"
|
||||
></span>
|
||||
</a>
|
||||
</h2>
|
||||
<p class="text-sm text-gray-400">{post.description}</p>
|
||||
</div>
|
||||
{/each}
|
||||
</div>
|
||||
</main>
|
||||
{/if}
|
||||
{#each data.posts as post}
|
||||
<div class="group my-5 rounded-sm border-l-4 border-blue-300 px-4">
|
||||
<h2 class="text-xl">
|
||||
<a href={post.path} class="group relative inline-block no-underline">
|
||||
<span class="relative z-10 text-gray-300">{post.title}</span>
|
||||
<span
|
||||
class="absolute bottom-0 left-0 h-[3px] w-0 bg-blue-300 transition-all duration-300 group-hover:w-full"
|
||||
></span>
|
||||
</a>
|
||||
</h2>
|
||||
<p class="text-sm text-gray-400">{post.description}</p>
|
||||
</div>
|
||||
{/each}
|
||||
</div>
|
||||
|
||||
@ -11,7 +11,7 @@
|
||||
</p>
|
||||
</main>
|
||||
{:else}
|
||||
<div class="blog-wrapper prose mx-[7.5%] my-[3%]">
|
||||
<div class="blog-wrapper prose">
|
||||
{@html data.post.content}
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user