rewrite badges to allow public directory, add badge

src/components/Badges.astro

@@ -18,10 +18,23 @@ const { badges } = Astro.props;
 
 <div class="badges">
     {badges.map((badge) => {
-        // probably could be a lot cleaner, but i dont care
+        // hopefully we can dedupe this sometime....
-        if (!images[badge.imagePath]) throw new Error(`"${badge.imagePath}" does not exist in glob for wildcard in badges`);
+        const isTreatedAsPublic = images[badge.imagePath] === undefined;
-        if (badge.href !== undefined) return <a href={badge.href} target="_blank" rel="noreferrer noopener"><Image src={images[badge.imagePath]()} alt={badge.alt} title={badge.title} quality={100} loading="lazy"/></a>;
+        const hasHref = badge.href !== undefined;
-        else return <Image src={images[badge.imagePath]()} alt={badge.alt} title={badge.title} quality={100} loading="lazy"/>;
+
+        return <>
+            {hasHref ? <a href={badge.href} target="_blank" rel="noreferrer noopener">
+                {isTreatedAsPublic
+                    ? <img src={badge.imagePath} alt={badge.alt} title={badge.title} loading="lazy" decoding="async" width="88" height="31"/>
+                    : <Image src={images[badge.imagePath]()} alt={badge.alt} title={badge.title} quality={100} loading="lazy" width="88" height="31"/>
+                }
+            </a> : <>
+                {isTreatedAsPublic
+                    ? <img src={badge.imagePath} alt={badge.alt} title={badge.title} loading="lazy" decoding="async" width="88" height="31"/>
+                    : <Image src={images[badge.imagePath]()} alt={badge.alt} title={badge.title} quality={100} loading="lazy" width="88" height="31"/>
+                }
+            </>}
+        </>;
     })}
 </div>
 <style>
@@ -30,6 +43,7 @@ const { badges } = Astro.props;
         flex-wrap: wrap;
         justify-content: center;
         gap: .2em;
+        image-rendering: pixelated;
 
         margin-top: 1.25em;
         margin-bottom: 1.25em;

src/pages/index.astro

@@ -14,6 +14,12 @@ import Badges from "../components/Badges.astro";
     </Card>
     <Card title="buttons">
         <Badges badges={[
+            {
+                imagePath: "/88x31.gif",
+                alt: "CLI prompt displaying 'reidlab'",
+                title: "my button! feel free to use or hotlink",
+                href: "/"
+            },
             {
                 imagePath: "../assets/badges/blinchik.gif",
                 alt: "blinchik",