src/components/Card.astro

@@ -21,6 +21,7 @@ const { title } = Astro.props;
     }
 
     .card {
+        width: fit-content;
         /* the golden rule i think */
         /* max-width: 800px is my everything */
         max-width: 800px;

src/components/LastFm.astro

@@ -1,72 +0,0 @@
----
----
-
-<div class="lastfm">
-    <img class="cover" src="https://lastfm.freetls.fastly.net/i/u/300x300/c6f59c1e5e7240a4c0d427abd71f3dbb.jpg">
-    <div class="info">
-        <h3 class="title"><a target="_blank">loading...</a></h3>
-        on <span class="album"><strong>loading...</strong></span><br>
-        by <span class="artist"><strong>loading...</strong></span><br>
-        at <time class="time"><strong>loading...</strong></time>
-    </div>
-</div>
-<script>
-    // load bearing noelle
-    const json = await fetch("https://lastfm.nkko.workers.dev/?method=user.getRecentTracks&user=reidlab")
-        .then(res => res.json())
-        .catch(err => console.error("last.fm fail:", err));
-    console.log(json);
-    type LastFmResource<T> = { "#text": T }
-    const track = json.recenttracks.track[0] as {
-        "@attr"?: { nowplaying: boolean },
-        album: LastFmResource<string>,
-        artist: LastFmResource<string>,
-        date?: LastFmResource<string>,
-        image: LastFmResource<string>[],
-        name: string,
-        url: string,
-    };
-
-    // i think it's okay to have this be an anchor element
-    // the aria role is link if href is present, otherwise generic (https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/a#technical_summary)
-    // also briefly stated in the html spec (https://html.spec.whatwg.org/#the-a-element)
-    const title = document.querySelector(".title a") as HTMLAnchorElement;
-    const album = document.querySelector(".album strong") as HTMLElement;
-    const artist = document.querySelector(".artist strong") as HTMLElement;
-    const time = document.querySelector(".time strong") as HTMLTimeElement;
-    const cover = document.querySelector(".cover") as HTMLImageElement;
-    title.innerText = track.name;
-    title.href = track.url;
-    album.innerText = track.album["#text"];
-    artist.innerText = track.artist["#text"];
-    time.innerText = (track.date && new Date(track.date["#text"]).toLocaleString(undefined, {
-        dateStyle: "medium",
-        timeStyle: "short"
-    })) || (track["@attr"]?.nowplaying && "NOW!!!") || "epic error getting play time..";
-
-    // i chose a random thing from my library missing an album cover for this
-    // but apparently this goes for any missing track? cuz everyone else is doing it
-    // https://github.com/search?q=c6f59c1e5e7240a4c0d427abd71f3dbb&type=code
-    cover.src = track.image.at(-1)?.["#text"] ?? "https://lastfm.freetls.fastly.net/i/u/300x300/c6f59c1e5e7240a4c0d427abd71f3dbb.jpg";
-    cover.alt = track.name;
-</script>
-<style>
-    .lastfm {
-        display: flex;
-        gap: 1em;
-    }
-
-    .cover {
-        display: block;
-        width: 8em;
-        height: min-content;
-        float: left;
-    }
-
-    .info {
-        word-break: break-all;
-    }
-    .title {
-        size: 1.2em;
-    }
-</style>

src/content/badges/badges.yml

@@ -91,7 +91,3 @@
   path: "./img/spax.gif"
   alt: "spax dot zone"
   href: "https://spax.zone"
-- slug: "mini"
-  path: "./img/mini.png"
-  alt: "miniaturity"
-  href: "https://minipa.ws/"

src/pages/index.astro

@@ -3,7 +3,6 @@ import Layout from "../layouts/Layout.astro";
 
 import Card from "../components/Card.astro";
 import Badges from "../components/Badges.astro";
-import LastFm from "../components/LastFm.astro";
 ---
 
 <Layout title="landing">
@@ -12,9 +11,6 @@ import LastFm from "../components/LastFm.astro";
         <p>this site was made as a dumping grounds for whatever i decide to put on here eventually, more coming soon, i promise!! the whole thing as a whole is still a work in progress</p>
         <p>feel free to look around, and if you have any questions, feel free to ask me on my socials or contact me directly</p>
     </Card>
-    <Card title="lastfm">
-        <LastFm/>
-    </Card>
     <Card title="buttons">
         <Badges/>
     </Card>