Add blog to website.

This commit is contained in:
Cutieguwu
2025-07-29 21:24:33 -04:00
parent 8c8fd1eac6
commit 55ced0093c
18 changed files with 355 additions and 38 deletions

35
src/blog.html Normal file
View File

@@ -0,0 +1,35 @@
<!doctype html>
<html lang="en-ca">
<head>
<title>Blog | Cutieguwu</title>
<include src="includes/meta.html" />
</head>
<body>
<div class="viewport">
<nav class="pane_nav">
<include src="includes/nav_logo.html" />
<include src="includes/nav_menu.html" />
<div class="location">
<h4 class="location_header">You are here:</h4>
<h5 class="location_page">Blog</h5>
</div>
<include src="includes/nav_quick_links.html" />
</nav>
<div class="pane_main">
<div class="main_body">
<h1>Blog</h1>
<h2>I have an RSS feed!</h2>
<p>Just look for the RSS Quick Link in the Navigation pane.</p>
</div>
<include src="includes/tailer.html" />
</div>
<div class="pane_spacer">
<include src="./includes/blog_recent_posts.html" />
<div class="spacer_container"><p>#AD</p></div>
</div>
</div>
<include src="includes/footer.html" />
<include src="includes/scripts.html" />
</body>
</html>

View File

@@ -0,0 +1,126 @@
<!doctype html>
<html lang="en-ca">
<head>
<title>Divergent Pathways | Cutieguwu</title>
<include src="includes/meta.html" />
</head>
<body>
<div class="viewport">
<nav class="pane_nav">
<include src="includes/nav_logo.html" />
<include src="includes/nav_menu.html" />
<div class="location">
<h4 class="location_header">You are here:</h4>
<h5 class="location_page">Blog - Divergent Pathways</h5>
</div>
<include src="includes/nav_quick_links.html" />
</nav>
<div class="pane_blog">
<div class="blog_body">
<div class="header">
<h1 class="title">Divergent Pathways</h1>
<p class="date">Posted: 29 July, 2025</p>
<p class="date">Last Edited: 29 July, 2025</p>
</div>
<div class="body">
<p>I can't say that this is how I wanted to start my blog.</p>
<p>
Although, in all honesty, I didn't really have an idea for how I wanted
it to start. That's not to say I didn't know what I *didn't* want. A
meaningless 'Welcome to my Blog' filled with my hopes and aspirations
that inevitably would never come to light was something I knew I didn't
want. I figured it more likely for me to have a semi-respectful rant
about whatever's causing me to 'crash out' on that particular day. That
would certainly be in character for me.
</p>
<p>
But no. Instead, I'm starting my blog on one of the last things I ever
expected to write about.
</p>
<p>Love.</p>
<p>Or rather, the passing of it due to life.</p>
<p>
I've been in two relationships now. Both ended mutually, although what I
consider mutual may not be everyone else's. We came to see the same side
of things, and we understood that we couldn't sustain our lives
together. We're all still friends at the end.
</p>
<p>
Me and my ex-boyfriend were struggling a lot with being able to see each
other. It's not like this relationship was geographically long distance;
we went to the same school. The distance came more from our schedules
and pathways. I have always been a relatively heavy academic. My parents
and teachers certainly made sure of that, and ultimately helped lead me
down a path of being the teacher's pet. Maybe I'll talk about my
experiences and struggles related to that another time, but the short of
it is that I am a high-acheiving workaholic as a result. My ex-boyfriend
on the other hand, didn't have that kind of an experience, and
ultimately was led down the college-level course stream in high school.
</p>
<p>
Now, as I began to struggle in my fourth year, particularly with my
mathematics continuing their downwards trend, I decided that the life of
a software engineer wasn't for me. I turned around, almost on a dime,
and set myself towards a career in Psychology. Now, on the surface, this
may look like it would help with our scheduling issues, but no. While I
was studying at school, and desperately trying to keep up my grades, my
boyfriend would be doing a co-op elsewhere. Even when that ended at the
end of the term, the problem remained. I was too much of a workaholic.
</p>
<p>
Ultimately, the break-up that I've just had has left me intent on not
spiralling downward. My first was rough on me, and I was not in a good
place for about a week. This time, we both kind of saw this coming.
Perhaps that makes it easier, but it still sucks for both of us. And,
why squander the motivation I have to better my self care, my habits,
and thus myself? I'm about to go into my first year of university.
Normally, I'm either scared of my inevitable death, or some past regret
of my life that chooses to grip me. But now, I'm also anxious for the
life ahead.
</p>
<p>
So what does this all mean in terms of dating for me? Well, it leaves me
considering the idea that some people are meant to walk through life
alone. I'm at a point in my life where dating is probably not a great
idea for me. I struggle enough with burnout spells that adding
heartbreak on top would likely kill my education.
</p>
<p>
On top of that are my concerns with online dating. Aside from data
privacy, breaches, and otherwise disgusting people who can't leave these
projects to be a good part of the internet, are the risks with being
trans. There are far too many stories, even if most of them are probably
from the US, of people 'trying it out' with a trans person. Ignoring how
slimy and disgusting you have to be to even do that without considering
the effects of those actions, the point of dating is for love (and to
meet societal expectations while seeking a dual income for the
household, among other things).
</p>
<p>
To make it extra clear, love != sex. The point at the end of it isn't so
you can run home and shag every night--this isn't some 1960s Bond film.
</p>
<p>
If you want to have kids, some trans people who are on HRT, may still be
able to if they've gone to the really awkward and expensive effort of
cryopreservation.
</p>
<p>
Anyway, being someone who was a 'test run' is crushing. I certainly
don't want to run that risk, and other people are in the same boat.
</p>
<p>Given all this, I'll probably tough it out on my own for a while.</p>
</div>
</div>
<include src="includes/tailer.html" />
</div>
<div class="pane_spacer">
<include src="./includes/blog_recent_posts.html" />
<div class="spacer_container"><p>#AD</p></div>
</div>
</div>
<include src="includes/footer.html" />
<include src="includes/scripts.html" />
</body>
</html>

3
src/blog/style.scss Normal file
View File

@@ -0,0 +1,3 @@
@use "../partials/a_common";
@use "../partials/pane_blog";

21
src/feed/rss.xml Normal file
View File

@@ -0,0 +1,21 @@
<?xml version="1.0" encoding="UTF-8" ?>
<rss version="2.0">
<channel>
<title>Cutieguwu Yaps</title>
<link>https://www.cutieguwu.ca/</link>
<description
>Cutieguwu's blog where she discusses various things.</description>
<language>en-ca</language>
<category>Technology/IT/Life/Mental Health/Health</category>
<item>
<title>Splitting Pathways</title>
<link>https://blog.cutieguwu.ca/0_divergent_pathways.html</link>
<description>Discussing my struggles in love.</description>
<category>Life</category>
<category>Mental Health</category>
<category>Health</category>
</item>
</channel>
</rss>

View File

@@ -0,0 +1,14 @@
<div class="spacer_container spacer_posts">
<h2>Recent</h2>
<div class="chunk_list recent_posts">
<div class="chunk">
<div class="header">
<div>
<h3 class="name">Divergent Pathways</h3>
<span class="subtitle">29 July, 2025</span>
</div>
<a href="./blog/0_diverging_pathways.html" class="status"> View </a>
</div>
</div>
</div>
</div>

View File

@@ -1,34 +1,18 @@
<div class="quick_links">
<a href="https://gitea.cutieguwu.ca/Cutieguwu/cutieguwu-site" title="Website Source">
<ion-icon
name="git-branch-outline"
alt="(Gitea) Website Source"
style="color: var(--accent-green)"
></ion-icon>
</a>
<a href="https://github.com/Cutieguwu/cutieguwu-site" title="(Mirror) Website Source">
<ion-icon
name="logo-github"
alt="(Mirror) Website Source"
style="color: var(--accent-blue)"
></ion-icon>
<ion-icon name="git-branch-outline" alt="(Gitea) Website Source" class="gitea"></ion-icon>
</a>
<a
href="https://gitea.cutieguwu.ca/Cutieguwu/cutieguwu-site/src/branch/main/LICENSE"
title="MIT License"
>
<ion-icon
name="book-outline"
alt="MIT License"
style="color: var(--accent-indigo)"
></ion-icon>
<ion-icon name="book-outline" alt="MIT License" class="license"></ion-icon>
</a>
<a href="https://gitea.cutieguwu.ca/Cutieguwu/cutieguwu-site/issues" title="Report Issues">
<ion-icon
name="alert-circle-outline"
alt="Report Issues"
style="color: var(--accent-magenta)"
></ion-icon>
<ion-icon name="alert-circle-outline" alt="Report Issues" class="issue_tracker"></ion-icon>
</a>
<a href="https://www.cutieguwu.ca/feed/rss.xml" title="RSS Feed" download>
<ion-icon name="logo-rss" alt="RSS Feed" class="rss"></ion-icon>
</a>
<a class="phantom"></a>
</div>

View File

@@ -42,7 +42,7 @@
.status {
align-self: center;
white-space: nowrap;
margin-left: var(--spacing-horizontal);
margin-left: calc(var(--spacing-horizontal) * 2);
text-decoration: none;
font-size: 1.17rem;

View File

@@ -1,5 +1,8 @@
@use "a_chunk_list";
@use "a_footer";
@use "a_layouts";
@use "a_quick_links";
@use "a_pages";
@use "pane_main";
@use "pane_nav";
@@ -13,7 +16,6 @@
Odd numbers should be used as intermediate colours between the fore and back elements. Excepting white--white's special.
Eg. Current dropdown menu.
*/
font-size: var(--font-size-generic);

View File

@@ -1 +1,3 @@
@use "blog_recent_posts";
@use "page_resume";

View File

@@ -3,17 +3,15 @@
--item-size: calc(1rem + var(--item-padding));
display: flex;
justify-content: center;
justify-content: center;
flex-wrap: wrap;
justify-content: center;
a {
height: var(--item-size);
display: grid;
background-color: var(--background-1);
background-color: var(--background-3);
border-radius: var(--border-radius-leaf);
margin: 0.5rem;
@@ -34,6 +32,8 @@
* {
margin: 0;
padding: 0;
font-size: var(--font-size-generic);
}
}
}

View File

@@ -4,4 +4,10 @@
font-size: 1.65vh;
white-space: nowrap;
background-color: var(--background-2);
border-radius: var(--border-radius-leaf);
padding: var(--spacing-horizontal);
text-align: center;
}

View File

@@ -0,0 +1,7 @@
.spacer_posts {
justify-content: start !important;
.recent_posts .chunk .header {
background-color: var(--background-1);
}
}

View File

@@ -15,6 +15,11 @@
margin: 0;
}
a:hover {
transition: var(--transition-cut);
transform: var(--transform-scale-x) var(--transform-scale-y);
}
.phantom {
width: var(--item-size);
height: var(--item-size);
@@ -25,12 +30,32 @@
Due to how flexboxes function, settings `display: none`
will result in the box just scaling as if the element
never existed.
phantom needs to sit beside a element in hierarchy, otherwise
phantom will inherit from a like this:
.pane_nav > .quick_links > a > .phantom
*/
background-color: inherit;
}
a:hover {
transition: var(--transition-cut);
transform: var(--transform-scale-x) var(--transform-scale-y);
}
}
.gitea {
color: var(--accent-green);
}
.github {
color: var(--accent-blue);
}
.license {
color: var(--accent-indigo);
}
.issue_tracker {
color: var(--accent-magenta);
}
.rss {
color: var(--accent-orange);
}

View File

@@ -0,0 +1,52 @@
@use "a_tailer";
.pane_blog {
flex: 1;
flex-direction: column;
margin: var(--margin-pane);
justify-content: center;
.blog_body {
background-color: var(--background-2);
border-radius: var(--border-radius-leaf);
padding-top: var(--spacing-horizontal);
.header {
text-align: center;
padding: var(--spacing-horizontal);
width: min-content;
white-space: nowrap;
margin: 0 auto;
.title {
background-color: var(--background-1);
border-radius: var(--border-radius-leaf);
padding: var(--spacing-horizontal);
}
.date {
display: block;
font-size: 0.85rem;
font-weight: normal;
font-style: italic;
font-family: var(--font-family-generic);
}
}
.body {
text-align: start;
padding: 0 calc(var(--margin-pane) * 4)
calc(var(--margin-pane) * 4);
p {
color: var(--white-1);
}
}
}
}

View File

@@ -8,8 +8,7 @@
justify-content: center;
.main_body,
.tailer {
.main_body {
background-color: var(--background-2);
border-radius: var(--border-radius-leaf);
padding: var(--spacing-horizontal);

View File

@@ -2,7 +2,7 @@
margin: var(--margin-pane);
padding: 0;
width: 10vw;
width: min-content;
display: grid;
grid-auto-flow: row;
@@ -22,11 +22,10 @@
var(--spacing-menu-gap) / 2
) - calc(var(--spacing-horizontal) * 2)
);
flex: 1;
border-radius: var(--border-radius-leaf);
/* Vertical Text Align */
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;

View File

@@ -0,0 +1,40 @@
<!doctype html>
<html lang="en-ca">
<head>
<title>Blog Post Template | Cutieguwu</title>
<include src="includes/meta.html" />
</head>
<body>
<div class="viewport">
<nav class="pane_nav">
<include src="includes/nav_logo.html" />
<include src="includes/nav_menu.html" />
<div class="location">
<h4 class="location_header">You are here:</h4>
<h5 class="location_page">Blog - Blog Post Template</h5>
</div>
<include src="includes/nav_quick_links.html" />
</nav>
<div class="pane_blog">
<div class="blog_body">
<div class="header">
<h1 class="title">Blog Post Template</h1>
<p class="date">Posted: 01 January, 2025</p>
<p class="date">Last Edited: 01 January, 2025</p>
</div>
<div class="body">
<p>Blog Post Content</p>
</div>
</div>
<include src="includes/tailer.html" />
</div>
<div class="pane_spacer">
<include src="./includes/blog_recent_posts.html" />
<div class="spacer_container"><p>#AD</p></div>
</div>
</div>
<include src="includes/footer.html" />
<include src="includes/scripts.html" />
</body>
</html>