fix margin a bit

.vscode/launch.json

@@ -8,7 +8,7 @@
       "type": "node-terminal"
     },
     {
-      "command": "./node_modules/.bin/astro dev",
+      "command": "./node_modules/.bin/astro dev --host",
       "name": "Development server",
       "request": "launch",
       "type": "node-terminal"

TODO.md

@@ -16,4 +16,6 @@
 - glow on text like voltrina.net?
 - reduce size of cards
 - services page? (maybe remove ouroboros.group, or have it redirect?? idk)
-- Photography portfolio
+- Photography portfolio
+- in site info, automatically show latest update (and commit)
+- listenbrainz scrobbler

public/css/classes.css

@@ -3,7 +3,7 @@
 @import "instructions.class";
 
 .title {
-    font-size: 50px;
+    font-size: 42px;
     background-image: var(--accent-gradient);
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;
@@ -21,4 +21,22 @@
 
 .menu {
     text-align: center;
+}
+
+.content {
+    width: 85%;
+    max-width: 75em;
+    margin: auto;
+    padding: 0.5em;
+    margin-top: 1em;
+    margin-bottom: 1em;
+    border: 3px solid #fab387;
+    border-radius: 5px;
+    opacity: 0.9;
+	background: rgba(0, 0, 0, .66); 
+}
+
+.small-quote {
+    font-size: smaller;
+    color: #a6adc8;
 }

public/css/limepot.css

@@ -22,24 +22,6 @@
     margin: auto;
 }
 
-.content {
-    width: 85%;
-    max-width: 75em;
-    margin: auto;
-    padding: 0.5em;
-    margin-top: 1em;
-    margin-bottom: 1em;
-    border: 3px solid #fab387;
-    border-radius: 5px;
-    opacity: 0.9;
-	background: rgba(0, 0, 0, .66); 
-}
-
-.small-quote {
-    font-size: smaller;
-    color: #a6adc8;
-}
-
 footer {
     text-align: center;
 }

src/components/Footer.astro

@@ -55,7 +55,16 @@ const today = new Date();
           <a href="https://store.steampowered.com/app/70/HalfLife"><image src="/assets/badges/hl.gif" alt="Half-Life" loading="lazy"/></a>
           <image src="/assets/badges/blink.gif" alt="Anime girl blinking" loading="lazy"/>
          <br>
-          <!-- <a href="https://marijuana.procon.org/"><image src="/assets/badges/legalize.gif" alt="Legalize Marijuana" loading="lazy"/>-->
+          <a href="https://www.w3.org/TR/CSS/#css"><image src="/assets/badges/made-with-css.gif" alt="Made with CSS" loading="lazy"/></a>
+          <a href="https://www.w3.org/TR/CSS/#css"><image src="/assets/badges/css-is-difficult.gif" alt="CSS is Difficult" loading="lazy"/></a>
+          <a href="https://minecraft.net/"><image src="/assets/badges/minecraft.gif" alt="Minecraft" loading="lazy"/></a>
+          <a href="https://www.noaa.gov/"><image src="/assets/badges/noaa.gif" alt="NOAA" loading="lazy"/></a>
+          <a href="https://archive.org/"><image src="/assets/badges/preserve.gif" alt="Preserve, internet archive" loading="lazy"/></a>
+          <br>
+          <a href="https://en.wikipedia.org/wiki/Right_to_repair"><image src="/assets/badges/right2repair.gif" alt="I support right to repair" loading="lazy"/></a>
+          <image src="/assets/badges/rainbow_bev.gif" alt="Rainbow" loading="lazy"/>
+          <image src="/assets/badges/queerpride.gif" alt="Queer Pride!" loading="lazy"/>
+          <image src="/assets/badges/transnow2.gif" alt="Trans rights now!" loading="lazy"/>
          <hr>
         <a>Web Rings</a>
         <br>

src/components/Head.astro

@@ -4,9 +4,10 @@ interface Props {
 	description: string;
 }
 
-const canonicalURL = new URL(Astro.url.pathname, Astro.site);
+import { SITE_TITLE, SITE_DESCRIPTION } from "../consts";
 
-const { title, description } = Astro.props;
+const canonicalURL = new URL(Astro.url.pathname, Astro.site);
+const page = Astro.url.pathname
 ---
 
 <link rel="stylesheet" href="/css/limepot.css" />
@@ -28,21 +29,21 @@ const { title, description } = Astro.props;
 <link rel="canonical" href={canonicalURL} />
 
 <!-- Primary Meta Tags -->
-<title>{title}</title>
-<meta name="title" content={title} />
-<meta name="description" content={description} />
+<title>{SITE_TITLE} {page}</title>
+<meta name="title" content={SITE_TITLE} />
+<meta name="description" content={SITE_DESCRIPTION} />
 
 <!-- Open Graph / Facebook -->
 <meta property="og:type" content="website" />
 <meta property="og:url" content={Astro.url} />
-<meta property="og:title" content={title} />
-<meta property="og:description" content={description} />
+<meta property="og:title" content={SITE_TITLE} />
+<meta property="og:description" content={SITE_DESCRIPTION} />
 <meta property="og:profile:gender" content="woman(ish)">
 
 <!-- Twitter -->
 <meta property="twitter:card" content="summary_large_image" />
 <meta property="twitter:url" content={Astro.url} />
-<meta property="twitter:title" content={title} />
-<meta property="twitter:description" content={description} />
+<meta property="twitter:title" content={SITE_TITLE} />
+<meta property="twitter:description" content={SITE_DESCRIPTION} />
 
 <meta content="she/they" property="pronouns">

src/pages/blog/index.astro

@@ -1,14 +1,8 @@
 ---
-import BaseHead from "../../components/Head.astro";
-import Header from "../../components/Header.astro";
-import Footer from "../../components/Footer.astro";
 import BlogCard from "../../components/Card-Blog.astro";
 import Card from "../../components/Card.astro"
 import Layout from "../../layouts/Layout.astro";
-import { SITE_TITLE, SITE_DESCRIPTION } from "../../consts";
 import { getCollection } from "astro:content";
-import FormattedDate from "../../components/FormattedDate.astro";
-import type { setErrorMap } from "astro/zod";
 
 const posts = (await getCollection("blog")).sort(
   (a, b) => a.data.pubDate.valueOf() - b.data.pubDate.valueOf()

src/pages/index.astro

@@ -14,8 +14,14 @@ import Card from "../components/Card.astro";
     <div class="content">
       <figure>
         <figcaption>
-          <span>Some Ambience?</span>
-          <br />
+          
+    <h2 class="subtitle" style="text-align: center;">Some Ambience?</h2>
+        <span style="font-size: small;">
+          <a href="/assets/sounds/ambience/383506__klankbeeld__pinewood-in-memoriam-febr-05-nl-giersbergen-33db-170215_1085.flac">
+            Download File
+          </a>
+        </span>
+          <br>
           <span style="font-size: smaller; color: #a6adc8;">(Might take a moment to load)</span>
         </figcaption>
         <audio
@@ -23,14 +29,10 @@ import Card from "../components/Card.astro";
           src="/assets/sounds/ambience/383506__klankbeeld__pinewood-in-memoriam-febr-05-nl-giersbergen-33db-170215_1085.flac"
         >
         </audio>
-        <span style="font-size: small;">
-          <a href="/assets/sounds/ambience/383506__klankbeeld__pinewood-in-memoriam-febr-05-nl-giersbergen-33db-170215_1085.flac">
-            Download File
-          </a>
-        </span>
       </figure>
     </div>
     <div class="content">
+    <h2 class="subtitle" style="text-align: center;">About The Me</h2>
       <p>
         Howdy! You can call me <span style="color: #fab387;">[Nelle]</span>,
         although some call me <span style="color: #fab387;"
@@ -51,7 +53,7 @@ import Card from "../components/Card.astro";
       </p>
     </div>
     <div class="content">
-      <h2 class="subtitle">Contact Information</h2>
+      <h2 class="subtitle" style="text-align: center;">Contact Information</h2>
       <p><a href="mailto:bm01@limepot.xyz">==> Email</a></p>
       <p><a href="https://steamcommunity.com/id/limepot/">==> Steam</a></p>
       <p><a href="https://ouroboros.gay/@limepot">==> The Fediverse</a><a href="https://jointhefediverse.net/"><span style="color: #fab387;">*</span></a></p>