Skip to content

Commit

Permalink
another one
Browse files Browse the repository at this point in the history
  • Loading branch information
@ChrisMoriarty
ChrisMoriarty committed Nov 7, 2024
1 parent a7093eb commit 1d97170
Showing 1 changed file with 143 additions and 141 deletions.
284 changes: 143 additions & 141 deletions src/pages/index.astro
View file
Original file line number Diff line number Diff line change
Expand Up @@ -23,173 +23,175 @@ import Layout from "../layouts/Layout.astro";
alt="Christopher Moriarty"
class="w-16 h-16"
/>
<div
<div>
<a
href="/"
class="text-4xl lg:text-5xl block font-bold tracking-tight bg-clip-text text-transparent bg-gradient-to-b from-neutral-50 to-neutral-400 bg-opacity-50"
>
<h1>Christopher Moriarty</h1>
</div>
<h2 class="mt-2 text-sm lg:text-lg font-medium text-neutral-400">
Software Architect, Contractor, Entrepreneur
</h2>
href="/"
class="text-4xl lg:text-5xl block font-bold tracking-tight bg-clip-text text-transparent bg-gradient-to-b from-neutral-50 to-neutral-400 bg-opacity-50"
>
<h1>Christopher Moriarty</h1>
</a>
<h2 class="mt-2 text-sm lg:text-lg font-medium text-neutral-400">
Software Architect, Contractor, Entrepreneur
</h2>

<a
data-ccursor
href="mailto:[email protected]"
class="inline-flex transition-all border-neutral-700 hover:border-opacity-0 border-opacity-50 shadow rounded-md border backdrop-blur-xl bg-neutral-400/10 px-3 py-2.5 items-center text-white font-semibold group p-2 text-sm gap-x-2 mt-4"
>
<span>Email me</span>
<sapn
class="w-2 h-2 rounded-full bg-green-400 duration-1000 animate-pulse"
<a
data-ccursor
href="mailto:[email protected]"
class="inline-flex transition-all border-neutral-700 hover:border-opacity-0 border-opacity-50 shadow rounded-md border backdrop-blur-xl bg-neutral-400/10 px-3 py-2.5 items-center text-white font-semibold group p-2 text-sm gap-x-2 mt-4"
>
</sapn>
</a>
<span>Email me</span>
<sapn
class="w-2 h-2 rounded-full bg-green-400 duration-1000 animate-pulse"
>
</sapn>
</a>
</div>
</div>
</header>

{
SOCIALS.length && (
<ul
class="mt-8 flex items-center justify-center lg:justify-normal gap-x-5"
aria-label="Social media"
>
{SOCIALS.map((social) => (
<li class="text-xs p-2 rounded" data-ccursor>
<a
class="block hover:text-slate-200"
href={social.url}
target="_blank"
rel="noreferrer noopener"
aria-label={`${social.name} (opens in a new tab)`}
>
<span class="sr-only">{social.name}</span>
{<Component component={social.icon} />}
</a>
</li>
))}
</ul>
)
}
</div>
{
SOCIALS.length && (
<ul
class="mt-8 flex items-center justify-center lg:justify-normal gap-x-5"
aria-label="Social media"
>
{SOCIALS.map((social) => (
<li class="text-xs p-2 rounded" data-ccursor>
<a
class="block hover:text-slate-200"
href={social.url}
target="_blank"
rel="noreferrer noopener"
aria-label={`${social.name} (opens in a new tab)`}
>
<span class="sr-only">{social.name}</span>
{<Component component={social.icon} />}
</a>
</li>
))}
</ul>
)
}
</header>

<main id="content" class="pt-24 lg:w-1/2 lg:py-24">
<section
id="about"
class="mb-16 scroll-mt-16 md:mb-24 lg:mb-36 lg:scroll-mt-24"
aria-label="About me"
>
<div
class="sticky top-0 z-20 -mx-6 mb-4 w-screen px-6 py-3 backdrop-blur-lg md:-mx-12 md:px-12 lg:sr-only lg:relative lg:top-auto lg:mx-auto lg:w-full lg:px-0 lg:py-0 lg:opacity-0"
<main id="content" class="pt-24 lg:w-1/2 lg:py-24">
<section
id="about"
class="mb-16 scroll-mt-16 md:mb-24 lg:mb-36 lg:scroll-mt-24"
aria-label="About me"
>
<h2
class="text-sm font-bold uppercase tracking-widest text-neutral-200 lg:sr-only"
<div
class="sticky top-0 z-20 -mx-6 mb-4 w-screen px-6 py-3 backdrop-blur-lg md:-mx-12 md:px-12 lg:sr-only lg:relative lg:top-auto lg:mx-auto lg:w-full lg:px-0 lg:py-0 lg:opacity-0"
>
About
</h2>
</div>
<div>
<div class="mb-4 space-y-4">
<p>
I've been a professional software engineer since 2006, spending
the majority of my career in the field of astrophysics. I've
recently started my own company, <b>
Moriarty Engineering LLC
</b>, to pursue my own endevours. I'm passionate about science,
technology, and the intersection of the two. I'm always looking
for new and exciting opportunities to collaborate with others!
</p>
<h2
class="text-sm font-bold uppercase tracking-widest text-neutral-200 lg:sr-only"
>
About
</h2>
</div>
</div>
</section>
<section
id="experience"
class="mb-16 scroll-mt-16 md:mb-24 lg:mb-36 lg:scroll-mt-24"
aria-label="Work experience"
>
<div
class="sticky top-0 z-20 -mx-6 mb-4 w-screen px-6 py-3 backdrop-blur-lg md:-mx-12 md:px-12 lg:sr-only lg:relative lg:top-auto lg:mx-auto lg:w-full lg:px-0 lg:py-0 lg:opacity-0"
<div>
<div class="mb-4 space-y-4">
<p>
I've been a professional software engineer since 2006,
spending the majority of my career in the field of
astrophysics. I've recently started my own company, <b>
Moriarty Engineering LLC
</b>, to pursue my own endevours. I'm passionate about
science, technology, and the intersection of the two. I'm
always looking for new and exciting opportunities to
collaborate with others!
</p>
</div>
</div>
</section>
<section
id="experience"
class="mb-16 scroll-mt-16 md:mb-24 lg:mb-36 lg:scroll-mt-24"
aria-label="Work experience"
>
<h2
class="text-sm font-bold uppercase tracking-widest text-neutral-200 lg:sr-only"
<div
class="sticky top-0 z-20 -mx-6 mb-4 w-screen px-6 py-3 backdrop-blur-lg md:-mx-12 md:px-12 lg:sr-only lg:relative lg:top-auto lg:mx-auto lg:w-full lg:px-0 lg:py-0 lg:opacity-0"
>
Experience
</h2>
</div><div>
<ol class="group/list space-y-12">
{EXPERIENCE.map((experience) => <Experience {...experience} />)}
</ol>

<div class="mt-12">
<a
data-ccursor
class="inline-flex items-center leading-tight text-neutral-200 font-semibold group p-2 rounded px-3"
aria-label="View Full Résumé"
target="_blank"
rel="noreferrer noopener"
href="./resume.pdf"
<h2
class="text-sm font-bold uppercase tracking-widest text-neutral-200 lg:sr-only"
>
<span>
<span
class="border-b border-transparent pb-px transition group-hover:border-neutral-300 motion-reduce:transition-none"
>
View Full
</span>
<span class="whitespace-nowrap">
Experience
</h2>
</div><div>
<ol class="group/list space-y-12">
{EXPERIENCE.map((experience) => <Experience {...experience} />)}
</ol>

<div class="mt-12">
<a
data-ccursor
class="inline-flex items-center leading-tight text-neutral-200 font-semibold group p-2 rounded px-3"
aria-label="View Full Résumé"
target="_blank"
rel="noreferrer noopener"
href="./resume.pdf"
>
<span>
<span
class="border-b border-transparent pb-px transition group-hover:border-neutral-300 motion-reduce:transition-none"
>
Résumé
View Full
</span>
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 20 20"
fill="currentColor"
class="ml-1 inline-block h-4 w-4 shrink-0 -translate-y-px transition-transform group-hover:translate-x-2 group-focus-visible:translate-x-2 motion-reduce:transition-none"
aria-hidden="true"
><path
fill-rule="evenodd"
d="M3 10a.75.75 0 01.75-.75h10.638L10.23 5.29a.75.75 0 111.04-1.08l5.5 5.25a.75.75 0 010 1.08l-5.5 5.25a.75.75 0 11-1.04-1.08l4.158-3.96H3.75A.75.75 0 013 10z"
clip-rule="evenodd"></path></svg
<span class="whitespace-nowrap">
<span
class="border-b border-transparent pb-px transition group-hover:border-neutral-300 motion-reduce:transition-none"
>
Résumé
</span>
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 20 20"
fill="currentColor"
class="ml-1 inline-block h-4 w-4 shrink-0 -translate-y-px transition-transform group-hover:translate-x-2 group-focus-visible:translate-x-2 motion-reduce:transition-none"
aria-hidden="true"
><path
fill-rule="evenodd"
d="M3 10a.75.75 0 01.75-.75h10.638L10.23 5.29a.75.75 0 111.04-1.08l5.5 5.25a.75.75 0 010 1.08l-5.5 5.25a.75.75 0 11-1.04-1.08l4.158-3.96H3.75A.75.75 0 013 10z"
clip-rule="evenodd"></path></svg
></span
></span
></span
></a
>
></a
>
</div>
</div>
</div>
</section>
<footer class="max-w-md pb-16 text-sm text-neutral-500 sm:pb-0">
</footer>
</main>
</section>
<footer class="max-w-md pb-16 text-sm text-neutral-500 sm:pb-0">
</footer>
</main>
</div>
</div>
</div>
</Layout>

<footer class="text-center py-4 text-xs">
{new Date().getFullYear()} All rights reserved.
</footer>
<footer class="text-center py-4 text-xs">
{new Date().getFullYear()} All rights reserved.
</footer>

<style scoped>
@keyframes fadeIn {
0% {
opacity: 0;
<style scoped>
@keyframes fadeIn {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
100% {
opacity: 1;
}
}

.hero {
background-image: url(/moriartyengineering/pattern.svg);
background-position: top center;
background-repeat: no-repeat;
overflow-y: visible;
overflow-x: clip;
}
.hero {
background-image: url(/moriartyengineering/pattern.svg);
background-position: top center;
background-repeat: no-repeat;
overflow-y: visible;
overflow-x: clip;
}

/*
/*
.hero {
animation: fadeIn 3s;
}
*/
</style>
</style>
</Layout>

0 comments on commit 1d97170

Please sign in to comment.