update copy and add img tags with images

This commit is contained in:
Triston Armstrong 2024-07-21 13:35:21 -05:00
parent 9c6547497a
commit fd89d842a2
No known key found for this signature in database
GPG Key ID: FADE6AC6F956FC52
2 changed files with 128 additions and 46 deletions

View File

@ -1,5 +1,5 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en" class="h-full"> <html lang="en" class="min-h-full">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
@ -13,6 +13,7 @@
<script src="https://cdn.tailwindcss.com"></script> <script src="https://cdn.tailwindcss.com"></script>
<style> <style>
@import url('https://fonts.googleapis.com/css2?family=Ubuntu:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500;1,700&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Ubuntu:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500;1,700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Long+Cang&display=swap');
.ubuntu-regular { .ubuntu-regular {
font-family: "Ubuntu", sans-serif; font-family: "Ubuntu", sans-serif;
@ -32,6 +33,12 @@
font-style: italic; font-style: italic;
} }
.long-cang-regular {
font-family: "Long Cang", cursive;
font-weight: 400;
font-style: normal;
}
.gradient { .gradient {
background: radial-gradient(circle at top right, #333 0%, #000 50%); background: radial-gradient(circle at top right, #333 0%, #000 50%);
background-repeat: no-repeat; background-repeat: no-repeat;
@ -98,14 +105,80 @@
<p class="text-slate-400">Thanks for stopping by! Here's a bit about me.</p> <p class="text-slate-400">Thanks for stopping by! Here's a bit about me.</p>
<div class="my-6 flex flex-col gap-6 "> <div class="my-6 flex flex-col gap-6 ">
<p>As a friendly and understanding software engineer, I bring a unique blend of technical expertise, <p>Hello 👋, I'm a Software Engineer with a passion for <span
problem-solving enthusiasm, and debugging skills to my work. With a passion for building innovative class="font-bold bg-clip-text text-transparent bg-gradient-to-r from-[#ffce00] to-red-500">Rust</span> and
solutions that make a difference, I've had the privilege of working on various projects across Open-Source Software. With a knack for
industries.</p> problem solving, I balance code with exploration and find peace in a cup of hot coffee next to an open fire!</p>
<p>My journey in software development began with a curiosity about how things worked behind the <p>My journey in software development began with a curiosity about how things worked behind the
scenes. This led me to explore different areas, from IoT software to revenue cycle management, and scenes, on the web. This led me to working with various companies across
industries from IoT software to revenue cycle management, and
even dabbling in enterprise-level projects. Through these experiences, I've developed a strong even dabbling in enterprise-level projects. Through these experiences, I've developed a strong
foundation in debugging, troubleshooting, and finding creative solutions to complex problems.</p> foundation in debugging, troubleshooting, and finding creative solutions to complex problems.</p>
<div class="flex gap-8 items-center my-4 relative">
<img src="./me_1.webp" alt="me" class="w-80 rounded-lg rotate-[-12deg] hover:rotate-[0deg]">
<img src="./fam_1.jpeg" alt="family" class="w-72 h-auto rounded-lg rotate-[12deg] hover:rotate-[0deg]">
<p class="absolute top-[-30px] right-[-280px] w-60 long-cang-regular text-xl">My family and I often travel to
and from
Thailand, as we have
familiy
there!
</p>
<p class="absolute top-0 left-[-230px] w-60 long-cang-regular text-3xl">Me!</p>
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 79.98231602779492 100.40624372175893"
width="159.96463205558985" height="200.81248744351785" class="absolute right-[-280px] top-8 rotate-[20deg]">
<rect x="0" y="0" width="79.98231602779492" height="100.40624372175893" fill="#0000"></rect>
<g stroke-linecap="round">
<g transform="translate(33.9592080799398 10.67947049140929) rotate(0 6.5 39.5)">
<path
d="M1.11 -0.68 C6.88 6.16, 39.72 27.88, 35.68 41.1 C31.64 54.31, -13.43 72.39, -23.13 78.61 M0.23 1.58 C5.73 8.63, 38.6 29.66, 34.56 42.68 C30.53 55.71, -14.53 73.63, -23.96 79.73"
stroke="#fff" stroke-width="1" fill="none"></path>
</g>
<g transform="translate(33.9592080799398 10.67947049140929) rotate(0 6.5 39.5)">
<path
d="M-6.96 61.39 C-14.64 68.08, -19.9 75.47, -23.96 79.73 M-6.96 61.39 C-10.84 66.87, -15.74 70.67, -23.96 79.73"
stroke="#fff" stroke-width="1" fill="none"></path>
</g>
<g transform="translate(33.9592080799398 10.67947049140929) rotate(0 6.5 39.5)">
<path
d="M0.85 76.61 C-9.84 77.51, -18.11 79.03, -23.96 79.73 M0.85 76.61 C-5.18 77.98, -12.18 77.71, -23.96 79.73"
stroke="#fff" stroke-width="1" fill="none"></path>
</g>
</g>
<mask></mask>
</svg>
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 79.98231602779492 100.40624372175893"
width="159.96463205558985" height="200.81248744351785"
class="absolute left-[-280px] top-8 rotate-[-20deg] scale-x-[-1]">
<rect x="0" y="0" width="79.98231602779492" height="100.40624372175893" fill="#0000"></rect>
<g stroke-linecap="round">
<g transform="translate(33.9592080799398 10.67947049140929) rotate(0 6.5 39.5)">
<path
d="M1.11 -0.68 C6.88 6.16, 39.72 27.88, 35.68 41.1 C31.64 54.31, -13.43 72.39, -23.13 78.61 M0.23 1.58 C5.73 8.63, 38.6 29.66, 34.56 42.68 C30.53 55.71, -14.53 73.63, -23.96 79.73"
stroke="#fff" stroke-width="1" fill="none"></path>
</g>
<g transform="translate(33.9592080799398 10.67947049140929) rotate(0 6.5 39.5)">
<path
d="M-6.96 61.39 C-14.64 68.08, -19.9 75.47, -23.96 79.73 M-6.96 61.39 C-10.84 66.87, -15.74 70.67, -23.96 79.73"
stroke="#fff" stroke-width="1" fill="none"></path>
</g>
<g transform="translate(33.9592080799398 10.67947049140929) rotate(0 6.5 39.5)">
<path
d="M0.85 76.61 C-9.84 77.51, -18.11 79.03, -23.96 79.73 M0.85 76.61 C-5.18 77.98, -12.18 77.71, -23.96 79.73"
stroke="#fff" stroke-width="1" fill="none"></path>
</g>
</g>
<mask></mask>
</svg>
</div>
<p>I bring a unique blend of technical expertise,
problem-solving enthusiasm, and debugging skills to my work, with a passion for building innovative
solutions that make a difference. </p>
<p>What sets me apart is my ability to approach challenges with a humble mindset, recognizing that <p>What sets me apart is my ability to approach challenges with a humble mindset, recognizing that
everyone makes mistakes and learning from those experiences. This has helped me grow as an engineer everyone makes mistakes and learning from those experiences. This has helped me grow as an engineer
and become more effective in my work. When I'm not coding, you can find me spending time with and become more effective in my work. When I'm not coding, you can find me spending time with
@ -118,7 +191,8 @@
<div class="flex gap-4 justify-between"> <div class="flex gap-4 justify-between">
<h2 class="text-lg text-slate-400 flex-1">Work</h2> <h2 class="text-lg text-slate-400 flex-1">Work</h2>
<div class="flex flex-col gap-4 flex-[4]"> <div class="flex flex-col gap-4 flex-[4]">
<p>My Tech toolbox includes Node.js, Rust, REST, React, and much more - but my true love? Open Source Software! <p>My Tech toolbox includes anything related to Typescript, Rust, and Python - but my true love? Open Source
Software!
</p> </p>
<div class="flex flex-col gap-2"> <div class="flex flex-col gap-2">
@ -135,35 +209,35 @@
<div class="flex gap-2 justify-between"> <div class="flex gap-2 justify-between">
<div class="flex gap-2"> <div class="flex gap-2">
<img src="./vh_logo.png" alt="ventra health" height={50} width={50} class="w-10 h-10" /> <img src="./randstad.png" alt="ventra health" height={50} width={50} class="w-10 h-10 rounded-full" />
<div> <div>
<h3>Software Developer</h3> <h3>Software Developer</h3>
<p class="text-slate-400">Randstad Technologies</p> <p class="text-slate-400">Randstad Technologies</p>
</div> </div>
</div> </div>
<p class="text-slate-400">Aug 2023 - Present</p> <p class="text-slate-400">In The Past</p>
</div> </div>
<div class="flex gap-2 justify-between"> <div class="flex gap-2 justify-between">
<div class="flex gap-2"> <div class="flex gap-2">
<img src="./vh_logo.png" alt="ventra health" height={50} width={50} class="w-10 h-10" /> <img src="./dgnet.webp" alt="ventra health" height={50} width={50} class="w-10 h-10 rounded-full" />
<div> <div>
<h3>Senior Software Architect</h3> <h3>Senior Software Architect</h3>
<p class="text-slate-400">Damiano Global Corp.</p> <p class="text-slate-400">Damiano Global Corp.</p>
</div> </div>
</div> </div>
<p class="text-slate-400">Aug 2023 - Present</p> <p class="text-slate-400">In The Past</p>
</div> </div>
<div class="flex gap-2 justify-between"> <div class="flex gap-2 justify-between">
<div class="flex gap-2"> <div class="flex gap-2">
<img src="./vh_logo.png" alt="ventra health" height={50} width={50} class="w-10 h-10" /> <img src="./makers.png" alt="ventra health" height={50} width={50} class="w-10 h-10 rounded-full" />
<div> <div>
<h3>FullStack Software Developer</h3> <h3>FullStack Software Developer</h3>
<p class="text-slate-400">Makers Ladder LLC</p> <p class="text-slate-400">Makers Ladder LLC</p>
</div> </div>
</div> </div>
<p class="text-slate-400">Aug 2023 - Present</p> <p class="text-slate-400">In The Past</p>
</div> </div>
</div> </div>
</div> </div>
@ -175,12 +249,14 @@
<div class="flex gap-4 justify-between"> <div class="flex gap-4 justify-between">
<h2 class="text-lg text-slate-400 flex-1">Connect</h2> <h2 class="text-lg text-slate-400 flex-1">Connect</h2>
<div class="flex flex-col gap-4 flex-[4]"> <div class="flex flex-col gap-4 flex-[4]">
<p>Come find me on Twitter and LinkedIn - I'm excited to connect! If you're curious about my thoughts, swing by <p>Come find me on Twitter and LinkedIn - I'm excited to connect! If you're curious about my thoughts, swing
my blog <a href="#">blog.tristonarmstrong.com</a>.</p> by
my blog <a class="font-bold bg-clip-text text-transparent bg-gradient-to-r from-[#ffce00] to-red-500"
href="#">blog.tristonarmstrong.com</a>.</p>
<div class="flex flex-col gap-2 hover:text-slate-400 hover:border-slate-400"> <div class="flex flex-col gap-2 hover:text-slate-400 hover:border-slate-400">
<div class="flex gap-2 border-inherit"> <div class="flex gap-2 border-inherit">
<!-- REPOSITORIES --> <!-- REPOSITORIES -->
<a href="#" class="flex-1 border-inherit"> <a href="https://git.tristonarmstrong.com" target="_blank" class="flex-1 border-inherit">
<div <div
class="flex border p-2 rounded-xl justify-between items-center py-3 border-inherit hover:border-slate-100"> class="flex border p-2 rounded-xl justify-between items-center py-3 border-inherit hover:border-slate-100">
<div class="flex gap-3 text-sm items-center"> <div class="flex gap-3 text-sm items-center">
@ -202,7 +278,7 @@
</a> </a>
<!-- TWITTER --> <!-- TWITTER -->
<a href="#" class="flex-1 border-inherit"> <a href="https://x.com/triston_armstr" target="_blank" class="flex-1 border-inherit">
<div <div
class="flex border p-2 rounded-xl justify-between items-center py-3 border-inherit hover:border-slate-100"> class="flex border p-2 rounded-xl justify-between items-center py-3 border-inherit hover:border-slate-100">
<div class="flex gap-3 text-sm items-center"> <div class="flex gap-3 text-sm items-center">
@ -225,15 +301,16 @@
<div class="flex gap-2 border-inherit"> <div class="flex gap-2 border-inherit">
<!-- LINKED IN --> <!-- LINKED IN -->
<a href="#" class="flex-1 border-inherit"> <a href="https://www.linkedin.com/in/triston95strong/" target="_blank" class="flex-1 border-inherit">
<div <div
class="flex border p-2 rounded-xl justify-between items-center py-3 border-inherit hover:border-slate-100"> class="flex border p-2 rounded-xl justify-between items-center py-3 border-inherit hover:border-slate-100">
<div class="flex gap-3 text-sm items-center"> <div class="flex gap-3 text-sm items-center">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
class="w-4 h-4"> class="w-4 h-4">
<path <path d="M16 8a6 6 0 0 1 6 6v7h-4v-7a2 2 0 0 0-2-2 2 2 0 0 0-2 2v7h-4v-7a6 6 0 0 1 6-6z" />
d="M22 4s-.7 2.1-2 3.4c1.6 10-9.4 17.3-18 11.6 2.2.1 4.4-.6 6-2C3 15.5.5 9.6 3 5c2.2 2.6 5.6 4.1 9 4-.9-4.2 4-6.6 7-3.8 1.1 0 3-1.2 3-1.2z" /> <rect width="4" height="12" x="2" y="9" />
<circle cx="4" cy="4" r="2" />
</svg> </svg>
LinkedIn LinkedIn
</div> </div>
@ -246,7 +323,7 @@
</a> </a>
<!-- INSTAGRAM --> <!-- INSTAGRAM -->
<a href="#" class="flex-1 border-inherit"> <a href="https://www.instagram.com/triston.armstrong/" target="_blank" class="flex-1 border-inherit">
<div <div
class="flex border p-2 rounded-xl justify-between items-center py-3 border-inherit hover:border-slate-100"> class="flex border p-2 rounded-xl justify-between items-center py-3 border-inherit hover:border-slate-100">
<div class="flex gap-3 text-sm items-center"> <div class="flex gap-3 text-sm items-center">

View File

@ -1,5 +1,5 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en" class="h-full"> <html lang="en" class="min-h-full">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
@ -111,6 +111,7 @@
<p>Projects</p> <p>Projects</p>
</a> </a>
<div class="flex gap-2 hover:text-[#ffce00]"> <div class="flex gap-2 hover:text-[#ffce00]">
<a href="https://x.com/triston_armstr" class="flex gap-2 hover:text-[#ffce00]" target="_blank">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
class="lucide lucide-twitter"> class="lucide lucide-twitter">
@ -118,8 +119,11 @@
d="M22 4s-.7 2.1-2 3.4c1.6 10-9.4 17.3-18 11.6 2.2.1 4.4-.6 6-2C3 15.5.5 9.6 3 5c2.2 2.6 5.6 4.1 9 4-.9-4.2 4-6.6 7-3.8 1.1 0 3-1.2 3-1.2z" /> d="M22 4s-.7 2.1-2 3.4c1.6 10-9.4 17.3-18 11.6 2.2.1 4.4-.6 6-2C3 15.5.5 9.6 3 5c2.2 2.6 5.6 4.1 9 4-.9-4.2 4-6.6 7-3.8 1.1 0 3-1.2 3-1.2z" />
</svg> </svg>
<p>Twitter</p> <p>Twitter</p>
</a>
</div> </div>
<div class="flex gap-2 hover:text-[#ffce00]"> <div class="flex gap-2 hover:text-[#ffce00]">
<a href="https://www.linkedin.com/in/triston95strong/" class="flex gap-2 hover:text-[#ffce00]"
target="_blank">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
class="lucide lucide-linkedin"> class="lucide lucide-linkedin">
@ -128,6 +132,7 @@
<circle cx="4" cy="4" r="2" /> <circle cx="4" cy="4" r="2" />
</svg> </svg>
<p>LinkedIn</p> <p>LinkedIn</p>
</a>
</div> </div>
</div> </div>
</div> </div>
@ -151,21 +156,21 @@
<!-- ______________________________________________________________ --> <!-- ______________________________________________________________ -->
<footer class="flex gap-2 mt-6 text-slate-400 hover:text-slate-600"> <footer class="flex gap-2 mt-6 text-slate-400 hover:text-slate-600">
<a class="flex gap-1 items-center hover:text-[#ffce00]"><svg xmlns="http://www.w3.org/2000/svg" width="18" <a href="https://books.tristonarmstrong.com" class="flex gap-1 items-center hover:text-[#ffce00]"><svg
height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor"
stroke-linejoin="round" class="lucide lucide-arrow-up-right"> stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-arrow-up-right">
<path d="M7 7h10v10" /> <path d="M7 7h10v10" />
<path d="M7 17 17 7" /> <path d="M7 17 17 7" />
</svg>Books</a> </svg>Books</a>
<a class="flex gap-1 items-center hover:text-[#ffce00]"><svg xmlns="http://www.w3.org/2000/svg" width="18" <a href="https://blog.tristonarmstrong.com" class="flex gap-1 items-center hover:text-[#ffce00]"><svg
height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor"
stroke-linejoin="round" class="lucide lucide-arrow-up-right"> stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-arrow-up-right">
<path d="M7 7h10v10" /> <path d="M7 7h10v10" />
<path d="M7 17 17 7" /> <path d="M7 17 17 7" />
</svg> Blog</a> </svg> Blog</a>
<a class="flex gap-1 items-center hover:text-[#ffce00]"><svg xmlns="http://www.w3.org/2000/svg" width="18" <a href="./about.html" class="flex gap-1 items-center hover:text-[#ffce00]"><svg xmlns="http://www.w3.org/2000/svg"
height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
stroke-linejoin="round" class="lucide lucide-arrow-up-right"> stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-arrow-up-right">
<path d="M7 7h10v10" /> <path d="M7 7h10v10" />
<path d="M7 17 17 7" /> <path d="M7 17 17 7" />
</svg> About Me</a> </svg> About Me</a>