https://phthallo.com/

Eingereichte URL:
https://phthallo.com/
Bericht beendet:
LinkText
https://github.com/phthallo@phthallo
https://linkedin.com/in/annabelquachannabelquach
https://github.com/phthallo/terminal-websiteVisit the GitHub repository for Terminal Portfolioview source
https://pypi.org/project/pyflagoras/Visit the external site for Pyflagorasvisit
https://github.com/phthallo/pyflagorasVisit the GitHub repository for Pyflagorasview source
https://github.com/phthallo/arduinoooVisit the external site for Arduinooovisit
https://github.com/phthallo/galleryVisit the GitHub repository for Galleryview source
https://github.com/phthallo/site-v1open source

JavaScript-Variablen · 5 gefunden

NameTyp
onbeforetoggleobject
documentPictureInPictureobject
onscrollendobject
lightModeboolean
setThemefunction

Konsolenprotokoll-Meldungen · 1 gefunden

TypKategorieProtokoll
warningother
URL
https://phthallo.com/
Text
The key "resizes-content" is not recognized and ignored.

HTML

<!DOCTYPE html><html lang="en" data-theme="dark" style="color-scheme: dark;"><head><title>home - annabel</title><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1.0, resizes-content"><meta name="description" content="Annabel Quach's personal website."><link href="/css/style.css" rel="stylesheet"><script type="module">const defaultTheme = "dark";

  const n="theme",r=window.matchMedia("(prefers-color-scheme: dark)");function d(){return r.matches?"dark":defaultTheme}function a(e){const o=e!==void 0?e:localStorage.getItem(n);return o!=null?o:d()}function t(e){document.documentElement.setAttribute("data-theme",e),document.documentElement.style.colorScheme=e}function l(e){e.key===n&&t(a(e.newValue))}function m(){t(a())}function c(e){e.detail?(localStorage.setItem(n,e.detail),t(e.detail)):(localStorage.removeItem(n),t(a(e.detail)))}document.addEventListener("set-theme",c),window.addEventListener("storage",l),r.addEventListener("change",m),document.addEventListener("astro:after-swap",m),t(a());
</script><style>
        body {
          visibility: hidden;
          opacity: 0;
        }
      </style><link rel="stylesheet" href="/_astro/about.CB-9fQpk.css">
<link rel="stylesheet" href="/_astro/2024-10-28-website.DjzUTVy4.css"></head> <body class="z-1 m-0 h-full min-h-screen overflow-y-scroll bg-[#e8e5f0] dark:bg-palette-700 bg-[url('/topographylight.svg')] dark:bg-[url('/topography.svg')] pt-0 font-proto text-white"> <div id="primary" class="z-2 m-auto grid min-h-screen w-11/12 px-8 pt-2 transition-all duration-100 lg:w-3/4" style="grid-template-rows: auto 1fr auto"> <header> <!-- prettier-ignore --> <div id="navigation" class="mb-3"> <script>
    var lightMode = document.documentElement.attributes.getNamedItem("data-theme")?.value == "light";
    // Fall back on localStorage to get theme details, as lightMode @ initial render is always undefined.
    lightMode = lightMode ? lightMode : (localStorage.getItem("theme") == "light")
    document.addEventListener("DOMContentLoaded", function() {
        const icon = document.getElementById('toggleIcon');
        icon.className = (lightMode) ? "icon-moon" : "icon-sun";
    });
    function setTheme() {
        document.dispatchEvent(
            new CustomEvent("set-theme", { detail: lightMode ? "dark" : "light" })
        );
        lightMode = !lightMode;
        const icon = document.getElementById('toggleIcon');
        icon.className = (lightMode) ? "icon-moon" : "icon-sun";
    }
</script> <button class="float-right h-7 w-7 md:h-8 md:w-8 rounded-md transition-all duration-100" onclick="setTheme()" aria-label="Switch page theme"> <i id="toggleIcon" class="icon-sun"></i> </button> <p>~/ <a class="no-underline" href="/">home</a> <span>  </span> </p> </div> <h1>Hi, I'm Annabel.</h1> <hr> <div class="flex flex-col justify-between text-sm leading-7 sm:leading-5 transition-all duration-300 sm:flex-row sm:text-base"> <div> <b><i class="icon-envelope mr-2"></i>contact<!-- a comment -->@<!-- -->phthallo.com</b><br> <b><a class="text-palette-800 icon" href="https://github.com/phthallo"><i class="icon-github mr-2"></i>@phthallo</a></b> </div> <div> <b><a class="text-palette-800 icon" href="https://linkedin.com/in/annabelquach"><i class="icon-linkedin mr-2"></i>annabelquach</a></b><br> <b><i class="icon-github mr-2"></i>@phthallo</b> </div> </div> <hr> </header>  <main> <p>i go by <b>phthallo</b> (<i>phay-low</i> or <i>thay-low</i>, i don't really mind) everywhere online. i am a 16 year old programmer and high school student from australia.</p> <p>read more <a href="/about" aria-label="Visit the About page">about me</a>, my <a href="/meta" aria-label="Visit the Meta page">spaces on the internet</a>, my <a href="/blog" aria-label="Visit the Blog page">blog</a> or see the <a href="/projects" aria-label="Visit the Projects page">projects</a> i've been working on.</p> <span class="relative flex items-center justify-center overflow-hidden shadow-xl h-72 my-4 w-full rounded-2xl"> <img src="/_astro/paint.SfXOThyc_U5bU1.webp" alt="The map 'Paint' from the Celeste Strawberry Jam Collab." title="The map 'Paint' from the Celeste Strawberry Jam Collab." class="m-auto my-4 block rounded-2xl bg-cover h-72 object-cover opacity-100 transition-all duration-300 hover:scale-105" width="1920" height="1080" loading="lazy" decoding="async"> </span> <h2>showcase</h2> <div class="grid grid-cols-1 justify-between gap-4 md:overflow-auto lg:grid-cols-2 2xl:grid-cols-4"> <div class="relative flex flex-col overflow-auto rounded-lg bg-light-100 dark:bg-palette-900"> <img src="/_astro/project-terminalwebsite.CwnCSyhA_Z1Vsil0.webp" alt="An interactive, functional Linux terminal themed portfolio website, complete with commands." class="w-full h-36 object-cover" width="1877" height="816" loading="lazy" decoding="async"> <div class="p-4 h-full flex flex-col"> <a class="no-underline text-sm sm:text-base transition-all duration-300 font-bold" href="https://terminal.phthallo.com">Terminal Portfolio</a> <div class="grow"> <p>An interactive, functional Linux terminal themed portfolio website, complete with commands.</p> </div> <div> <span class="text-sm sm:text-base transition-all duration-300 my-1 ml-0 mr-2 inline-block max-h-8 rounded-lg bg-light-200 text-white dark:bg-palette-600 p-1 dark:text-palette-900"> <!-- prettier-ignore --> <i class="icon-javascript mr-1"></i>Javascript </span><span class="text-sm sm:text-base transition-all duration-300 my-1 ml-0 mr-2 inline-block max-h-8 rounded-lg bg-light-200 text-white dark:bg-palette-600 p-1 dark:text-palette-900"> <!-- prettier-ignore --> <i class="icon-html5 mr-1"></i>HTML </span><span class="text-sm sm:text-base transition-all duration-300 my-1 ml-0 mr-2 inline-block max-h-8 rounded-lg bg-light-200 text-white dark:bg-palette-600 p-1 dark:text-palette-900"> <!-- prettier-ignore --> <i class="icon-css3 mr-1"></i>CSS </span> </div> <hr> <div class="bottom-0 mt-auto text-sm sm:text-base font-bold"> <a class="icon float-left" href="https://github.com/phthallo/terminal-website" aria-label="Visit the GitHub repository for Terminal Portfolio"><i class="icon-github mr-2"></i>view source</a> <a class="icon float-right" href="https://terminal.phthallo.com" aria-label="Visit the external site for Terminal Portfolio"> <i class="icon-link mr-2 "></i>visit
</a> </div> </div> </div><div class="relative flex flex-col overflow-auto rounded-lg bg-light-100 dark:bg-palette-900"> <img src="/_astro/project-pyflagoras.CzQp4kVS_23pBHf.webp" alt="Installable Python package and CLI for theming SVG files using user-provided images." class="w-full h-36 object-cover" width="1840" height="1029" loading="lazy" decoding="async"> <div class="p-4 h-full flex flex-col"> <a class="no-underline text-sm sm:text-base transition-all duration-300 font-bold" href="https://pypi.org/project/pyflagoras/">Pyflagoras</a> <div class="grow"> <p>Installable Python package and CLI for theming SVG files using user-provided images.</p> </div> <div> <span class="text-sm sm:text-base transition-all duration-300 my-1 ml-0 mr-2 inline-block max-h-8 rounded-lg bg-light-200 text-white dark:bg-palette-600 p-1 dark:text-palette-900"> <!-- prettier-ignore --> <i class="icon-python mr-1"></i>Python </span> </div> <hr> <div class="bottom-0 mt-auto text-sm sm:text-base font-bold"> <a class="icon float-left" href="https://github.com/phthallo/pyflagoras" aria-label="Visit the GitHub repository for Pyflagoras"><i class="icon-github mr-2"></i>view source</a> <a class="icon float-right" href="https://pypi.org/project/pyflagoras/" aria-label="Visit the external site for Pyflagoras"> <i class="icon-link mr-2 "></i>visit
</a> </div> </div> </div><div class="relative flex flex-col overflow-auto rounded-lg bg-light-100 dark:bg-palette-900"> <img src="/_astro/project-arduinooo.DZiMepaA_Z6IArX.webp" alt="Archive of Our Own fanwork renderer for the Arduino Uno microcontroller." class="w-full h-36 object-cover" width="1081" height="580" loading="lazy" decoding="async"> <div class="p-4 h-full flex flex-col"> <a class="no-underline text-sm sm:text-base transition-all duration-300 font-bold" href="https://github.com/phthallo/arduinooo">Arduinooo</a> <div class="grow"> <p>Archive of Our Own fanwork renderer for the Arduino Uno microcontroller.</p> </div> <div> <span class="text-sm sm:text-base transition-all duration-300 my-1 ml-0 mr-2 inline-block max-h-8 rounded-lg bg-light-200 text-white dark:bg-palette-600 p-1 dark:text-palette-900"> <!-- prettier-ignore --> <i class=" mr-1"></i>Processing </span><span class="text-sm sm:text-base transition-all duration-300 my-1 ml-0 mr-2 inline-block max-h-8 rounded-lg bg-light-200 text-white dark:bg-palette-600 p-1 dark:text-palette-900"> <!-- prettier-ignore --> <i class="icon-arduino mr-1"></i>Arduino </span> </div> <hr> <div class="bottom-0 mt-auto text-sm sm:text-base font-bold"> <a class="icon float-left" href="https://github.com/phthallo/arduinooo" aria-label="Visit the GitHub repository for Arduinooo"><i class="icon-github mr-2"></i>view source</a> <a class="icon float-right" href="https://github.com/phthallo/arduinooo" aria-label="Visit the external site for Arduinooo"> <i class="icon-link mr-2 "></i>visit
</a> </div> </div> </div><div class="relative flex flex-col overflow-auto rounded-lg bg-light-100 dark:bg-palette-900"> <img src="/_astro/project-gallery2.ODFKSvtB_1WgsvQ.webp" alt="A work-in-progress gallery for photos from Hack Club events, using Ruby on Rails." class="w-full h-36 object-cover" width="1869" height="865" loading="lazy" decoding="async"> <div class="p-4 h-full flex flex-col"> <a class="no-underline text-sm sm:text-base transition-all duration-300 font-bold" href="https://gallery.phthallo.com">Gallery</a> <div class="grow"> <p>A work-in-progress gallery for photos from Hack Club events, using Ruby on Rails.</p> </div> <div> <span class="text-sm sm:text-base transition-all duration-300 my-1 ml-0 mr-2 inline-block max-h-8 rounded-lg bg-light-200 text-white dark:bg-palette-600 p-1 dark:text-palette-900"> <!-- prettier-ignore --> <i class="icon-rails mr-1"></i>Rails </span> </div> <hr> <div class="bottom-0 mt-auto text-sm sm:text-base font-bold"> <a class="icon float-left" href="https://github.com/phthallo/gallery" aria-label="Visit the GitHub repository for Gallery"><i class="icon-github mr-2"></i>view source</a> <a class="icon float-right" href="https://gallery.phthallo.com" aria-label="Visit the external site for Gallery"> <i class="icon-link mr-2 "></i>visit
</a> </div> </div> </div> </div> <p class="text-center"><a href="/projects" aria-label="Visit the Projects page">see more projects</a></p> </main>  <footer> <div class="mx-auto mt-4 mb-10"> <span class="inline-block h-8 w-[10%] bg-palette-50 opacity-60 dark:opacity-100 ">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><!--
        --><span class="inline-block h-8 w-[10%] bg-palette-100 opacity-60 dark:opacity-100 ">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><!--
        --><span class="inline-block h-8 w-[10%] bg-palette-200 opacity-60 dark:opacity-100 ">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><!--
        --><span class="inline-block h-8 w-[10%] bg-palette-300 opacity-60 dark:opacity-100 ">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><!--
        --><span class="inline-block h-8 w-[10%] bg-palette-400 opacity-60 dark:opacity-100 ">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><!--
        --><span class="inline-block h-8 w-[10%] bg-palette-500 opacity-60 dark:opacity-100 ">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><!--
        --><span class="inline-block h-8 w-[10%] bg-palette-600 opacity-60 dark:opacity-100 ">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><!--
        --> <i></i><p class="text-sm"><i>this website is <a href="https://github.com/phthallo/site-v1">open source</a>. made with tailwindcss and astro</i></p> </div> </footer> </div> </body></html>