- Scan ID:
- 1be1d697-4cb7-41c7-8fe5-3c386d4f8819Finished
- Submitted URL:
- https://phthallo.com/
- Report Finished:
Links · 8 found
The outgoing links identified from the page
| Link | Text |
|---|---|
| https://github.com/phthallo | @phthallo |
| https://linkedin.com/in/annabelquach | annabelquach |
| https://github.com/phthallo/terminal-website | Visit the GitHub repository for Terminal Portfolioview source |
| https://pypi.org/project/pyflagoras/ | Visit the external site for Pyflagorasvisit |
| https://github.com/phthallo/pyflagoras | Visit the GitHub repository for Pyflagorasview source |
| https://github.com/phthallo/arduinooo | Visit the external site for Arduinooovisit |
| https://github.com/phthallo/gallery | Visit the GitHub repository for Galleryview source |
| https://github.com/phthallo/site-v1 | open source |
JavaScript Variables · 5 found
Global JavaScript variables loaded on the window object of a page, are variables declared outside of functions and accessible from anywhere in the code within the current scope
| Name | Type |
|---|---|
| onbeforetoggle | object |
| documentPictureInPicture | object |
| onscrollend | object |
| lightMode | boolean |
| setTheme | function |
Console log messages · 1 found
Messages logged to the web console
| Type | Category | Log |
|---|---|---|
| warning | other |
|
HTML
The raw HTML body of the page
<!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 "> </span><!--
--><span class="inline-block h-8 w-[10%] bg-palette-100 opacity-60 dark:opacity-100 "> </span><!--
--><span class="inline-block h-8 w-[10%] bg-palette-200 opacity-60 dark:opacity-100 "> </span><!--
--><span class="inline-block h-8 w-[10%] bg-palette-300 opacity-60 dark:opacity-100 "> </span><!--
--><span class="inline-block h-8 w-[10%] bg-palette-400 opacity-60 dark:opacity-100 "> </span><!--
--><span class="inline-block h-8 w-[10%] bg-palette-500 opacity-60 dark:opacity-100 "> </span><!--
--><span class="inline-block h-8 w-[10%] bg-palette-600 opacity-60 dark:opacity-100 "> </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>