dealjus
b7b3de339c
Some checks failed
Build and Deploy / build (push) Failing after 32s
test cicd update update project deploy.yml Update CICD test update cicd update CICD to use alpine back to ubuntu for CICD add install pnpm to CICD source pnpm in cicd fix cicd remove error in pnpm install cicd command testing cicd confused change pnpm setup update CICD go try again test remove node step install rsync in cicd update cicd again
33 lines
11 KiB
HTML
33 lines
11 KiB
HTML
<!DOCTYPE html><html lang="en"> <head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1"><link rel="icon" type="image/svg+xml" href="/pixel_avatar.png"><meta name="generator" content="Astro v5.7.5"><link rel="preconnect" href="https://fonts.bunny.net"><link href="https://fonts.bunny.net/css?family=ibm-plex-mono:400,400i,500,500i,600,600i,700,700i" rel="stylesheet"> <title>No, We Have Netflix at Home • Justin Deal</title> <meta name="description" content="How my exasperation at paying for an ever growing number of streaming services led to a deep obsession"> <meta property="og:title" content="No, We Have Netflix at Home • Justin Deal"> <meta property="og:description" content="How my exasperation at paying for an ever growing number of streaming services led to a deep obsession"> <meta property="og:image" content="https://justin.deal/pixel_avatar.png"> <meta property="og:url" content="/blog/html-intro"> <meta name="twitter:card" content="summary_large_image"> <meta name="twitter:title" content="No, We Have Netflix at Home • Justin Deal"> <meta name="twitter:description" content="How my exasperation at paying for an ever growing number of streaming services led to a deep obsession"> <meta name="twitter:image" content="https://justin.deal/pixel_avatar.png"> <meta http-equiv="content-language" content="en"> <meta name="language" content="English"> <link rel="canonical" href="https://justin.deal/blog/html-intro"> <link rel="stylesheet" href="/_astro/html-intro.CpHT9-yV.css"></head> <body class="zag-bg zag-text zag-transition font-mono"> <header class="zag-bg zag-border-b zag-transition sticky top-0 w-full z-10"> <div class="zag-bg zag-transition sm:hidden relative z-50 py-4 flex items-center"> <button class="px-4" aria-label="Toggle navigation menu"> <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 512 512" class="zag-fill zag-transition"> <path d="M80 96h352v32H80zm0 144h352v32H80zm0 144h352v32H80z"></path> </svg> </button> </div> <nav class="zag-bg zag-border-b zag-transition fixed sm:relative inset-x-0 top-0 h-auto sm:px-4 flex justify-between flex-col gap-8 py-4 text-xl sm:flex-row max-w-2xl mx-auto sm:pt-4 sm:border-none"> <div class="flex flex-col font-mono font-medium gap-4 sm:flex-row px-4 sm:px-0 mt-16 sm:mt-0"> <a href="/" class="zag-offset underline font-medium flex items-center focus:outline-2 focus:outline-offset-2 focus:outline-zag-dark dark:focus:outline-zag-light" target="_self"> home </a><a href="/blog" class="zag-offset underline font-medium flex items-center focus:outline-2 focus:outline-offset-2 focus:outline-zag-dark dark:focus:outline-zag-light" target="_self"> blog </a><a href="/projects" class="zag-offset underline font-medium flex items-center focus:outline-2 focus:outline-offset-2 focus:outline-zag-dark dark:focus:outline-zag-light" target="_self"> projects </a><a href="/homelab" class="zag-offset underline font-medium flex items-center focus:outline-2 focus:outline-offset-2 focus:outline-zag-dark dark:focus:outline-zag-light" target="_self"> homelab </a> </div> <div class="flex gap-4 justify-between px-4 sm:px-0"> <button class="border-none bg-none focus:outline-2 focus:outline-offset-2 focus:outline-zag-dark dark:focus:outline-zag-light" id="themeToggle" aria-label="Theme Toggle"> <svg width="30px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" name="Theme toggle"> <path class="zag-transition fill-neutral-900 dark:fill-transparent" fill-rule="evenodd" d="M12 17.5a5.5 5.5 0 1 0 0-11 5.5 5.5 0 0 0 0 11zm0 1.5a7 7 0 1 0 0-14 7 7 0 0 0 0 14zm12-7a.8.8 0 0 1-.8.8h-2.4a.8.8 0 0 1 0-1.6h2.4a.8.8 0 0 1 .8.8zM4 12a.8.8 0 0 1-.8.8H.8a.8.8 0 0 1 0-1.6h2.5a.8.8 0 0 1 .8.8zm16.5-8.5a.8.8 0 0 1 0 1l-1.8 1.8a.8.8 0 0 1-1-1l1.7-1.8a.8.8 0 0 1 1 0zM6.3 17.7a.8.8 0 0 1 0 1l-1.7 1.8a.8.8 0 1 1-1-1l1.7-1.8a.8.8 0 0 1 1 0zM12 0a.8.8 0 0 1 .8.8v2.5a.8.8 0 0 1-1.6 0V.8A.8.8 0 0 1 12 0zm0 20a.8.8 0 0 1 .8.8v2.4a.8.8 0 0 1-1.6 0v-2.4a.8.8 0 0 1 .8-.8zM3.5 3.5a.8.8 0 0 1 1 0l1.8 1.8a.8.8 0 1 1-1 1L3.5 4.6a.8.8 0 0 1 0-1zm14.2 14.2a.8.8 0 0 1 1 0l1.8 1.7a.8.8 0 0 1-1 1l-1.8-1.7a.8.8 0 0 1 0-1z"></path> <path class="zag-transition fill-transparent dark:fill-neutral-100" fill-rule="evenodd" d="M16.5 6A10.5 10.5 0 0 1 4.7 16.4 8.5 8.5 0 1 0 16.4 4.7l.1 1.3zm-1.7-2a9 9 0 0 1 .2 2 9 9 0 0 1-11 8.8 9.4 9.4 0 0 1-.8-.3c-.4 0-.8.3-.7.7a10 10 0 0 0 .3.8 10 10 0 0 0 9.2 6 10 10 0 0 0 4-19.2 9.7 9.7 0 0 0-.9-.3c-.3-.1-.7.3-.6.7a9 9 0 0 1 .3.8z"></path> </svg> </button> <script>
|
|
const theme = (() => {
|
|
if (typeof localStorage !== "undefined" && localStorage.getItem("theme")) {
|
|
return localStorage.getItem("theme") ?? "light";
|
|
}
|
|
if (window.matchMedia("(prefers-color-scheme: dark)").matches) {
|
|
return "dark";
|
|
}
|
|
return "light";
|
|
})();
|
|
|
|
if (theme === "light") {
|
|
document.documentElement.classList.remove("dark");
|
|
} else {
|
|
document.documentElement.classList.add("dark");
|
|
}
|
|
|
|
window.localStorage.setItem("theme", theme);
|
|
|
|
const handleToggleClick = () => {
|
|
const element = document.documentElement;
|
|
element.classList.toggle("dark");
|
|
|
|
const isDark = element.classList.contains("dark");
|
|
localStorage.setItem("theme", isDark ? "dark" : "light");
|
|
};
|
|
|
|
document
|
|
.getElementById("themeToggle")
|
|
?.addEventListener("click", handleToggleClick);
|
|
</script> </div> </nav> </header> <script type="module">const a=document.querySelector("button"),n=document.querySelector("nav");let t=!1;function e(){window.matchMedia("(max-width: 640px)").matches?n.style.transform=t?"translateY(0)":"translateY(-100%)":(n.style.transform="translateY(0)",t=!1)}function s(){t=!t,e()}a?.addEventListener("click",s);window.addEventListener("resize",e);e();</script> <main> <section class="p-4 max-w-2xl mx-auto pt-8"> <div class="flex flex-col gap-4 mt-8 mb-16"> <h1 class="text-3xl sm:text-4xl leading-normal sm:leading-normal font-display"> No, We Have Netflix at Home </h1> <div class="flex justify-between"> <span>Dec 17, 2024</span> <span>4 min</span> </div> </div> <div class="w-full font-mono prose prose-headings:font-mono prose-img:rounded-none prose-p:text-[var(--color-zag-dark)] prose-p:dark:text-[var(--color-zag-light)] prose-a:underline-offset-4 prose-h1:text-2xl prose-a:text-[var(--color-zag-dark)] dark:prose-a:text-[var(--color-zag-light)] prose-headings:text-[var(--color-zag-dark)] prose-headings:dark:text-[var(--color-zag-light)] prose-p:text-justify prose-code:text-[var(--color-zag-dark)] dark:prose-code:text-[var(--color-zag-light)] prose-h2:text-2xl prose-h3:text-xl prose-h4:text-lg prose-h5:text-base prose-h6:text-sm prose-strong:text-[var(--color-zag-dark)] dark:prose-strong:text-[var(--color-zag-light)] prose-li:text-[var(--color-zag-dark)] dark:prose-li:text-[var(--color-zag-light)] prose-ul:marker:text-[var(--color-zag-dark)] prose-ul:dark:marker:text-[var(--color-zag-light)] prose-ol:marker:text-[var(--color-zag-dark)] prose-ol:dark:marker:text-[var(--color-zag-light)] prose-a:offset-[var(--zag-offset)] prose-a:focus:outline-2 prose-a:focus:outline-offset-2 prose-a:focus:outline-zag-dark prose-a:dark:focus:outline-zag-light"> </div> <div class="flex flex-wrap gap-2 mt-4"> <span class="-zag-text -zag-bg zag-transition px-2 py-1 text-sm font-semibold"> code </span><span class="-zag-text -zag-bg zag-transition px-2 py-1 text-sm font-semibold"> html </span> </div> <p class="pt-8">~Justin Deal</p> </section> </main> <footer class="mt-16 mb-8"> <section class="p-4 max-w-2xl mx-auto mb-4"> <div class="zag-border-b zag-transition pb-4 flex flex-col sm:flex-row sm:flex-nowrap gap-8 sm:items-center"> <ul class="flex flex-row gap-2"> <li> <a href="/" class="zag-offset underline font-medium flex items-center focus:outline-2 focus:outline-offset-2 focus:outline-zag-dark dark:focus:outline-zag-light" target="_self"> home </a> </li><li> <a href="/blog" class="zag-offset underline font-medium flex items-center focus:outline-2 focus:outline-offset-2 focus:outline-zag-dark dark:focus:outline-zag-light" target="_self"> blog </a> </li><li> <a href="/projects" class="zag-offset underline font-medium flex items-center focus:outline-2 focus:outline-offset-2 focus:outline-zag-dark dark:focus:outline-zag-light" target="_self"> projects </a> </li><li> <a href="/homelab" class="zag-offset underline font-medium flex items-center focus:outline-2 focus:outline-offset-2 focus:outline-zag-dark dark:focus:outline-zag-light" target="_self"> homelab </a> </li> </ul> <div class="flex flex-row sm:flex-row gap-4"> <a href="https://github.com/RATIU5/zaggonaut" class="zag-offset underline font-medium flex items-center focus:outline-2 focus:outline-offset-2 focus:outline-zag-dark dark:focus:outline-zag-light" target="_self" aria-label="GitHub Profile"> <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"> <path class="zag-fill zag-transition" d="M12 2A10 10 0 0 0 2 12c0 4.42 2.87 8.17 6.84 9.5c.5.08.66-.23.66-.5v-1.69c-2.77.6-3.36-1.34-3.36-1.34c-.46-1.16-1.11-1.47-1.11-1.47c-.91-.62.07-.6.07-.6c1 .07 1.53 1.03 1.53 1.03c.87 1.52 2.34 1.07 2.91.83c.09-.65.35-1.09.63-1.34c-2.22-.25-4.55-1.11-4.55-4.92c0-1.11.38-2 1.03-2.71c-.1-.25-.45-1.29.1-2.64c0 0 .84-.27 2.75 1.02c.79-.22 1.65-.33 2.5-.33s1.71.11 2.5.33c1.91-1.29 2.75-1.02 2.75-1.02c.55 1.35.2 2.39.1 2.64c.65.71 1.03 1.6 1.03 2.71c0 3.82-2.34 4.66-4.57 4.91c.36.31.69.92.69 1.85V21c0 .27.16.59.67.5C19.14 20.16 22 16.42 22 12A10 10 0 0 0 12 2"></path> </svg> </a> <a href="https://twitter.com/" class="zag-offset underline font-medium flex items-center focus:outline-2 focus:outline-offset-2 focus:outline-zag-dark dark:focus:outline-zag-light" target="_self" aria-label="Twitter Profile"> <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"> <path class="zag-fill zag-transition" d="m17.687 3.063l-4.996 5.711l-4.32-5.711H2.112l7.477 9.776l-7.086 8.099h3.034l5.469-6.25l4.78 6.25h6.102l-7.794-10.304l6.625-7.571zm-1.064 16.06L5.654 4.782h1.803l10.846 14.34z"></path> </svg> </a> <a href="https://www.linkedin.com/" class="zag-offset underline font-medium flex items-center focus:outline-2 focus:outline-offset-2 focus:outline-zag-dark dark:focus:outline-zag-light" target="_self" aria-label="LinkedIn Profile"> <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"> <path class="zag-fill zag-transition" fill="currentColor" d="M19 0h-14c-2.76 0-5 2.24-5 5v14c0 2.76 2.24 5 5 5h14c2.76 0 5-2.24 5-5v-14c0-2.76-2.24-5-5-5zm-11.12 19h-3.08v-9h3.08v9zm-1.54-10.29c-.99 0-1.79-.8-1.79-1.79s.8-1.79 1.79-1.79 1.79.8 1.79 1.79-.8 1.79-1.79 1.79zm13.16 10.29h-3.08v-4.89c0-1.16-.02-2.64-1.61-2.64s-1.86 1.26-1.86 2.57v4.96h-3.08v-9h2.96v1.23h.04c.41-.78 1.4-1.6 2.88-1.6 3.08 0 3.65 2.03 3.65 4.66v4.71z"></path> </svg> </a> </div> </div> </section> <p class="zag-text zag-transition text-center text-sm font-medium">
|
|
© 2025 Justin Deal. All rights reserved.
|
|
</p> </footer> </body></html> |