tristonarmstrong/portfolio
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update about me page

Browse Source
This commit is contained in:
Triston Armstrong 2024-07-20 22:36:30 -05:00
parent 10584326f5
commit 9c6547497a
No known key found for this signature in database
GPG Key ID: FADE6AC6F956FC52
3 changed files with 282 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

277
about.html Normal file
View File

@ -0,0 +1,277 @@
<!DOCTYPE html>
<html lang="en" class="h-full">
<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">
<title>Klectr | About Me</title>
<script src="https://cdn.tailwindcss.com"></script>
<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');
.ubuntu-regular {
font-family: "Ubuntu", sans-serif;
font-weight: 400;
font-style: normal;
}
.ubuntu-bold {
font-family: "Ubuntu", sans-serif;
font-weight: 700;
font-style: normal;
}
.ubuntu-regular-italic {
font-family: "Ubuntu", sans-serif;
font-weight: 400;
font-style: italic;
}
.gradient {
background: radial-gradient(circle at top right, #333 0%, #000 50%);
background-repeat: no-repeat;
}
.glow {
position: relative;
}
.glow::before {
position: absolute;
content: 'banana';
background-color: #ffce00;
width: 0px;
height: 0px;
filter: blur(30px);
z-index: -1;
top: -6px;
left: -4px;
border-radius: 50%;
transition: all 0.5s;
}
.glow:hover::before {
position: absolute;
content: 'banana';
background-color: #ffce00;
width: 40px;
height: 40px;
filter: blur(30px);
z-index: -1;
top: -6px;
left: -4px;
border-radius: 50%;
}
</style>
</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 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>As a friendly and understanding software engineer, 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, I've had the privilege of working on various projects across
industries.</p>
<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
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>
<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. 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 gap-4 justify-between">
<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 Node.js, Rust, REST, React, and much more - 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="./vh_logo.png" alt="ventra health" height={50} width={50} class="w-10 h-10" />
<div>
<h3>Software Developer</h3>
<p class="text-slate-400">Randstad Technologies</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="./vh_logo.png" alt="ventra health" height={50} width={50} class="w-10 h-10" />
<div>
<h3>Senior Software Architect</h3>
<p class="text-slate-400">Damiano Global Corp.</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="./vh_logo.png" alt="ventra health" height={50} width={50} class="w-10 h-10" />
<div>
<h3>FullStack Software Developer</h3>
<p class="text-slate-400">Makers Ladder LLC</p>
</div>
</div>
<p class="text-slate-400">Aug 2023 - Present</p>
</div>
</div>
</div>
</div>
<br>
<br>
<div class="flex gap-4 justify-between">
<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 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="#" 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="#" 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="#" 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>
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="#" 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>

8
index.html
View File

@ -9,7 +9,7 @@
<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">
<title>Klectr Site</title>
<title>Klectr | Home</title>
<script src="https://cdn.tailwindcss.com"></script>
<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');
@ -132,7 +132,7 @@
</div>
</div>
<div class="text-slate-300">
<div class="text-slate-200">
<p>Software engineer & entrepreneur, building innovative utility apps under my organization Klectr. Focused on
creating tools that simplify daily life.</p>
<br>
@ -143,7 +143,9 @@
reliability to all aspects of my life.</p>
<br>
<p>In a nutshell, ☕️ + 👨🏻‍💻 + 🪵 = @tristonarmstrong</p>
<p>In a nutshell, ☕️ + 👨🏻‍💻 + 🪵 = <a href="https://tristonarmstrong.com/about.html"
class="font-bold bg-clip-text text-transparent bg-gradient-to-r from-[#ffce00] to-red-500">@tristonarmstrong<a />
</p>
</div>
</main>

BIN
vh_logo.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 11 KiB