sharefeed & journal updates + some visual changes
Some checks failed
ci / builder (push) Failing after 1m21s
Some checks failed
ci / builder (push) Failing after 1m21s
This commit is contained in:
parent
54a642df99
commit
b226cde9b1
14 changed files with 172 additions and 38 deletions
BIN
public/buttons/eleboog_button.jpg
Normal file
BIN
public/buttons/eleboog_button.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.4 KiB |
BIN
public/buttons/eleboog_button_light.jpg
Normal file
BIN
public/buttons/eleboog_button_light.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.2 KiB |
BIN
public/buttons/green-team.gif
Normal file
BIN
public/buttons/green-team.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 479 B |
11
src/components/AttentionBar.astro
Normal file
11
src/components/AttentionBar.astro
Normal file
|
|
@ -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>
|
||||
</>}
|
||||
|
|
@ -6,28 +6,36 @@ const {current} = Astro.props;
|
|||
|
||||
<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-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>
|
||||
/
|
||||
<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>
|
||||
</div>
|
||||
|
|
@ -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>
|
||||
|
|
@ -1,12 +1,59 @@
|
|||
---
|
||||
date: 2025-06-14 13:00:00
|
||||
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 *14*, 2025. Close enough. HAPPY ONE YEAR!!!!!
|
||||
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.
|
||||
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.
|
||||
|
|
|
|||
8
src/content/posts/2025-06-21-sharefeed-chrome.mdx
Normal file
8
src/content/posts/2025-06-21-sharefeed-chrome.mdx
Normal file
|
|
@ -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)
|
||||
|
|
@ -1,5 +1,29 @@
|
|||
{
|
||||
"sharefeed" : [
|
||||
{
|
||||
"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",
|
||||
|
|
|
|||
|
|
@ -6,6 +6,7 @@ import '../styles/globals.css'
|
|||
|
||||
import Header from '../components/Header.astro'
|
||||
import Footer from '../components/Footer.astro'
|
||||
import AttentionBar from '../components/AttentionBar.astro'
|
||||
|
||||
const { title, description, ogImage } = Astro.props
|
||||
|
||||
|
|
@ -35,11 +36,14 @@ const ogImageUrl = ogImage ? "https://eleboog.com" + ogImage : "https://eleboog.
|
|||
<meta property="twitter:card" content="summary_large_image" />
|
||||
<meta property="twitter:image" content={ ogImageUrl } />
|
||||
</head>
|
||||
<body class="main-spacing">
|
||||
<Header current={title}/>
|
||||
<main>
|
||||
<slot/>
|
||||
</main>
|
||||
<Footer/>
|
||||
<body>
|
||||
<AttentionBar/>
|
||||
<div class="main-spacing">
|
||||
<Header current={title}/>
|
||||
<main>
|
||||
<slot/>
|
||||
</main>
|
||||
<Footer/>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -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>
|
||||
|
|
@ -14,6 +14,7 @@ import { getCollection } from 'astro:content';
|
|||
const posts = await getCollection('posts')
|
||||
|
||||
import { timeZone } from "../lib/utils";
|
||||
import HR from '../components/HR.astro';
|
||||
|
||||
---
|
||||
|
||||
|
|
@ -49,14 +50,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">← </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"> →</a>
|
||||
<div class="flex w-4 self-baseline h-1 border-t border-crusta-200 dark:border-night-800 mx-2"></div>
|
||||
  
|
||||
<a class="text-subtitle hover:text-current" href="https://webring.bucketfish.me/redirect.html?to=prev&name=kebokyo">← </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"> →</a>
|
||||
  
|
||||
<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>
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@ import Icon from "../components/Icon.astro";
|
|||
|
||||
## now
|
||||
|
||||
eepy
|
||||
when your girlfriend tells you to drink your goddamn tea, you better drink your goddamn tea
|
||||
|
||||
---
|
||||
|
||||
|
|
@ -26,6 +26,18 @@ eepy
|
|||
|
||||
---
|
||||
|
||||
# 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 — worse than I would like it to be, but considering everything, I think
|
||||
|
|
|
|||
|
|
@ -105,6 +105,22 @@
|
|||
@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);
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue