many many changes

site/blog/estradiol-delivery-methods.md

@@ -0,0 +1,29 @@
+---
+title: Estradiol Delivery Methods
+timestamp: 2023-05-28T16:00:00.00Z
+tags: [trans, hrt]
+desc: A comparison of the various ways I've taken estradiol since starting HRT.
+header_image_file: cat.jpeg # TODO: placeholder image
+header_image_alt: placeholder
+draft: true
+---
+
+I thought it might be useful to write out my experiences with the four methods of taking estradiol I've tried.
+
+- patches
+  - wouldn't consistently stay on me
+  - could feel the effects wearing off 3-4 days after application
+  - insurance sucks
+- sublingual pills
+  - worked alright, except:
+  - could feel them wearing off ~5-6 hours after taking a dose
+  - apparently hard to measure levels? had one test at ~200 mg/ml and another at 400+ mg/ml at same dosage
+- swallowed pills
+  - could not get ideal levels with a reasonable number of pills, but:
+  - couldn't actually feel them wearing off even at 12 hours between doses
+- injections
+  - holy shit these are great
+  - was kinda nervous the first few times I injected myself, but I got used to it
+  - cannot feel it wearing off between doses
+  - levels are actually good??
+  - insurance sucks pt. 2

site/blog/so-now-i-have-a-blog.md

@@ -0,0 +1,23 @@
+---
+title: so now i have a blog
+timestamp: 2023-06-09T16:00:00.00Z
+tags: [meta, technical]
+desc: I added a blog to my site.
+header_image_file: cat.jpeg # TODO: placeholder image
+header_image_alt: placeholder
+draft: true
+---
+
+So now I have a blog on my site. I don't really have any plans to post here regularly, but idk maybe that'll change in the future.
+
+That's pretty much it as far as the non-technical side of things goes.
+
+## The Technical Side of Things
+
+I haven't really written anything about how my site works before, so this is also going to contain some general information about the site as a whole.
+
+`zyl.gay` is a static website built with a custom static site builder I built for it. It started by taking Markdown pages and rendering them on top of the appropriate template.
+
+When I added the [images section](/images/) to the site I added the first abstraction on top of this: YAML files with the relevant metadata for the image (including a short but unstyled description) which then get rendered not only into pages for the individual pages, but also a paginated display for all the images _and_ a method to view images by tag.
+
+To get blogs working I modified the image page code to be generic over provided resource types, so really the images and the blog posts are rendered the same way, just with different configurations.

site/config.yaml

@@ -3,5 +3,6 @@ title: Zyllian
 description: "Zoey's website."
 sass_styles: [index.scss]
 images_per_page: 10
+blog_posts_per_page: 20
 cdn_url: "https://i.zyl.gay"
 s3_prefix: # no longer prefixed

site/images/amogus.md

@@ -1,6 +1,10 @@
+---
 title: among us 😱
 timestamp: 2022-12-14T00:00:00.00Z
 alt: Screenshot of Pokémon White on an evolution screen. Text reads "Congratulations! Your amogus evolved into Amoonguss!"
 desc: aaahhhh
 file: amogus.png
 tags: [pokémon, sussy]
+---
+
+aaahhhh

site/images/boxtop.md

@@ -1,5 +1,7 @@
+---
 title: cat 3
 timestamp: 2022-12-14T00:00:00.00Z
 alt: Picture of my cat sleeping in a box barely large enough for them. Their head is resting on one edge of the box.
 file: boxtop.jpeg
 tags: [cat]
+---

site/images/cat.md

@@ -1,5 +1,7 @@
+---
 title: cat
 timestamp: 2022-12-14T00:00:00.00Z
 alt: Picture of my cat sleeping curled up on top of some pillows.
 file: cat.jpeg
 tags: [cat]
+---

site/images/cat2.md

@@ -1,5 +1,7 @@
+---
 title: cat 2
 timestamp: 2022-12-14T00:00:00.00Z
 alt: Close up picture of my cat laying on a shelf while staring not quite at the camera.
 file: cat2.jpeg
 tags: [cat]
+---

site/images/makeup-first-lol.md

@@ -0,0 +1,13 @@
+---
+title: first time applying makeup
+timestamp: 2023-02-10T21:40:00.00Z
+alt: Bathroom mirror selfie of me in a cap, dark-rimmed glasses, and a flannel button-up over a mesh shirt wearing some light red lipstick, light and slightly orange blush around the nose, and poorly applied eyeliner.
+file: makeup-first-lol.jpeg
+tags: [me, selfie]
+---
+
+had the house to myself to try out some outfits and makeup without any external pressure
+
+this picture's of my first time applying any makeup where despite thinking it all looked like shit individually, I think all the parts came together well
+
+I'm wearing only lipstick, a little blush, and eyeliner. the foundation in the kit I was given wouldn't stay on 🤷

site/images/makeup-first-lol.yml

@@ -1,9 +0,0 @@
-title: first time applying makeup
-timestamp: 2023-02-10T21:40:00.00Z
-alt: Bathroom mirror selfie of me in a cap, dark-rimmed glasses, and a flannel button-up over a mesh shirt wearing some light red lipstick, light and slightly orange blush around the nose, and poorly applied eyeliner.
-desc: >
-  <p>had the house to myself to try out some outfits and makeup without any external pressure</p>
-  <p>this picture's of my first time applying any makeup where despite thinking it all looked like shit individually, I think all the parts came together well</p>
-  <p>I'm wearing only lipstick, a little blush, and eyeliner. the foundation in the kit I was given wouldn't stay on 🤷</p>
-file: makeup-first-lol.jpeg
-tags: [me, selfie]

site/images/trans-comfy.md

@@ -1,6 +1,9 @@
+---
 title: shorts to dresses
 timestamp: 2022-12-14T00:00:00.00Z
 alt: Screenshot from Pokémon Black 2 of an NPC saying "This dress is comfy and easy to wear..."
-desc: yooo they're turning the comfy shorts kid trans
 file: trans-comfy.png
 tags: [pokémon, trans]
+---
+
+yooo they're turning the comfy shorts kid trans

site/sass/index.scss

@@ -9,11 +9,15 @@ body {
   --text-color: black;
   --accent-color: #b520e7;
   --accent-text-color: var(--bg-color);
+  --accent-color-neutral: #aaa;
+  --accent-text-color-neutral: #eee;
 
   @media (prefers-color-scheme: dark) {
     --bg-color: #333;
     --text-color: #ccc;
     --accent-text-color: black;
+    --accent-color-neutral: #555;
+    --accent-text-color-neutral: #bbb;
   }
 }
 
@@ -55,7 +59,7 @@ abbr {
 .images-list {
   display: flex;
   flex-wrap: wrap;
-  
+
   .image {
     position: relative;
     padding: 4px;
@@ -81,7 +85,8 @@ abbr {
 }
 
 .image-full {
-  .title, .tags-title {
+  .title,
+  .tags-title {
     margin-bottom: 0;
   }
 
@@ -92,3 +97,68 @@ abbr {
     background-color: rgba(0, 0, 0, 0.3);
   }
 }
+
+.blog-post-list {
+  .post {
+    p {
+      margin: 0;
+    }
+
+    .title {
+      font-size: 1.2rem;
+    }
+
+    .short-desc {
+      font-size: 0.9rem;
+      font-style: italic;
+
+      &:before {
+        content: "└ ";
+      }
+    }
+  }
+}
+
+.blog-post {
+  margin-left: auto;
+  margin-right: auto;
+  max-width: max(1000px, 40%);
+
+  .title,
+  .tags-title {
+    margin: 0;
+  }
+
+  .header-image-wrapper {
+    color: var(--accent-text-color-neutral);
+    background-color: var(--accent-color-neutral);
+    font-style: italic;
+    font-size: 1.2rem;
+    margin-bottom: 8px;
+
+    .short-desc {
+      margin: 0;
+      padding: 8px;
+    }
+
+    .header-image {
+      width: 100%;
+      max-height: 60vh;
+      object-fit: cover;
+      object-position: 50% 50%;
+    }
+  }
+
+  .content {
+    text-indent: 1rem;
+
+    h1,
+    h2,
+    h3,
+    h4,
+    h5,
+    h6 {
+      text-indent: 0;
+    }
+  }
+}

site/templates/base.hbs

@@ -13,6 +13,7 @@
 			<span class="pronouns">she/they</span>
 		</span>
 		<span class="spacer"></span>
+		{{!-- <a href="/blog/">Blog</a> | --}}
 		<a href="/images/">Images</a> |
 		<a href="https://github.com/Zyllian/zyllian.github.io" rel="noopener noreferrer">Source</a>
 	</header>

site/templates/blog-list.hbs

@@ -0,0 +1,23 @@
+{{#if tag}}
+<h1>Blog posts tagged {{tag}}</h1>
+<p><a href="/blog/">View all blog posts</a></p>
+{{else}}
+<h1>Blog Posts</h1>
+<p><a href="tags">View blog tags</a></p>
+<p><a href="rss.xml">RSS Feed</a></p>
+{{/if}}
+<h1>Page {{page}}/{{page_max}}</h1>
+{{#if previous}}
+<a href="./{{previous}}">Previous page</a>
+{{/if}}
+{{#if next}}
+<a href="./{{next}}">Next page</a>
+{{/if}}
+<div class="blog-post-list">
+	{{#each resources}}
+	<div class="post">
+		<p class="title"><a href="/blog/{{id}}">{{title}}</a></p>
+		<p class="short-desc">{{desc}}</p>
+	</div>
+	{{/each}}
+</div>

site/templates/blog-post.hbs

@@ -0,0 +1,22 @@
+<div class="blog-post">
+	<h1 class="title">{{title}}</h1>
+	<span class="timestamp">Published {{timestamp}}</span>
+	{{#if draft}}
+	<h2>DRAFT</h2>
+	{{/if}}
+	<div class="header-image-wrapper">
+		<p class="short-desc">{{desc}}</p>
+		<img class="header-image" src="{{header_image}}" alt="{{header_image_alt}}"
+			style="object-fit: {{object_fit}}; object-position: {{object_position}};">
+	</div>
+	<div class="content">
+		{{{content}}}
+	</div>
+	<hr />
+	<h3 class="tags-title">Tags</h3>
+	<div class="post-tags">
+		{{#each tags}}
+		<a class="tag" href="/blog/tag/{{this}}">{{this}}</a>{{#unless @last}},{{/unless}}
+		{{/each}}
+	</div>
+</div>

site/templates/image.hbs

@@ -2,9 +2,7 @@
 	<h1 class="title">{{title}}</h1>
 	<span class="timestamp">Published {{timestamp}}</span>
 	<img class="image-actual" src="{{src}}" alt="{{alt}}">
-	{{#if desc}}
-	<p>{{{desc}}}</p>
-	{{/if}}
+	{{{content}}}
 	<p><a href="{{src}}">View full size image</a></p>
 	<h3 class="tags-title">Tags</h3>
 	<div class="image-tags">

site/templates/rss/blog-post.hbs

@@ -0,0 +1 @@
+<div>{{{source}}}</div>