update age :(

src/App.tsx

@@ -1,6 +1,6 @@
 import React, { useState, useEffect } from "react";
-import { Flashlight, FlashlightOff, Twitter, Github } from 'lucide-react'
+import { Flashlight, FlashlightOff, Twitter, Github } from "lucide-react";
-import CordycepsImage from './assets/cordyceps.png'
+import CordycepsImage from "./assets/cordyceps.png";
 import MusicComponent from "./components/MusicComponent";
 import TVComponent from "./components/TVComponent";
 
@@ -13,8 +13,7 @@ export default function MouseFlashlight() {
   // Detect touch device on component mount
   useEffect(() => {
     const isTouchCapable =
-      "ontouchstart" in window ||
+      "ontouchstart" in window || navigator.maxTouchPoints > 0;
-      navigator.maxTouchPoints > 0;
 
     setIsTouchDevice(isTouchCapable);
   }, []);
@@ -95,7 +94,9 @@ export default function MouseFlashlight() {
       window.addEventListener("mouseleave", windowMouseLeave);
 
       // Add mobile event listeners
-      window.addEventListener("touchstart", windowTouchStart, { passive: false });
+      window.addEventListener("touchstart", windowTouchStart, {
+        passive: false,
+      });
       window.addEventListener("touchmove", windowTouchMove, { passive: false });
       window.addEventListener("touchend", windowTouchEnd);
     } else {
@@ -131,10 +132,11 @@ export default function MouseFlashlight() {
       <div className="min-h-screen flex flex-col justify-center items-center mx-auto">
         <div className="border border-white border-solid p-2 rounded-lg w-full sm:w-[500px] mb-4">
           <div className="flex items-center justify-between">
-                    <div className="ml-2" onClick={() => setIsFlashlightEnabled(!isFlashlightEnabled)}>
+            <div
-                        {
+              className="ml-2"
-                            isFlashlightEnabled ? <Flashlight /> : <FlashlightOff />
+              onClick={() => setIsFlashlightEnabled(!isFlashlightEnabled)}
-                        }
+            >
+              {isFlashlightEnabled ? <Flashlight /> : <FlashlightOff />}
             </div>
             <h1 className="text-2xl font-bold">welcome !</h1>
           </div>
@@ -144,12 +146,23 @@ export default function MouseFlashlight() {
           <div className="grid grid-cols-1 xs:grid-cols-2 p-2">
             <div className="mx-auto">
               <div>
-                            <h1 className="text-2xl font-bold italic opacity-95 inline">alex, 17</h1>
+                <h1 className="text-2xl font-bold italic opacity-95 inline">
-                            <img src="https://storage.alexav.gg/content/picturev2.jpg" width="150" className="rounded-md" alt="Profile" />
+                  alex, 18
+                </h1>
+                <img
+                  src="https://storage.alexav.gg/content/picturev2.jpg"
+                  width="150"
+                  className="rounded-md"
+                  alt="Profile"
+                />
 
                 <div className="pt-2">
                   <MusicComponent />
-                                <a href="https://last.fm/user/lulawex" target="_blank" className="hover:underline w-fit opacity-50">
+                  <a
+                    href="https://last.fm/user/lulawex"
+                    target="_blank"
+                    className="hover:underline w-fit opacity-50"
+                  >
                     powered by last.fm
                   </a>
                 </div>
@@ -158,24 +171,38 @@ export default function MouseFlashlight() {
             <div className="mx-auto">
               <h1 className="font-bold text-2xl italic">what i do</h1>
               <p>
-                            qa @ <a href="https://medal.tv" target="_blank" rel="noopener noreferrer" className="hover:underline">medal.tv</a>, game, code
+                qa @{" "}
+                <a
+                  href="https://medal.tv"
+                  target="_blank"
+                  rel="noopener noreferrer"
+                  className="hover:underline"
+                >
+                  medal.tv
+                </a>
+                , game, code
               </p>
 
               <h1 className="font-bold text-2xl italic">obsessed with</h1>
-                        <p>
+              <p>tlou, twd, rdr</p>
-                            tlou, twd, rdr
-                        </p>
 
               <h1 className="font-bold text-2xl italic">watching</h1>
               <TVComponent />
 
-
               <h1 className="font-bold text-2xl italic">socials</h1>
               <div className="space-x-2">
-                            <a href="https://twitter.com/carlgrimesdupe" target="_blank" rel="noopener noreferrer">
+                <a
+                  href="https://twitter.com/carlgrimesdupe"
+                  target="_blank"
+                  rel="noopener noreferrer"
+                >
                   <Twitter className="inline" />
                 </a>
-                            <a href="https://github.com/azpha" target="_blank" rel="noopener noreferrer">
+                <a
+                  href="https://github.com/azpha"
+                  target="_blank"
+                  rel="noopener noreferrer"
+                >
                   <Github className="inline" />
                 </a>
               </div>
@@ -202,7 +229,11 @@ export default function MouseFlashlight() {
               WebkitMaskImage: `radial-gradient(circle ${isTouchDevice ? "12rem" : "8rem"} at ${pointerPosition.x}px ${pointerPosition.y}px, black 0%, transparent 100%)`,
             }}
           >
-                <img src={CordycepsImage} className="absolute bottom-0" alt="Cordyceps" />
+            <img
+              src={CordycepsImage}
+              className="absolute bottom-0"
+              alt="Cordyceps"
+            />
           </div>
           <audio loop autoPlay={true} src={"/clicker-sounds.mp3"} />
         </>