hero animation and daisyUI fix, adding cv, improvements
This commit is contained in:
parent
9ff7e8c734
commit
b219773768
|
@ -0,0 +1,106 @@
|
||||||
|
<script lang="ts">
|
||||||
|
import QuickLinks from '$lib/components/home/QuickLinks.svelte';
|
||||||
|
import { social } from '$lib/config/site';
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<section class="grid grid-cols-1 lg:grid-cols-2 items-center mx-4">
|
||||||
|
<!-- Text and links-->
|
||||||
|
<div class="order-1 max-w-3/4 space-y-8">
|
||||||
|
<h1 class="text-4xl">Hello, I'm Matt.</h1>
|
||||||
|
|
||||||
|
<p class="text-xl opacity-75">
|
||||||
|
A 🧠 that consumes ⚡️ and produces 👾 bug$... No sorry, produces code that works 100%
|
||||||
|
of the time. Really.
|
||||||
|
|
||||||
|
<br /> Usually, this creature you are reading about exhibits "passion" for innovation
|
||||||
|
and change. It gets dopamine and reward stimuli from solving problems ~~~ the "Ahaa"
|
||||||
|
moments ~~~ <br />although the 👾 bugs produce different emotions sometimes.
|
||||||
|
|
||||||
|
<br />Matt's main professional exploits are:
|
||||||
|
<br /><br /><span
|
||||||
|
class=" text-4xl bg-gradient-to-r from-primary via-secondary to-accent dark:from-primary dark:via-secondary dark:to-accent text-transparent bg-clip-text"
|
||||||
|
>DevOps, Web, AI & IoT</span
|
||||||
|
>
|
||||||
|
</p>
|
||||||
|
<QuickLinks />
|
||||||
|
</div>
|
||||||
|
<!-- Logo and buttons-->
|
||||||
|
<div class="order-2 hidden lg:block">
|
||||||
|
<figure class="items-center flex flex-relative flex-col">
|
||||||
|
<div class="relative">
|
||||||
|
<div class="img-bg"></div>
|
||||||
|
<img
|
||||||
|
class="mask mask-squircle w-64 overflow-hidden"
|
||||||
|
src="/assets/maskable@512.png"
|
||||||
|
alt="Profile"
|
||||||
|
/>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</figure>
|
||||||
|
|
||||||
|
<div class="flex justify-center space-x-2 m-4">
|
||||||
|
<a
|
||||||
|
class="btn btn-accent z-10"
|
||||||
|
href={social.Gitea}
|
||||||
|
target="_blank"
|
||||||
|
rel="personal"
|
||||||
|
>
|
||||||
|
Look at my code
|
||||||
|
</a>
|
||||||
|
<a
|
||||||
|
class="btn btn-accent z-10"
|
||||||
|
href="https://git.mattmor.in/Madmin/Academic-cv/src/branch/master/matt_morin_cv_academic.pdf"
|
||||||
|
target="_blank"
|
||||||
|
rel="cv"
|
||||||
|
>
|
||||||
|
Download my CV
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="order-2 flex justify-center lg:hidden space-x-2 m-4">
|
||||||
|
<a
|
||||||
|
class="btn btn-primary"
|
||||||
|
href={social.Gitea}
|
||||||
|
target="_blank"
|
||||||
|
rel="personal-mob"
|
||||||
|
>
|
||||||
|
Look at my code
|
||||||
|
</a>
|
||||||
|
<a
|
||||||
|
class="btn btn-primary"
|
||||||
|
href="https://git.mattmor.in/Madmin/Academic-cv/src/branch/master/matt_morin_cv_academic.pdf"
|
||||||
|
target="_blank"
|
||||||
|
rel="cv-mob"
|
||||||
|
>
|
||||||
|
Download my CV
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<style lang="postcss">
|
||||||
|
.img-bg {
|
||||||
|
@apply absolute inset-0 z-0 rounded-full blur-[100px] transition-all;
|
||||||
|
animation:
|
||||||
|
pulse 5s cubic-bezier(0, 0.3, 1, 1) infinite,
|
||||||
|
glow 5s linear infinite;
|
||||||
|
}
|
||||||
|
@keyframes glow {
|
||||||
|
0% {
|
||||||
|
@apply bg-primary;
|
||||||
|
}
|
||||||
|
33% {
|
||||||
|
@apply bg-secondary;
|
||||||
|
}
|
||||||
|
66% {
|
||||||
|
@apply bg-accent;
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
@apply bg-primary;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@keyframes pulse {
|
||||||
|
50% {
|
||||||
|
transform: scale(1.5);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
Loading…
Reference in New Issue