141 lines
6.1 KiB
HTML
141 lines
6.1 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<meta name="theme-color" content="#000000" />
|
|
<meta name="apple-mobile-web-app-title" content="Jet Pham" />
|
|
<title>Jet Pham - Software Extremist</title>
|
|
<meta name="description" content="Jet Pham's personal website. Software extremist." />
|
|
<link rel="canonical" href="https://jetpham.com/" />
|
|
<link rel="manifest" href="/manifest.json" />
|
|
<link rel="icon" href="/favicon.ico" />
|
|
<link rel="apple-touch-icon" href="/apple-icon.png" />
|
|
<link rel="preload" href="/Web437_IBM_VGA_8x16.woff" as="font" type="font/woff" crossorigin />
|
|
<meta property="og:title" content="Jet Pham - Software Extremist" />
|
|
<meta property="og:description" content="Jet Pham's personal website. Software extremist." />
|
|
<meta property="og:type" content="website" />
|
|
<meta property="og:url" content="https://jetpham.com/" />
|
|
<meta property="og:site_name" content="Jet Pham" />
|
|
<meta property="og:image" content="https://jetpham.com/web-app-manifest-512x512.png" />
|
|
<meta property="og:image:width" content="512" />
|
|
<meta property="og:image:height" content="512" />
|
|
<meta property="og:image:alt" content="Jet Pham" />
|
|
<meta name="twitter:card" content="summary" />
|
|
<meta name="twitter:title" content="Jet Pham - Software Extremist" />
|
|
<meta name="twitter:description" content="Jet Pham's personal website. Software extremist." />
|
|
<meta name="twitter:image" content="https://jetpham.com/web-app-manifest-512x512.png" />
|
|
<script type="application/ld+json">
|
|
{
|
|
"@context": "https://schema.org",
|
|
"@type": "Person",
|
|
"name": "Jet Pham",
|
|
"givenName": "Jet",
|
|
"familyName": "Pham",
|
|
"description": "Software extremist.",
|
|
"url": "https://jetpham.com",
|
|
"jobTitle": "Software Extremist",
|
|
"hasOccupation": {
|
|
"@type": "Occupation",
|
|
"name": "Hacker"
|
|
},
|
|
"email": "jet@extremist.software",
|
|
"image": "https://jetpham.com/jet.svg",
|
|
"alumniOf": {
|
|
"@type": "CollegeOrUniversity",
|
|
"name": "University of San Francisco",
|
|
"url": "https://www.usfca.edu"
|
|
},
|
|
"hasCredential": {
|
|
"@type": "EducationalOccupationalCredential",
|
|
"credentialCategory": "degree",
|
|
"name": "Bachelor of Science in Computer Science"
|
|
},
|
|
"homeLocation": {
|
|
"@type": "City",
|
|
"name": "San Francisco, CA"
|
|
},
|
|
"workLocation": {
|
|
"@type": "City",
|
|
"name": "San Francisco, CA"
|
|
},
|
|
"memberOf": {
|
|
"@type": "Organization",
|
|
"name": "Noisebridge",
|
|
"url": "https://www.noisebridge.net"
|
|
},
|
|
"affiliation": {
|
|
"@type": "Organization",
|
|
"name": "Noisebridge",
|
|
"url": "https://www.noisebridge.net"
|
|
},
|
|
"sameAs": [
|
|
"https://github.com/jetpham",
|
|
"https://x.com/jetpham5",
|
|
"https://bsky.app/profile/jetpham.com",
|
|
"https://git.extremist.software"
|
|
]
|
|
}
|
|
</script>
|
|
</head>
|
|
<body style="background:#000">
|
|
<canvas id="canvas" class="fixed top-0 left-0 -z-10 h-screen w-screen" aria-hidden="true"></canvas>
|
|
<main>
|
|
<div class="flex flex-col items-center justify-start px-4">
|
|
<!-- FrostedBox -->
|
|
<div class="relative px-[2ch] py-[2ch] my-[2ch] w-full max-w-[66.666667%] min-w-fit md:mt-[4ch]">
|
|
<div
|
|
class="pointer-events-none absolute inset-0 h-[200%]"
|
|
style="background-color: rgba(0, 0, 0, 0.75); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); mask-image: linear-gradient(to bottom, black 0% 50%, transparent 50% 100%); -webkit-mask-image: linear-gradient(to bottom, black 0% 50%, transparent 50% 100%);"
|
|
aria-hidden="true"
|
|
></div>
|
|
<div class="absolute inset-0 border-2 border-white" aria-hidden="true"></div>
|
|
<!-- Content -->
|
|
<div class="relative z-10">
|
|
<div class="flex flex-col items-center justify-center gap-[2ch] md:flex-row">
|
|
<div class="order-1 flex flex-col items-center md:order-2">
|
|
<h1 class="sr-only">Jet Pham</h1>
|
|
<div id="ansi-art" aria-hidden="true"></div>
|
|
<p class="mt-[2ch]">Software Extremist</p>
|
|
</div>
|
|
<div class="order-2 shrink-0 md:order-1">
|
|
<img
|
|
src="/jet.svg"
|
|
alt="A picture of Jet wearing a beanie in purple and blue lighting"
|
|
width="250"
|
|
height="250"
|
|
class="aspect-square w-full max-w-[250px] object-cover md:h-[263px] md:w-[175px] md:max-w-none"
|
|
style="background-color: #a604f3; color: transparent"
|
|
/>
|
|
</div>
|
|
</div>
|
|
<!-- Contact -->
|
|
<fieldset class="mt-[2ch] border-2 border-white px-[calc(1.5ch-0.5px)] pb-[1ch] pt-0">
|
|
<legend class="-mx-[0.5ch] px-[0.5ch] text-white">Contact</legend>
|
|
<a href="mailto:jet@extremist.software">jet@extremist.software</a>
|
|
</fieldset>
|
|
<!-- Links -->
|
|
<fieldset class="mt-[2ch] border-2 border-white px-[calc(1.5ch-0.5px)] pb-[1ch] pt-0">
|
|
<legend class="-mx-[0.5ch] px-[0.5ch] text-white">Links</legend>
|
|
<ol>
|
|
<li>
|
|
<a href="https://git.extremist.software" class="inline-flex items-center">Forgejo</a>
|
|
</li>
|
|
<li>
|
|
<a href="https://github.com/jetpham" class="inline-flex items-center">GitHub</a>
|
|
</li>
|
|
<li>
|
|
<a href="https://x.com/jetpham5" class="inline-flex items-center">X</a>
|
|
</li>
|
|
<li>
|
|
<a href="https://bsky.app/profile/jetpham.com" class="inline-flex items-center">Bluesky</a>
|
|
</li>
|
|
</ol>
|
|
</fieldset>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</main>
|
|
<script type="module" src="/src/main.ts"></script>
|
|
</body>
|
|
</html>
|