2024-07-20 17:54:35 +00:00
<!DOCTYPE html>
2024-07-21 18:35:21 +00:00
< html lang = "en" class = "min-h-full" >
2024-07-20 21:44:52 +00:00
< 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" >
2024-07-21 03:36:30 +00:00
< title > Klectr | Home< / title >
2024-07-20 17:54:35 +00:00
< script src = "https://cdn.tailwindcss.com" > < / script >
2024-07-20 21:44:52 +00:00
< 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;
}
2024-07-20 23:11:47 +00:00
.gradient {
2024-07-22 04:54:30 +00:00
background: radial-gradient(circle at top right, #33333399 0%, #00000000 30%), radial-gradient(circle at top left, #33333399 0%, #00000000 30%), radial-gradient(circle at bottom, #2b2200 0%, #000 30%);
2024-07-20 23:11:47 +00:00
background-repeat: no-repeat;
}
2024-07-20 23:42:56 +00:00
.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%;
}
2024-07-20 21:44:52 +00:00
< / style >
< / head >
2024-07-20 23:11:47 +00:00
< body class = "bg-black text-white mx-auto max-w-2xl my-6 ubuntu-regular p-4 gradient" >
2024-07-20 21:44:52 +00:00
<!-- ______________________________________________________________ -->
< nav class = "flex justify-between items-center" >
2024-07-20 23:42:56 +00:00
< a href = "" class = "glow" > < img src = "./avatar.png" alt = "avatar" width = {30} height = {30} class = "w-10 h-10" / > < / a >
2024-07-20 21:44:52 +00:00
< div class = "flex gap-6 text-md text-slate-400 " >
2024-07-20 23:42:56 +00:00
< a href = "" class = "hover:text-[#ffce00] border-b border-[#ffce00]" > Home< / a >
< a href = "./about.html" class = "hover:text-[#ffce00]" > About< / a >
2024-07-20 21:44:52 +00:00
< a class = "hover:text-[#ffce00]" > Now< / a >
< a class = "hover:text-[#ffce00]" > Featured< / a >
< / div >
2024-07-20 21:50:26 +00:00
< 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 >
2024-07-20 21:44:52 +00:00
< / nav >
<!-- ______________________________________________________________ -->
< main class = "mt-20" >
< h1 class = "text-2xl font-bold" > Triston Armstrong< / h1 >
< p class = "text-slate-400" > Senior Software Engineer< / p >
< div class = "my-6 flex gap-6 " >
< img src = "./avatar.png" alt = "avatar" width = {20} height = {20} class = "w-40 h-40" / >
< div class = "flex flex-col text-slate-400 gap-2 hover:text-slate-600" >
2024-07-20 23:58:08 +00:00
< a href = "https://git.tristonarmstrong.com" class = "flex gap-2 hover:text-[#ffce00]" target = "_blank" >
2024-07-20 21:44:52 +00:00
< 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="lucide lucide-github">
< path
d="M15 22v-4a4.8 4.8 0 0 0-1-3.5c3 0 6-2 6-5.5.08-1.25-.27-2.48-1-3.5.28-1.15.28-2.35 0-3.5 0 0-1 0-3 1.5-2.64-.5-5.36-.5-8 0C6 2 5 2 5 2c-.3 1.15-.3 2.35 0 3.5A5.403 5.403 0 0 0 4 9c0 3.5 3 5.5 6 5.5-.39.49-.68 1.05-.85 1.65-.17.6-.22 1.23-.15 1.85v4" />
< path d = "M9 18c-4.51 2-5-2-7-2" / >
< / svg >
< p > Projects< / p >
2024-07-20 23:58:08 +00:00
< / a >
2024-07-20 21:44:52 +00:00
< div class = "flex gap-2 hover:text-[#ffce00]" >
2024-07-21 18:35:21 +00:00
< 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"
stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
class="lucide lucide-twitter">
< 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 >
< p > Twitter< / p >
< / a >
2024-07-20 21:44:52 +00:00
< / div >
< div class = "flex gap-2 hover:text-[#ffce00]" >
2024-07-21 18:35:21 +00:00
< 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"
stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
class="lucide lucide-linkedin">
< 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 >
< p > LinkedIn< / p >
< / a >
2024-07-20 21:44:52 +00:00
< / div >
< / div >
< / div >
2024-07-21 03:36:30 +00:00
< div class = "text-slate-200" >
2024-07-20 21:44:52 +00:00
< p > Software engineer & entrepreneur, building innovative utility apps under my organization Klectr. Focused on
creating tools that simplify daily life.< / p >
< br >
< p > With expertise in TypeScript, Rust, and Python, I continuously improve skills and tackle new challenges.
Passionate about gaming, family, and tech adventures.< / p >
< br >
< p > Striving to deliver high-quality work and build meaningful relationships, I bring dedication, creativity, and
reliability to all aspects of my life.< / p >
< br >
2024-07-21 03:36:30 +00:00
< 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 >
2024-07-20 21:44:52 +00:00
< / div >
< / main >
<!-- ______________________________________________________________ -->
< footer class = "flex gap-2 mt-6 text-slate-400 hover:text-slate-600" >
2024-07-21 18:35:21 +00:00
< a href = "https://books.tristonarmstrong.com" class = "flex gap-1 items-center hover:text-[#ffce00]" > < 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="lucide lucide-arrow-up-right">
2024-07-20 21:44:52 +00:00
< path d = "M7 7h10v10" / >
< path d = "M7 17 17 7" / >
2024-07-20 23:58:08 +00:00
< / svg > Books< / a >
2024-07-21 18:35:21 +00:00
< a href = "https://blog.tristonarmstrong.com" class = "flex gap-1 items-center hover:text-[#ffce00]" > < 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="lucide lucide-arrow-up-right">
2024-07-20 21:44:52 +00:00
< path d = "M7 7h10v10" / >
< path d = "M7 17 17 7" / >
< / svg > Blog< / a >
2024-07-21 18:35:21 +00:00
< a href = "./about.html" class = "flex gap-1 items-center hover:text-[#ffce00]" > < 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="lucide lucide-arrow-up-right">
2024-07-20 21:44:52 +00:00
< path d = "M7 7h10v10" / >
< path d = "M7 17 17 7" / >
< / svg > About Me< / a >
< / footer >
2024-07-20 23:11:47 +00:00
2024-07-20 21:44:52 +00:00
< / body >
2024-07-20 17:54:35 +00:00
< / html >