Merge branch 'auth-dev' of https://git.eleboog.com/kebokyo/eleboog-astro into auth-dev

src/components/AttentionBar.astro

@@ -0,0 +1,11 @@
+---
+
+const props = Astro.props
+
+---
+{ false && <>
+<a class="flex justify-center text-xl p-1 hover:underline bg-crusta-500 hover:bg-crusta-700 text-white dark:bg-night-700 dark:hover:bg-night-900"
+    href="https://ko-fi.com/kebokyo">
+    Sorry to be annoying, but I need money.
+</a>
+</>}

src/components/Comments.astro

@@ -20,7 +20,7 @@ import HR from "../components/HR.astro";
             @apply font-mono hover:underline;
         }
         blockquote {
-            @apply p-2 pl-4 mb-2 border-l-4 border-l-gray-600 dark:border-l-gray-300 rounded-l-md bg-crusta-100 dark:bg-night-950 dark:bg-opacity-80 text-current;
+            @apply p-2 pl-4 mb-2 border-l-4 border-l-crusta-300 dark:border-l-night-600 rounded-l-md bg-crusta-100 dark:bg-night-950 dark:bg-opacity-80 text-current;
         }
         textarea {
             @apply p-2 w-full bg-crusta-100 dark:bg-night-950 dark:bg-opacity-80;
@@ -41,18 +41,18 @@ import HR from "../components/HR.astro";
     <h2 class="">Comments</h2>
     <!-- <p>To leave your own comment, please <a href="/">login or register</a> your eleboog.com account.</p> -->
     <form method="POST">
-        <label for="commentbox">Leave a comment as <a class="font-mono text-lg">kebokyo</a>&emsp;&mdash;&emsp;Markdown enabled ( <a class="font-mono text-lg">huh?</a> )</label>
+        <label for="commentbox">Leave a comment as <a class="font-mono text-lg">kebokyo</a>&ensp;&mdash;&ensp;Markdown enabled ( <a class="font-mono text-lg">huh?</a> )</label>
         <textarea id="commentbox" name="commentbox" rows="4"/>
        
         <div class="textboxfooter">// <input type="submit" value="submit!"/> or press ctrl (cmd) + enter</div>
     </form>
-    <p>By leaving a comment, you agree to the eleboog.com <a>code of conduct</a>. Dishonorable behavior may lead to account limits or termination.</p>
-    <div class="my-2 border-b-2 border-crusta-500 dark:border-night-400 border-opacity-50 w-full"/>
+    <p>By leaving a comment, you agree to the eleboog.com <a class="text-sm">code of conduct</a>. Dishonorable behavior may lead to account limits or termination.</p>
+    <HR class="border-crusta-400 dark:border-night-600 border-dashed"/>
     <div class="commentheader mb-0">&starf; <a class="font-mono text-lg">kebokyo</a> (it/its) &mdash; May 4, 2025</div>
     <div class="commentblock pl-2 pt-1 mb-1 border-l-4  border-crusta-500 dark:border-night-400">
-        This is a markup of what I want the comments to look like.
-        <br/><br/>Like the rest of the site, minimal visual elements & unique text formatting is used to give a text-focused approach that
-        can easily be scaled back for "lite" or gemini versions of the site.
+        <p class="mb-1">This is a markup of what I want the comments to look like.</p>
+        <p>Like the rest of the site, minimal visual elements & unique text formatting are used to give a text-focused approach that
+        can easily be scaled back for "lite" or gemini versions of the site.</p>
         <div class="commentsig font-mono mb-0">
             &starf; site owner of eleboog.com
         </div>
@@ -60,23 +60,23 @@ import HR from "../components/HR.astro";
             2 <span class="font-sans text-sm">&hearts;</span>&emsp;//&emsp;<a>reply</a> - <a>quote</a>&emsp;//&emsp;<a>edit</a> - <a class="text-red-500 dark:text-red-400">delete x</a>
         </div>
     </div>
-    <div class="commentindent pl-2 mb-2 border-l-2 border-b-2 border-gray-600 dark:border-gray-300">
+    <div class="commentindent pl-2 mb-2 border-l-2 border-b-2 border-gray-300 dark:border-gray-600">
         <div class="commentheader mb-0">&bullet; <a style="">user</a> (they/them) &mdash; May 4, 2025</div>
         <div class="commentblock pl-2 pt-1 mb-1 border-l-4 border-crusta-500 dark:border-night-400">
-            This would be a reply to the above comment.
+            <p>This would be a reply to the above comment.</p>
             <div class="commentsig font-mono mb-0">
                 &CenterDot; insert signature here
             </div>
             <div class="commentfooter font-mono mb-2">
-                3 <span class="font-sans text-sm">&hearts;</span>&check; (<a>unlike</a>)&emsp;//&emsp;<a>reply</a> - <a>quote</a>
+                3 <span class="font-sans text-sm text-crusta-500 dark:text-night-500">&hearts;</span>&check; (<a>unlike</a>)&emsp;//&emsp;<a>reply</a> - <a>quote</a>
             </div>
         </div>
-        <div class="commentindent pl-2 mb-2 border-l-2 border-b-2 border-gray-600 dark:border-gray-300">
+        <div class="commentindent pl-2 mb-2 border-l-2 border-b-2 border-gray-300 dark:border-gray-600">
             <div class="commentheader mb-0">&bullet; <a style="">user2</a> (they/them) &mdash; May 4, 2025</div>
             <div class="commentblock pl-2 pt-1 mb-1 border-l-4  border-crusta-500 dark:border-night-400">
                 <blockquote>
                     <p><i><a class="font-mono">user</a> said on May 4, 2025...</i>&emsp;(<a class="font-mono">jump to &uparrow;</a>)</p>
-                    This would be a reply to the above comment.
+                    <p>This would be a reply to the above comment.</p>
                 </blockquote>
                 This would be an example of a "quoted" reply.
                 <div class="commentsig font-mono mb-0">
@@ -86,12 +86,12 @@ import HR from "../components/HR.astro";
                     2 <span class="font-sans text-sm">&hearts;</span> (<a>like?</a>)&emsp;//&emsp;<a>reply</a> - <a>quote</a>
                 </div>
             </div>
-            <div class="commentindent pl-2 mb-2 border-l-2 border-b-2 border-gray-600 dark:border-gray-300">
+            <div class="commentindent pl-2 mb-2 border-l-2 border-b-2 border-gray-300 dark:border-gray-600">
                 <i>3 more replies in thread...</i>&emsp;<a class="font-mono text-lg">explore &rightarrow;</a>
             </div>
             <div class="commentheader mb-0">&bullet; <a style="">user3</a> (they/them) &mdash; May 4, 2025</div>
             <div class="commentblock pl-2 pt-1 mb-2 border-l-4 border-b-2 border-crusta-500 dark:border-night-400">
-                One more reply for good measure...
+                <p>One more reply for good measure...</p>
                 <div class="commentsig font-mono mb-0">
                     &CenterDot; fdhsfklasdfijsdlfnkasfnsaf
                 </div>

src/components/Header.astro

@@ -8,31 +8,37 @@ const user = Astro.locals.user;
 
 <div>
     <!-- Header -->
-    <div class="flex items-baseline">
-        <a href="/" class="text-2xl xs:text-3xl sm:text-4xl font-serif title-gradient pb-2">
-        eleboog<span class='title-dot'>.</span>com
-        </a>
-        <div class="flex w-8 self-baseline h-1 border-t border-crusta-200 dark:border-night-800 mx-2"></div>
-        <h2 class="font-mono text-xl sm:text-2xl">{current}</h2>
+    <div class="md:flex items-baseline justify-between">
+        <div class="flex items-baseline">
+            <span class="hover:underline">
+            <a href="/" class="text-2xl xs:text-3xl sm:text-4xl font-serif title-gradient pb-2">
+            eleboog<span class='title-dot'>.</span>com
+            </a>
+            </span>
+            <div class="flex w-8 self-baseline h-1 border-t border-crusta-200 dark:border-night-800 mx-2"></div>
+            <h2 class="font-mono text-xl sm:text-2xl">{current}</h2>
+        </div>
+        <div>
+            <h2 class="font-mono mb-4 text-lg">
+                <a href='/newest' class="text-subtitle hover:underline">newest</a>
+                / 
+                <a href='/blog/' class="text-subtitle hover:underline">archive</a>
+                / 
+                <a href='/journal' class="text-subtitle hover:underline">journal</a>
+                / 
+                <span class="nav-extras">
+                <a href='/sharefeed' class="text-subtitle hover:underline">sharefeed</a>
+                / 
+                <a href="/me" class="text-subtitle hover:underline">me</a>
+                / 
+                <a href="/cool" class="text-subtitle hover:underline">cool</a>
+                / 
+                <a href='/feeds' class="text-subtitle hover:underline">rss</a>
+                </span>
+                <a href="/more" class="nav-more text-subtitle hover:underline">more</a>
+            </h2>
+        </div>
     </div>
-
-    <!-- Navbar -->
-    <h2 class="font-mono mb-2 text-lg">
-        <a href='/newest' class="text-subtitle hover:underline">newest</a>
-         / 
-        <a href='/blog/' class="text-subtitle hover:underline">archive</a>
-         / 
-        <a href='/journal' class="text-subtitle hover:underline">journal</a>
-         / 
-        <a href='/sharefeed' class="text-subtitle hover:underline">sharefeed</a>
-         / 
-        <a href="/me" class="text-subtitle hover:underline">me</a>
-         / 
-        <a href="/cool" class="text-subtitle hover:underline">cool</a>
-         / 
-        <a href='/feeds' class="text-subtitle hover:underline">rss</a>
-    </h2>
-
     <!-- auth shenanigans -->
     <div class="authbar mb-4 font-mono">
         {Astro.locals.session ? <div>

src/components/mdx/MDXImage.astro

@@ -18,5 +18,6 @@ const props = Astro.props
             '--props-center': props.center ? 'auto' : 'none',
         }}
     />
+    
     <p class="text-sm italic text-subtitle mt-2">{props.alt}</p>
 </div>

src/content/posts/2025-06-14-1yranni.mdx

@@ -0,0 +1,59 @@
+---
+date: 2025-06-16 13:00:00
+title: It's the one year anniversary!
+summary: ...pretty much. Talking about my current plans for the site and what I'm going to do with it now that I am free from school.
+draft: true
+---
+
+Blow the party horns. My first ever post on this version of the blog happened on June 18, 2024 ~~even though it says the 17th, 
+i still need to fix that~~. It is now June *16*, 2025. Close enough. HAPPY ONE YEAR!!!!!
+
+To be fair, I *did* change the backend from Next.js to Astro around eight months ago, so I haven't been on this specific *core* of the blog 
+for a year, but as far as the design goes, it's been almost a full year. Wowzers.
+
+I figured now would be a good time to do a little reflection of this site to honor the occassion, so let's do that. This may end up looking
+like a collection of random notes, but since I'm doing this for myself as much as I am doing it for The Gram®, I figured just
+getting these thoughts *out there*, no matter how neatly they're organized, would be the best approach.
+
+# what worked
+
+The design Just Works™ for the most part. It has a light and dark mode theme that syncs with your browser, that functionality works
+very well thanks to Tailwind, and currently I have no plans for iterating on that (adding a toggle to keep it on light or dark & saving
+it with a cookie, for example). I like how things are mostly text focused with minimal added fluff.
+
+Astro as a framework mostly works. I like how I can create standalone MDX pages that Just Work™, albeit with some extra addons and
+configuring needed. It has a solid foundation for me to work off of but also allows me to go beyond it if needed. I really like how it uses
+server-side rendering instead of client-side rendering like a lot of other "modern" frameworks — navigating it feels like how
+web pages *should* work.
+
+# what didn't
+
+The current dark theme needs a bit more contrast. I know it's bad to put blue text on a black background, but I did it anyway, and there are
+some darker hues that just do not work.
+
+I love the monospace font, Monofur... but I'm not sure if it's working well for what I want to use it for. I might need to try out different
+fonts in the future and see if there's a similarly quirky once that's more legible I could use instead (e. comic mono / shanns).
+
+Next.js... was okay at first, but not the right fit for me. It's designed for 🍊-worthy SPA's, not personal blogs. Astro is *starting*
+to hit similar notes for me now, but that's mostly in how it's a more niche framework not a lot of people have built stuff around. Also,
+the "content" system is inferior to Contentlayer in my very humble opinion. I would rather just use Contentlayer than have to work around
+Astro's built-in content management system like I have to do now.
+
+# what to do next
+
+First, update a bunch of stuff on the site that is no longer relevant to my current situation. I no longer have a "school bag", for example,
+and my trusty M1 MacBook Air currently has the macOS 26 beta on it... because *I'm not really using it much anymore.*
+
+I've already done a *couple* of minor visual tweaks, like (finally) making the maximum content width a bit higher to better fill out large
+desktop screens... but that's lead to some slight consequences, like with the banner image on blog posts being way too big and pushing
+the rest of the content down. Now that I am no longer trying to follow my No JavaScript Ever™ policy, I think building in some slight
+responsive design would be cool. I'll need to work on the design, though.
+
+For bigger things, I need to do a full accessibility sweep. Make sure any sticking points are addressed. Possibly get plaintext versions of posts up and running to later
+utilize when I (again, possibly) make a geminispace fork of the site.
+
+If I decide it's time to do a backend rewrite (because i love doing those for some reason), try going for a framework that has *less* batteries
+included. My mentor is really into Hono because of *how* light it is, but I really hate how it does routing. Something like that or HTMX
+would be worth looking into if I want to go that route, though.
+
+And finally... I need to make it easier for me to update this blog.

src/content/posts/2025-06-21-sharefeed-chrome.mdx

@@ -0,0 +1,8 @@
+---
+date: 2025-06-21 13:00:00
+title: I made a silly thing (sharefeed-chrome)
+summary: I made a silly little Chrome extension I created to more easily create Sharefeed entries while I am on the web. A brief overview of its functionality and the process I went through to make it.
+draft: true
+---
+
+For the longest time, I've wanted to be more dilligent in updating my [sharefeed](/sharefeed)

src/data/sharefeed.json

@@ -1,209 +1,241 @@
 {
     "sharefeed" : [
+        {
+            "url": "https://update.botghost.com/",
+            "title": "Discord is Threatening to Shutdown BotGhost: The Enshittification of Discord.",
+            "author": "",
+            "publishedDate": "2025-06-23 13:00:00",
+            "accessedDate": "2025-06-23 16:16:29",
+            "note": "This is the most hilarious \"we are being shut down by the company we rely on for our SaaS\" notice I have seen in a while. Discord's TOS clearly forbids BotGhost's entire business strategy. Absolute cinema. Just in case, here's an archive link too: https://archive.ph/oBdS9"
+        },
+        {
+            "url": "https://www.youtube.com/watch?v=oTOu7VfXnl8",
+            "title": "the dream music player, finally.",
+            "author": "Bread on Penguins",
+            "publishedDate": "2025-05-21 12:30:21",
+            "accessedDate": "2025-06-23 11:15:30",
+            "note": "also this video, this video is so great. i need that globe"
+        },
+        {
+            "url": "https://www.youtube.com/watch?v=nXaMfy5GYCo",
+            "title": "My Dad Switched To Linux",
+            "author": "Oscar",
+            "publishedDate": "2025-06-07 07:28:21",
+            "accessedDate": "2025-06-23 11:05:06",
+            "note": "If all Linux videos would be like this, the year of the Linux desktop would actually be feasible."
+        },
+        {
+            "url": "https://github.com/izabera/bitwise-challenge-2048",
+            "title": "bitwise-challenge-2048 - 2048 with only 64 bits of state",
+            "author": "Isabella Bosia",
+            "publishedDate": "",
+            "accessedDate": "2025-06-22 21:22:24",
+            "note": "Cute retro implementation of that one game everyone loves to recreate. I also like the idea of sharing your board with someone else with the `$STATE` variable."
+        },
         {
             "url": "https://danco.substack.com/p/have-you-ever-seen-a-goth-downtown",
             "author": "Alex Danco",
             "title": "Have you ever seen a goth downtown? - Creativity after AI",
-            "pubDate": "2025-08-14",
-            "date": "2025-02-18 15:00",
+            "publishedDate": "2025-08-14",
+            "accessedDate": "2025-02-18 15:00",
             "note": "Even though there's some AI glazing in this article, and the goth analogy is a little back-asswards, I think the main point of this is important: In the persuit of reducing hallucinations, generative AI has become more and more sanatized, corporate, and \"safe\". As we transition into a post-GPT society, creative work will inneviatably become more and more cookie-cutter as AI is incorporated more and more into workflows, either by choice or by corporate demand. In my opinion, the best thing to do in response is to be unabashedly freaky with it in spite of this."
         },
         {
             "url": "https://www.scattered-thoughts.net/writing/small-tech/",
             "author": "Jamie Brandon",
             "title": "Small Tech",
-            "pubDate": "2020-09-07",
-            "date": "2025-02-18 14:00",
+            "publishedDate": "2020-09-07",
+            "accessedDate": "2025-02-18 14:00",
             "note": "An honor roll of smaller tech companies and/or projects that maintain their quality and authenticity in a world full of venture capital and startup sellouts. I wanna highlight the Sublime shoutout: I love Sublime, all my homies love Sublime, and if you don't you aren't a real one /j"
         },
         {
             "url": "https://joyarbitrage.substack.com/p/find-your-2ers",
             "author": "Tadzio Dlugoleki",
             "title": "find your 2%ers - then do life with them.",
-            "pubDate": "2023-12-12",
-            "date": "2025-02-18 13:00",
+            "publishedDate": "2023-12-12",
+            "accessedDate": "2025-02-18 13:00",
             "note": "A (slightly millennially pretentious) thinkpiece about the importance of finding people you vibe with well and keeping those relationships healthy."
         },
         {
             "url": "https://github.com/dplanitzer/Serena",
             "author": "Dietmar Planitzer",
             "title": "Serena - An experimental operating system for 32bit Amiga computers.",
-            "date": "2024-08-14 13:00",
+            "accessedDate": "2024-08-14 13:00",
             "note": "If I had an Amiga, I would be geeking out so much about this. You would not see me for days."
         },
         {
             "url": "https://chuck.is/news/",
             "author": "Chuck Carrol",
             "title": "The News is Information Junk Food",
-            "pubDate": "2022-09-16",
-            "date": "2024-08-09 16:00",
+            "publishedDate": "2022-09-16",
+            "accessedDate": "2024-08-09 16:00",
             "note": "A discussion about the negative affects the 24 hour news cycle has on us. I want to dissect this further cause I have a feeling there's some nuggets of bad takes in here, but the overall takeway I agree with. If I had a nickel for every time my social media feed ended up getting overrun by political nonsense, I would have... uh... five nickels? What can you buy for a quarter nowadays? ...hmm"
         },
         {
             "url": "https://github.com/vpand/icpp",
             "author": "VPAND Team",
             "title": "icpp - Running C++ in anywhere like a script.",
-            "date": "2024-08-09 15:00",
+            "accessedDate": "2024-08-09 15:00",
             "note": "I just think it's funny okay"
         },
         {
             "url": "https://jon.bo/posts/digital-tools/",
             "author": "Jonathan Borichevskiy",
             "title": "Digital Tools I Wish Existed",
-            "pubDate": "2019-11-28",
-            "date": "2024-08-09 14:00",
+            "publishedDate": "2019-11-28",
+            "accessedDate": "2024-08-09 14:00",
             "note": "Interesting exploration of digital information gathering, consumption, and archive tools that the author wish existed. I want to make a response to this one day with my own ideas and critiques of the particular features he wants (whether they make sense to me or not and if not what alternatives I think would be good instead)."
         },
         {
             "url": "https://stack-auth.com",
             "author": "Stackframe Inc.",
             "title": "Stack Auth - Open-source Clerk/Auth0 alternative",
-            "date": "2024-08-09 13:00",
+            "accessedDate": "2024-08-09 13:00",
             "note": "A really promising open source alternative to WYSIWIG auth solutions like Clerk and Auth0. I would need to confirm its security and its flexibility, but the fact that they specifically say \"hey, you can totally just use your own frontend and use our SDK in the background\" makes me very excited. All of the user-facing elements can be styled my own way, while the internal admin elements can just be the defaults so I don't have to code it all. I might end up using this instead of Auth.js for phase 2 of my site if this lives up to my expectations."
         },
         {
             "url": "https://tonsky.me/blog/diagrams/",
             "author": "Niki Tonsky",
             "title": "Where Should Visual Programming Go?",
-            "pubDate": "2024-07-18",
-            "date": "2024-07-27 14:00",
+            "publishedDate": "2024-07-18",
+            "accessedDate": "2024-07-27 14:00",
             "note": "A discussion about what incorporating diagrams and other visualizations into your codebase could and should look like. I think the idea of embedding diagrams into your comments is a very good idea (in fact, we should be using markdown in our docs already), but I'm not sure how useful creating parsable visual state machines and etc. would be. Fun fact: there seems to be a pseudo-collab-tool built into the site where you can see where other readers' cursors are. I kept trying to hold digital hands with the other cursor but it kept running away from me. Why are you so mean ;w;"
         },
         {
             "url": "https://blog.singleton.io/posts/2022-10-17-otp-on-wrist/",
             "author": "David Singleton",
             "title": "TOTP tokens on my wrist with the smartest dumb watch.",
-            "pubDate": "2022-10-17",
-            "date": "2024-07-27 13:00",
+            "publishedDate": "2022-10-17",
+            "accessedDate": "2024-07-27 13:00",
             "note": "A demonstration of the Sensor Watch, a replacement motherboard for the famous Casio F-91W digital watch that turns it into a programmable ARM Cortex M0+ powered smartwatch. It is absolutely wild, and I want one now even though the motherboard costs more than the watch itself. The idea of a wearable version of those Square Enix TOTP devices is so fascinating to me."
         },
         {
             "url": "https://semanticdiff.com/blog/language-aware-diff-how-far/",
             "author": "Michael Müller",
             "title": "How far should a programming language aware diff go?",
-            "pubDate": "2024-07-17",
-            "date": "2024-07-25",
+            "publishedDate": "2024-07-17",
+            "accessedDate": "2024-07-25",
             "note": "A fun look on what differences in code could be considered \"irrelevant changes\" and the consequences of ignoring such changes. Note: This is a corporate blog post made for a VSCode and GitHub extension for \"language aware diff\" that includes premium software support."
         },
         {
             "url": "https://scrapscript.org",
             "author": "Max Bernstein",
             "title": "scrapscript - A functional, content-addressable programming language",
-            "date": "2024-07-24",
+            "accessedDate": "2024-07-24",
             "note": "An interesting new scripting language that's basically Haskell but if it was even weirder. I want to make a blog post about this one day discussing how it compares to other programming languages and how it could be used."
         },
         {
             "url": "https://thetinypod.com",
             "title": "tinypod - an iPod-style case for the Apple Watch",
-            "date": "2024-07-20",
+            "accessedDate": "2024-07-20",
             "note": "A really cute concept for taking a computer on your wrist and adapting it into a digital detox device. The regular model is a little too expensive for my liking, but the \"lite\" model is cheap enough that I could justify trying it out with my own Apple Watch (once I find it again lol)."
         },
         {
             "url": "https://simonwillison.net/2024/Jul/13/give-people-something-to-link-to/",
             "author": "Simon Willson",
             "title": "Give people something to link to so they can talk about your features and ideas",
-            "pubDate": "2024-07-13",
-            "date": "2024-07-14",
+            "publishedDate": "2024-07-13",
+            "accessedDate": "2024-07-14",
             "note": "If you want people to be able to talk about an idea, concept, or feature that you develop, you should have a resource about it for people to easily reference. ChatGPT being used as an example is slightly cringe, but it works to show what not to do."
         },
         {
             "url": "https://openpipe.ai/blog/hn-ai-crypto",
             "author": "Kyle Corbitt",
             "title": "Is AI the Next Crypto? Insights from 2M HN comments",
-            "pubDate": "2023-11-08",
-            "date": "2023-11-08",
+            "publishedDate": "2023-11-08",
+            "accessedDate": "2023-11-08",
             "note": "An analysis of Hacker News' sentiment towards AI compared to NFT's... using AI. Big note: this is a very cleverly disguised ad for OpenPipe, the service which is hosting this article, but I actually appreciated how it broke down the details of how the author computed his data. I wish there was a bit more analysis of the results, though."
         },
         {
             "url": "https://mariusbancila.ro/blog/2023/09/12/formatting-text-in-c-the-old-and-the-new-ways/",
             "author": "Marius Brancila",
             "title": "Formatting Text in C++: The Old and The New Ways",
-            "pubDate": "2023-09-12",
-            "date": "2023-11-07 14:00:00",
+            "publishedDate": "2023-09-12",
+            "accessedDate": "2023-11-07 14:00:00",
             "note": "C++20 introduced some new std functions to format strings: std::format and std::format_to. In practice, they work much like a streamlined version of C's printf. However, their implementation (based on the library {fmt}) results in much higher efficiency! Apparently the guys at C++ really like it because the new std::print function in C++23 has the functionality of std::format built in. I'm curious to see how this will change C++ devs' workflows, including newbies coming to C++ from other languages like Java or Python."
         },
         {
             "url": "https://github.com/jesseduffield/horcrux",
             "author": "Jesse Duffield",
             "title": "horcrux - Split your file into encrypted fragments so that you don't need to remember a passcode",
-            "date": "2023-11-07 13:00:00",
+            "accessedDate": "2023-11-07 13:00:00",
             "note": "A simple terminal program that allows you to split files into encrypted chunks that can later be re-combined into the original file. Think of it like a RAID setup but for individual files or archives, inspired by an everything-phobic fantasy media franchise. I actually find the concept really facinating: it could be a good way to split up large media files and share them over the internet. Even if one horcrux gets corrupted, the others can still make up the original file, and since it is encrypted, it's tougher to discern what the original file is without enough pieces to put it together."
         },
         {
             "url": "https://stytch.com/blog/open-sourcing-sqx-a-way-to-build-flexible-database-models-in-go/",
             "author": "Logan Gore",
             "title": "Open-sourcing SQX, a way to build flexible database models in Go",
-            "pubDate": "2023-08-31",
-            "date": "2023-09-09 14:00:00",
+            "publishedDate": "2023-08-31",
+            "accessedDate": "2023-09-09 14:00:00",
             "note": "A really cool SQL interface for Go that both simplifies a lot of the boilerplate and allows for quickly building complex models through OOP. I don't have any experience in Go, but I'm honestly tempted to start learning Go just to try this library out and see if a port of it to other languages like C++ or Rust is possible."
         },
         {
             "url": "https://muldoon.cloud/2023/09/06/software-keeps-failing.html",
             "author": "Mickey Muldoon",
             "title": "Every Software Project is a Startup That Will Probably Fail",
-            "pubDate": "2023-09-06",
-            "date": "2023-09-09 13:00:00",
+            "publishedDate": "2023-09-06",
+            "accessedDate": "2023-09-09 13:00:00",
             "note": "A short retrospective on the reality of software projects: the value you get out of most of them is the lessons you learn when they crumble. I feel like this lesson could be told in a way less intrinsic to our dumb economic system, but I don't have enough brain capacity to write that up right now."
         },
         {
             "url": "https://ploum.net/2023-07-06-stop-trying-to-make-social-networks-succeed.html",
             "author": "Lionel Dricot",
             "title": "Stop Trying to Make Social Networks Succeed",
-            "pubDate": "2023-07-06",
-            "date": "2023-07-06",
+            "publishedDate": "2023-07-06",
+            "accessedDate": "2023-07-06",
             "note": "Social networks will never become universal or ubiquitous in the way companies and VC's want them to. Every social network will appeal to certain people more than others, so the best social network is the one that works best for you and your contacts. If one doesn't exist... make one! (or have someone else make it for you)."
         },
         {
             "url": "https://www.reproof.app/blog/notes-apps-help-us-forget",
             "author": "Matthew Guay",
             "title": "Notes apps are where ideas go to die. And that’s good.",
-            "pubDate": "2022-02-15",
-            "date": "2023-06-03 14:00:00",
+            "publishedDate": "2022-02-15",
+            "accessedDate": "2023-06-03 14:00:00",
             "note": "Notes apps always market themselves as tools to remember important things before they leave your mind. But maybe we should think of it the other way instead: notes afford us the ability to let thoughts leave our mind since we have already saved the information elsewhere."
         },
         {
             "url": "https://kapeli.com/dash",
             "title": "Dash for macOS - an API Documentation Browser and Code Snippet Manager",
-            "date": "2023-06-03 13:00:00",
+            "accessedDate": "2023-06-03 13:00:00",
             "note": "Really cool offline documentation viewer for macOS... that's also $30 for some reason. DESPITE THERE BEING AN OFFICAL OPEN SOURCE PORT TO WINDOWS AND LINUX. I AM GOING TO COMBUST"
         },
         {
             "url": "https://blog.jim-nielsen.com/2023/deadlines-as-technology/",
             "author": "Jim Nielsen",
             "title": "Deadlines as Technology",
-            "pubDate": "2023-03-09",
-            "date": "2023-05-20",
+            "publishedDate": "2023-03-09",
+            "accessedDate": "2023-05-20",
             "note": "My ADHD means I always procrastinate things until the last minute. Well, if there is no 'last minute' -- i.e. there is no deadline -- shit won't get done. If you try to pace yourself to hit certain self-set deadlines, you may find that work becomes easier."
         },
         {
             "url": "https://tech.news.am/eng/news/510/worlds-first-portable-quantum-computers-on-sale-in-japan-prices-start-at-$8700.html",
             "author": "News.am",
             "title": "World's first portable quantum computers on sale in Japan: Prices start at $8,700",
-            "pubDate": "2022-12-21",
-            "date": "2023-05-20 15:00:00",
+            "publishedDate": "2022-12-21",
+            "accessedDate": "2023-05-20 15:00:00",
             "note": "they put an android tablet on a fucking quantum computer, i'm shitting and cumming rn"
         },
         {
             "url": "https://userinyerface.com/",
             "author": "Verhaert",
             "title": "User Inyerface",
-            "date": "2023-05-20 14:00:00",
+            "accessedDate": "2023-05-20 14:00:00",
             "note": "Want to hate technology and how all of its innovations can be used for great evil? Try to work your way through this."
         },
         {
             "url": "https://walkingtheworld.substack.com/p/why-the-us-cant-have-nice-things",
             "author": "Chris Arnade",
             "title": "Why the US can't have nice things - A rant on bus stops",
-            "pubDate": "2023-05-20",
-            "date": "2023-05-20 13:00:00",
+            "publishedDate": "2023-05-20",
+            "accessedDate": "2023-05-20 13:00:00",
             "note": "A blog post on why US public works suck so much: the government doesn't trust its citizens to utilize public works properly nor make their own organic solutions for public issues. Really good read!"
         },
         {
             "url": "https://fortelabs.com/blog/the-secret-power-of-read-it-later-apps/",
             "author": "Tiago Forte",
             "title": "The Secret Power of 'Read-It-Later' Apps",
-            "pubDate": "2022-12-06",
-            "date": "2023-05-19",
+            "publishedDate": "2022-12-06",
+            "accessedDate": "2023-05-19",
             "note": "An article on the benefits of using 'read-it-later' apps. There are so many things wrong with this article that I'm definitely going to make a blog post responding to it at some point. Despite that, it is part of the inspiration for this feed... so thanks, I guess?"
         }
     ]

src/layouts/BaseLayout.astro

@@ -6,8 +6,11 @@ import '../styles/globals.css'
 
 import Header from '../components/Header.astro'
 import Footer from '../components/Footer.astro'
+import AttentionBar from '../components/AttentionBar.astro'
 
-const { title } = Astro.props
+const { title, description, ogImage } = Astro.props
+
+const ogImageUrl = ogImage ? "https://eleboog.com" + ogImage : "https://eleboog.com/blog/blogbanner.png"
 
 ---
 
@@ -19,12 +22,28 @@ const { title } = Astro.props
 		<meta name="viewport" content="width=device-width" />
 		<meta name="generator" content={Astro.generator} />
 		<title>{title ? title + ' - eleboog.com' : 'eleboog.com'}</title>
+
+		{/* open graph babeeeee */}
+		<meta property="og:title" content={title ? title + ' - eleboog.com' : 'eleboog.com'} />
+		<meta property="og:site_name" content="eleboog.com" />
+		<meta property="og:description" content={description ?? "My personal website, containing blog posts, a mini journal, and other projects. The dark side of the sauce."} />
+		<meta property="og:type" content="website" />
+		<meta property="og:image" content={ ogImageUrl } />
+		<meta property="og:image:secure_url" content={ ogImageUrl } />
+		<meta property="og:image:width" content="1280" />
+		<meta property="og:image:height" content="720" />
+		<meta property="twitter:title" content={title ? title + ' - eleboog.com' : 'eleboog.com'} />
+		<meta property="twitter:card" content="summary_large_image" />
+		<meta property="twitter:image" content={ ogImageUrl } />
 	</head>
-	<body class="flex-col mx-auto min-h-screen max-w-screen-md p-8 py-4">
-		<Header current={title}/>
-		<main>
-			<slot/>
-		</main>
-		<Footer/>
+	<body>
+		<AttentionBar/>
+		<div class="main-spacing">
+			<Header current={title}/>
+			<main>
+				<slot/>
+			</main>
+			<Footer/>
+		</div>
 	</body>
 </html>

src/layouts/PostLayout.astro

@@ -40,7 +40,7 @@ const numberToWord = (num: number) => {
 		<meta name="generator" content={Astro.generator} />
 		<title>{title ? title + ' - eleboog.com' : 'eleboog.com'}</title>
 	</head>
-	<body class="flex-col mx-auto min-h-screen max-w-screen-md p-8 py-4">
+	<body class="main-spacing">
 		<Header current='blog post'/>
 		<main>
 			{ ( fm.cover && fm.cover_alt ) ? (

src/layouts/StandaloneMDXLayout.astro

@@ -24,7 +24,7 @@ const title = frontmatter.slug ?? 'me'
 		<meta name="generator" content={Astro.generator} />
 		<title>{title ? title + ' - eleboog.com' : 'eleboog.com'}</title>
 	</head>
-	<body class="flex-col mx-auto min-h-screen max-w-screen-md p-8 py-4">
+	<body class="main-spacing">
 		<Header current={title}/>
 		<main>
 			<h1 class="text-3xl font-serif my-2">{frontmatter.title}</h1>

src/lib/feed.ts

@@ -39,7 +39,7 @@ export async function computeFeed() {
 
 export function addSharefeedEntriesToFeed(feed: Feed, main?: boolean) {
     const entries = sfjson.sharefeed
-        .sort((a:ShareFeedEntry, b:ShareFeedEntry) => compareDesc(new Date(a.date), new Date(b.date))) 
+        .sort((a:ShareFeedEntry, b:ShareFeedEntry) => compareDesc(new Date(a.accessedDate), new Date(b.accessedDate))) 
         .filter((entry:ShareFeedEntry) => !(entry.draft))
         .slice(0,15);
     
@@ -65,7 +65,7 @@ export function addSharefeedEntriesToFeed(feed: Feed, main?: boolean) {
             author: [{
                 name: entry.author
             }],
-            date: toZonedTime(entry.date, timeZone)
+            date: toZonedTime(entry.accessedDate, timeZone)
         })
     })
 }

src/lib/utils.ts

@@ -3,8 +3,8 @@ export type ShareFeedEntry = {
   author?: string,
   email?: string,
   baseUrl?: string,
-  date: string,
-  pubDate?: string,
+  accessedDate: string,
+  publishedDate?: string,
   title: string,
   note: string,
   draft?: boolean

src/pages/cool.mdx

@@ -22,5 +22,5 @@ I thought about making a blogroll, but I decided instead to make a button galler
 
 If you want to link my website to your page like this, feel free to use these buttons I made!
 
-<a href="https://eleboog.com" style=" max "><img src="/eleboog_button.jpg" class="border-none shadow-none inline rounded-none" alt="A button for eleboog dot com in a blue color pallete."/></a>
-<a href="https://eleboog.com" style=" max "><img src="/eleboog_button_light.jpg" class="border-none shadow-none inline rounded-none" alt="A button for eleboog dot com in an orange color pallete."/></a>
+<a href="https://eleboog.com" style=" max "><img width="88" height="31" src="/buttons/eleboog_button.jpg" class="border-none shadow-none inline rounded-none" alt="A button for eleboog dot com in a blue color pallete."/></a>
+<a href="https://eleboog.com" style=" max "><img width="88" height="31" src="/buttons/eleboog_button_light.jpg" class="border-none shadow-none inline rounded-none" alt="A button for eleboog dot com in an orange color pallete."/></a>

src/pages/index.astro

@@ -14,6 +14,9 @@ import { getCollection } from 'astro:content';
 const posts = await getCollection('posts')
 
 import { timeZone } from "../lib/utils";
+import HR from '../components/HR.astro';
+
+let okay = 0;
 
 ---
 
@@ -31,14 +34,14 @@ import { timeZone } from "../lib/utils";
       <p class="mb-2">Expect posts once or twice a week, I guess.</p>
 
       <p class="mb-2"><b>Last journal update:</b>
-        <a href="/journal" class="font-serif text-subtitle text-sm hover:underline">February 18, 2024</a>
+        <a href="/journal" class="font-serif text-subtitle text-sm hover:underline">June 23, 2025</a>
       </p>
       
       <h2 class="font-serif text-2xl mb-2">recent posts</h2>
       <ul class="space-y-2 mb-2">
         {posts.sort((a, b) => compareDesc(new Date(a.data.date), new Date(b.data.date))).map((post, idx) => {
-          if (idx >= 3 || post.data.draft) return;
-          console.log(toZonedTime(post.data.date, timeZone));
+          if (okay >= 3 || post.data.draft) return;
+          okay++;
           return (
             <li >
               <a href={'/posts/' + post.slug} class="font-serif text-lg text-crusta-400 dark:text-night-300 hover:underline">{post.data.title}</a>
@@ -49,14 +52,16 @@ import { timeZone } from "../lib/utils";
         })}
       </ul>
       <p class="mb-2"><a href="/blog" class="text-subtitle italic hover:text-current">find more posts →</a></p>
-      <h2 class="font-serif text-2xl mb-2">webrings</h2>
-      <div class="flex items-baseline">
+      <HR/>
+      <div class="flex items-center">
         <a class="text-subtitle hover:text-current" href="https://fediring.net/previous?host=eleboog.com">←&ensp;</a>
         <a class="text-subtitle hover:text-current" href="https://fediring.net/">Fediring</a>
         <a class="text-subtitle hover:text-current" href="https://fediring.net/next?host=eleboog.com">&ensp;→</a>
-        <div class="flex w-4 self-baseline h-1 border-t border-crusta-200 dark:border-night-800 mx-2"></div>
+        &emsp;&emsp;
         <a class="text-subtitle hover:text-current" href="https://webring.bucketfish.me/redirect.html?to=prev&name=kebokyo">←&ensp;</a>
         <a class="text-subtitle hover:text-current" href="https://webring.bucketfish.me">bucket webring</a>
         <a class="text-subtitle hover:text-current" href="https://webring.bucketfish.me/redirect.html?to=next&name=kebokyo">&ensp;→</a>
+        &emsp;&emsp;
+        <a href="https://512kb.club"><img width="88" height="31" src="/buttons/green-team.gif" alt="a proud member of the green team of 512KB club" /></a>
       </div>
 </BaseLayout>

src/pages/journal.mdx

@@ -13,19 +13,68 @@ import Icon from "../components/Icon.astro";
 
 ## now
 
-Why do I do the things I do?
+when your girlfriend tells you to drink your goddamn tea, you better drink your goddamn tea
 
 ---
 
 <MDXAccordion title="todo">
     - [ ] Make an editing pass on the last blog post (FINALLY) so I can stop worrying about it.
-    - [ ] Just. Write. Goddammit.
+    - [ ] Make another blog post this month.
     - [ ] Update the Sharefeed a little more maybe? As a treat?
-    - [ ] Figure out how to make the API route serving the Atom feed ([feed.xml](../feeds/feed.xml)) actually send an xml file that can be recognized by the browser (i.e. allowing for a `.xsl` to work with it and/or opening it automatically in your RSS reader of choice).
+    - [x] ~~Figure out how to make the API route serving the Atom feed ([feed.xml](../feeds/feed.xml)) actually send an xml file that can be recognized by the browser (i.e. allowing for a `.xsl` to work with it and/or opening it automatically in your RSS reader of choice).~~ I figured it out! I talk about it [here](../posts/2025-06-14-1yranni).
 </MDXAccordion>
 
 ---
 
+# 2025-06-23
+
+I made a cool little thing. It's called the [Sharefeed Entry Tool](https://git.eleboog.com/kebokyo/sharefeed-chrome) and it's my way of decreasing
+the friction between me seeing something cool and logging it in the [sharefeed](/sharefeed). It auto-generates a JSON object with
+the url of the webpage, the current date and time, and if it detects metadata it can grab on the current page, all the other data I would
+need to make the sharefeed entry. It currently supports all Substack websites, Medium, YouTube, GitHub, and more... and I only made it
+in a day or two. **Without AI.**
+
+I *really* want to make a blog post about it soon, so I'm going to hold off on rambling about it too much for now. Instead, I'm going to
+share [this cool ambient piece with a real Rhodes](https://www.youtube.com/watch?v=HFbfpt6P1bk) and try to calm down after a slightly
+stressful day. Mwwwah, love you, bye.
+
+# 2025-06-14
+
+I did it. I graduated from college with a bachelor's in computer science. I have an... okay GPA &mdash; worse than I would like it to be, but considering everything, I think
+everything turned out okay in the end. I also got some silly certificate and a cool "emphasis" but none of those really matter.
+
+Now I just need to get a job. And I don't think that will happen.
+
+I moved to an area that is absolutely *not* condusive to my current line of work. I would need to relocate again or get a remote job to find something good, and even then,
+the market is absolutely horrible right now. Everyone wants to fire. No one wants to hire. It's going to take me a *minimum* of three months to find a decent job. I can't
+wait that long.
+
+So, here's what I am going to do: I'm going to see if I can get *some* income. Work a minimum-wage service job for less than I made in college. From there, I can wait for
+the market to decide I matter. I'll network constantly, looking for new opportunities. I'll continue doing what I'm currently doing, working on this site and at [FurSquared](https://fursquared.com/),
+to continue to hone my skills and find more ways to network.
+
+I'll also be looking at solidifying *one* additional side project that I can slap on a portfolio. For example, I recently discovered the right way (for me) to use Notion: use
+the database tool to quickly organize personal data in a fast and intuitive way. I currently have on a second monitor (!!!) a kanban board full of the job applications I'm managing
+that I can easily turn into a Gantt chart to visualize when I need to take next steps. It's lovely. But it has limitations. I can only look at one view at a time; 
+I can't combine them. Automations are locked behind a paywall. Everything is in the cloud in servers I do not control, which means if some big brain hacker wanted to see 
+all the anime I want to watch for some reason, they might be able to find a way. 
+
+Ideally, I would want the automations to be something I can easily "script" using
+a language like Lua or Python (so more advanced automations can be made without having to push through a silly visual workflow). I would also have the views
+themselves be more customizable, also possibly with a scripting language. Finally, I can start everything as a local-only app w/ a basic SQLite database and eventually
+work my way to self-hosted paradise (so eventually I can make my own mobile apps for it!!) 
+This *may* be a bit too over my head, especially considering a big reason why Notion works
+so well for me right now is because it's *right there* and Just Works&trade;... but there's a little shit in the bottom-right corner that periodically animates itself
+to goad me to look at it, click on it, and remember it's their stupid AI thing they desperately want me to use and I want that twink **obliterated**. So, the perfect
+reason to reinvent the wheel :3
+
+Since it has been *again* a hot minute since I wrote a blog post, I'm going to make a new one real quick about my misadventures moving to a new setup and
+what I plan to do now that I am out of school.
+
+So... yeah! I was looking for one track [but accidentally came across a totally different one so here's that one](https://www.youtube.com/watch?v=WL2SyirMpGI).
+I also have literally no income so [any donations to keep this site up and running would be amazing](https://ko-fi.com/kebokyo). Hopefully this
+all goes well and I can finally break my YGS curse. Please.
+
 # 2025-03-04
 
 Welp, that didn't work.

src/pages/newest/index.ts

@@ -6,10 +6,16 @@ import type { APIRoute } from 'astro';
 
 const posts = await getCollection('posts')
 
-const newestPost = posts.sort((a, b) => compareDesc(new Date(a.data.date), new Date(b.data.date)))[0];
+const newestPost = posts.sort(
+  (a, b) => compareDesc(new Date(a.data.date), new Date(b.data.date))
+).filter((e) => {
+  if (e.data.draft) {
+    return false;
+  } else return true;
+})[0];
 
 console.log(newestPost.slug)
 
 export const GET: APIRoute = ({ redirect }) => {
-  return redirect('https://eleboog.com/posts/' + newestPost.slug, 307);
+  return redirect('/posts/' + newestPost.slug, 307);
 }

src/pages/sharefeed.astro

@@ -12,7 +12,7 @@ import sfjson from "../data/sharefeed.json";
 import type { ShareFeedEntry } from "../lib/utils";
 
 const entries = sfjson.sharefeed
-    .sort((a:ShareFeedEntry,b:ShareFeedEntry) => compareDesc(new Date(a.date), new Date(b.date)))
+    .sort((a:ShareFeedEntry,b:ShareFeedEntry) => compareDesc(new Date(a.accessedDate), new Date(b.accessedDate)))
     .filter((entry: ShareFeedEntry) => !(entry.draft))
 
 ---
@@ -35,8 +35,8 @@ const entries = sfjson.sharefeed
                 </a>
                 <p class="text-sm text-subtitle">
                     <span class="italic">&lt; {entry.url} &gt;</span><br/>
-                    {entry.pubDate ? `originally published on ${format(entry.pubDate, "LLLL d, yyyy")} - ` : ''}
-                    retrieved {format(entry.date, "LLLL d, yyyy")}
+                    {entry.publishedDate ? `originally published on ${format(entry.publishedDate, "LLLL d, yyyy")} - ` : ''}
+                    retrieved {format(entry.accessedDate, "LLLL d, yyyy")}
                 </p>
                 <p>{entry.note}</p>
             </li>

src/styles/globals.css

@@ -101,11 +101,27 @@
 }
 
 @layer components {
-  .title-gradient {
-    @media (prefers-color-scheme: dark) {
-      background-color: #cbd0fa;
-      background-image: linear-gradient(to right, #cbd0fa, #8989f0);
+  .main-spacing {
+    @apply flex-col mx-auto min-h-screen max-w-screen-lg p-8 py-4;
+  }
+
+  .nav-extras {
+    @apply inline;
+  }
+  .nav-more {
+    @apply hidden;
+  }
+
+  @media (max-width: 932px) {
+    .nav-extras {
+      @apply hidden;
     }
+    .nav-more {
+      @apply inline;
+    }
+  }
+
+  .title-gradient {
     background-color: #ff7f3e;
     background-image: linear-gradient(to right, #ff7f3e, #af4261);
     background-size: 100%;
@@ -116,9 +132,6 @@
   }
 
   .title-dot {
-    @media (prefers-color-scheme: dark) {
-      background-color: #fba63c;
-    }
     background-color: #1c78ad;
     background-size: 100%;
     -webkit-background-clip: text;
@@ -141,6 +154,24 @@
   }
 
   @media (prefers-color-scheme: dark) {
+    .title-gradient {
+      background-color: #cbd0fa;
+      background-image: linear-gradient(to right, #cbd0fa, #8989f0);
+      background-size: 100%;
+      -webkit-background-clip: text;
+      -moz-background-clip: text;
+      -webkit-text-fill-color: transparent; 
+      -moz-text-fill-color: transparent;
+    }
+
+    .title-dot {
+      background-color: #fba63c;
+      background-size: 100%;
+      -webkit-background-clip: text;
+      -moz-background-clip: text;
+      -webkit-text-fill-color: transparent; 
+      -moz-text-fill-color: transparent;
+    }
     .text-title {
       @apply text-night-300
     }