portfolio/about.html
2024-07-23 21:54:36 -05:00

305 lines
15 KiB
HTML

<!DOCTYPE html>
<html lang="en" class="min-h-full overflow-x-hidden">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="apple-touch-icon" sizes="180x180" href="./apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="./favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="./favicon-16x16.png">
<link rel="manifest" href="./site.webmanifest">
<link rel="stylesheet" href="cum.css">
<title>Klectr | About Me</title>
<script src="https://cdn.tailwindcss.com"></script>
</head>
<body class="bg-black text-white mx-auto max-w-2xl my-6 ubuntu-regular p-4 gradient">
<!-- ______________________________________________________________ -->
<nav class="flex justify-between items-center">
<a href="" class="glow"><img src="./avatar.png" alt="avatar" width={30} height={30} class="w-10 h-10" /></a>
<div class="flex gap-6 text-md text-slate-400 ">
<a href="./index.html" class="hover:text-[#ffce00]">Home</a>
<a href="./about.html" class="hover:text-[#ffce00] border-b border-[#ffce00]">About</a>
<a href="./now.html" class="hover:text-[#ffce00]">Now</a>
<a class="hover:text-[#ffce00]">Featured</a>
</div>
<a href="mailto:tarmstrong95@proton.me">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none"
stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
class="lucide lucide-mail text-slate-400 hover:text-[#ffce00]">
<rect width="20" height="16" x="2" y="4" rx="2" />
<path d="m22 7-8.97 5.7a1.94 1.94 0 0 1-2.06 0L2 7" />
</svg>
</a>
</nav>
<!-- ______________________________________________________________ -->
<main class="mt-20 text-slate-200">
<h1 class="text-2xl font-bold text-white">About</h1>
<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 ">
<p>Hello 👋, I'm a Software Engineer with a passion for <span
class="font-bold bg-clip-text text-transparent bg-gradient-to-r from-[#ffce00] to-red-500">Rust</span> and
<span class="font-bold bg-clip-text text-transparent bg-gradient-to-r from-[#ffce00] to-red-500">Open-Source
Software</span>. With a knack for
problem solving, I balance code with exploration and find peace in a cup of hot ☕ next to an open 🔥!
</p>
<p>My journey in software development began with a curiosity about how things worked "behind the
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
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="rounded-lg rotate-[-12deg] hover:rotate-[0deg] w-40 md:w-60 lg:w-72 ml-auto transition-transform">
<img src="./fam_1.jpeg" alt="family"
class=" h-auto rounded-lg rotate-[12deg] hover:rotate-[0deg] w-40 md:w-60 lg:w-72 mr-auto transition-transform">
<p class="absolute top-[-30px] right-[-280px] w-60 long-cang-regular text-xl hidden lg:block">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 hidden lg:block">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] hidden lg:block">
<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] hidden lg:block">
<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
everyone makes mistakes and learning from those experiences. This has helped me grow as an engineer
and become more effective in my work.</p>
<p>
<a href="https://github.com/tristonarmstrong" target="_blank"> <img
src="https://img.shields.io/github/followers/tristonarmstrong.svg?label=Follow%20@tristonarmstrong&amp;style=social"
alt="GitHub Followers | @tristonarmstrong"> </a>
</p>
<p>When I'm not coding, you can find me spending time with
family or exploring new ideas and technologies.</p>
</div>
<br>
<br>
<div class="flex flex-col gap-4 justify-between sm:flex-row">
<h2 class="text-lg text-slate-400 flex-1">Work</h2>
<div class="flex flex-col gap-4 flex-[4]">
<p>My Tech toolbox includes anything related to Typescript, Rust, and Python - but my true love? Open Source
Software!
</p>
<div class="flex flex-col gap-2">
<div class="flex gap-2 justify-between">
<div class="flex gap-2">
<img src="./vh_logo.png" alt="ventra health" height={50} width={50} class="w-10 h-10 hover:opacity-100" />
<div>
<h3>Senior Software Engineer</h3>
<p class="text-slate-400">Ventra Health</p>
</div>
</div>
<p class="text-slate-400">Aug 2023 - Present</p>
</div>
<div class="flex gap-2 justify-between">
<div class="flex gap-2">
<img src="./randstad.png" alt="ventra health" height={50} width={50} class="w-10 h-10 rounded-full" />
<div>
<h3>Software Developer</h3>
<p class="text-slate-400">Randstad Technologies</p>
</div>
</div>
<p class="text-slate-400">In The Past</p>
</div>
<div class="flex gap-2 justify-between">
<div class="flex gap-2">
<img src="./dgnet.webp" alt="ventra health" height={50} width={50} class="w-10 h-10 rounded-full" />
<div>
<h3>Senior Software Architect</h3>
<p class="text-slate-400">Damiano Global Corp.</p>
</div>
</div>
<p class="text-slate-400">In The Past</p>
</div>
<div class="flex gap-2 justify-between">
<div class="flex gap-2">
<img src="./makers.png" alt="ventra health" height={50} width={50} class="w-10 h-10 rounded-full" />
<div>
<h3>FullStack Software Developer</h3>
<p class="text-slate-400">Makers Ladder LLC</p>
</div>
</div>
<p class="text-slate-400">In The Past</p>
</div>
</div>
</div>
</div>
<br>
<br>
<div class="flex flex-col gap-4 justify-between sm:flex-row">
<h2 class="text-lg text-slate-400 flex-1">Connect</h2>
<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
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 gap-2 border-inherit">
<!-- REPOSITORIES -->
<a href="https://git.tristonarmstrong.com" target="_blank" class="flex-1 border-inherit">
<div
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">
<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"
class="w-4 h-4">
<circle cx="18" cy="18" r="3" />
<circle cx="6" cy="6" r="3" />
<path d="M6 21V9a9 9 0 0 0 9 9" />
</svg>
Repositories
</div>
<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none"
stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="w-4 h-4">
<path d="M7 7h10v10" />
<path d="M7 17 17 7" />
</svg>
</div>
</a>
<!-- TWITTER -->
<a href="https://x.com/triston_armstr" target="_blank" class="flex-1 border-inherit">
<div
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">
<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"
class="w-4 h-4">
<path
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>
Twitter
</div>
<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none"
stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="w-4 h-4">
<path d="M7 7h10v10" />
<path d="M7 17 17 7" />
</svg>
</div>
</a>
</div>
<div class="flex gap-2 border-inherit">
<!-- LINKED IN -->
<a href="https://www.linkedin.com/in/triston95strong/" target="_blank" class="flex-1 border-inherit">
<div
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">
<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"
class="w-4 h-4">
<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" />
<rect width="4" height="12" x="2" y="9" />
<circle cx="4" cy="4" r="2" />
</svg>
LinkedIn
</div>
<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none"
stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="w-4 h-4">
<path d="M7 7h10v10" />
<path d="M7 17 17 7" />
</svg>
</div>
</a>
<!-- INSTAGRAM -->
<a href="https://www.instagram.com/triston.armstrong/" target="_blank" class="flex-1 border-inherit">
<div
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">
<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"
class="w-4 h-4">
<rect width="20" height="20" x="2" y="2" rx="5" ry="5" />
<path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z" />
<line x1="17.5" x2="17.51" y1="6.5" y2="6.5" />
</svg>
Instagram
</div>
<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none"
stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="w-4 h-4">
<path d="M7 7h10v10" />
<path d="M7 17 17 7" />
</svg>
</div>
</a>
</div>
</div>
</div>
</div>
</main>
</body>
</html>