leave my heart open

Author: petracoding

content/_data/changelog.json

@@ -1,5 +1,6 @@
 [
   { "date": "2026-01-XX", "text": "TEMPLATE", "link": "" },
+  { "date": "2026-01-16", "text": "Updated my manifesto.", "link": "/about/manifesto" },
   { "date": "2026-01-08", "text": "Improvements to clique list", "link": "/coding/cliques" },
   { "date": "2026-01-03", "text": "Indie Web Contest winners announced!", "link": "/contest" },
   { "date": "2026-01-02", "text": "Made some 88x31 buttons :) Feel free to use!", "link": "/about/blinkies" },

content/_data/nav.json

@@ -5,7 +5,7 @@
   },
   {
     "label": "About",
-    "new": false,
+    "new": true,
     "items": [
 
 
@@ -42,7 +42,7 @@
       {
         "link": "/about/manifesto",
         "label": "site manifesto",
-        "new": false,
+        "new": true,
         "hide": false
       },
         {
@@ -190,7 +190,7 @@
       {
         "link": "/contest",
         "label": "Indie Web Contest",
-        "new": true,
+        "new": false,
         "hide": false,
         "icon": "fa-solid fa-trophy"
       },

content/_data/recs.json

@@ -444,6 +444,16 @@
     }
   ],
   "games": [
+     {
+      "title": "Balatro",
+      "platform": "pc, switch, mobile",
+      "gameType": "singleplayer",
+      "rating": "3",
+      "price": "€",
+      "link": "https://backloggd.com/games/balatro/",
+      "image": "https://images.igdb.com/igdb/image/upload/t_cover_big_2x/co9f4g.jpg",
+      "description": "Balatro is an incredibly addicting, well-made and gorgeous poker-like roguelike. Don't worry though, it's really nothing like poker. It just costs a few bucks, but you'll get at least 50 hours of playtime out of it. (I'm at 100 hours.)"
+    },
     {
       "title": "Portal 2",
       "platform": "pc, switch, other",

content/_includes/petrapixel.njk

@@ -411,9 +411,18 @@ testingOnLocalhost: false
 
         <a class="aside-tip-jar" href="https://ko-fi.com/petrastipjar" target="_blank">
           <img src="{{ nesting }}assets/img/layout/coffee.gif" width="70" alt="Coffee Gif" />
-          <div><b>Tip Jar</b><small>Buy me a coffee? :3</small></div>
+          <div><b>Tip Jar</b><small>Buy me a coffee? :3 I really appreciate every support! &lt;3</small></div>
         </a>
 
+        <div class="aside-tumblr">
+          <p>
+            <b>Got tumblr?</b> Reblog my <a href="https://www.tumblr.com/petrapixel/801488583310606336" target="_blank">indie web masterpost</a>!
+            <img aria-hidden="true" src="{{ nesting }}assets/img/inline/small-heart.gif" />
+          </p>
+        </div>
+
+        <img src="{{ nesting }}assets/img/layout/divider1.gif" alt="" aria-hidden="true" />
+
         <!-- ----------------- FLAG COUNTER ----------------- -->
         <!--
 		<a class="aside__flag-counter" aria-hidden="true" href="/about/flag-counter"

content/about/about-me.html

@@ -662,7 +662,7 @@ <h2>Aesthetics</h2>
 
 <section>
   <h2>GPOY</h2>
-  <p>AKA "relatable images". They are partially stolen from other people's GPOY.</p>
+  <p>AKA "relatable images". They are partially stolen from other people's GPOY. Shown in random order.</p>
   <div class="about-me-pages__gpoy isotope-items">
     <div class="gpoy"><img src="../assets/img/me/gpoy/c.png" alt="What's your favorite sport? Uhm, Mario Kart." /></div>
     <div class="gpoy"><img src="../assets/img/me/gpoy/d.png" alt="Love going to bed with a new, good daydream scenario fresh in my mind. Like yes girl, movie night!" /></div>
@@ -710,6 +710,8 @@ <h2>GPOY</h2>
     <div class="gpoy"><img src="../assets/img/me/gpoy/dec9.jpg" alt="a windy day will make you feel like you're in a better world" /></div>
     <div class="gpoy"><img src="../assets/img/me/gpoy/dec10.jpg" alt="time to get dressed! but: who am i and what do i look like?" /></div>
     <!-- <div class="gpoy"><img src="../assets/img/me/gpoy/TODO.jpg" alt="TODO" /></div> -->
+    <div class="gpoy"><img src="../assets/img/me/gpoy/j1.jpg" alt="I've been nothing but obsessive and weird and this is how you treat me." /></div>
+    <div class="gpoy"><img src="../assets/img/me/gpoy/j2.jpg" alt="Obsessed with dinosaurs." /></div>
 
     <div class="gpoy"><img src="../assets/img/me/gpoy/9.jpg" alt="outfit repeater, meal repeater, movie rewatcher, i know what i like" /></div>
     <div class="gpoy"><img src="../assets/img/me/gpoy/2.jpg" alt="The world is a cruel and unjust place. Minutes later: Omg, Dan Avidan" /></div>

content/about/about-the-site.html

@@ -36,6 +36,7 @@ <h1>About the Site <img aria-hidden="true" src="../assets/img/inline/star.gif" /
     You can follow me on neocities <a href="https://neocities.org/site/petrapixel" target="_blank">here</a>. <img aria-hidden="true" src="../assets/img/inline/happy.gif" /> I also have an
     <a href="/rss.xml" target="_blank" aria-label="RSS Feed" title="RSS Feed">RSS Feed <img src="{{ nesting }}assets/img/layout/rss.png" alt="RSS" /></a> &nbsp; in case you're into that stuff.
   </p>
+  <p>Also check out my <a href="/about/manifesto">website manifesto</a>!</p>
   <!-- <div class="website-carbon">
             <p>
               <a href="https://www.websitecarbon.com/website/petrapixel-neocities-org/" target="_blank"><b>A+</b><br />My site is cleaner than 99 % of all web pages globally.</a>
@@ -155,7 +156,7 @@ <h2>Accessibility</h2>
             provident, temporibus, blanditiis natus?
           </p> -->
 </section>
-
+<!-- 
 <section>
   <h2>To Do List</h2>
   <p>Here's some stuff that I might or might not add to this site at some point!</p>
@@ -190,6 +191,20 @@ <h2>To Do List</h2>
     <li>ideas for personal websites</li>
   </ul>
 </section>
+-->
+
+<section>
+  <h2>Link back to me!</h2>
+  <p>Hotlinking is a-okay! <img aria-hidden="true" src="../assets/img/inline/happy.gif" /></p>
+  <div class="link-back">
+    <a href="https://petrapixel.neocities.org/" target="_blank"
+      ><img src="https://cdn.jsdelivr.net/gh/petracoding/petrapixel.neocities.org@latest/public/assets/img/linkback.gif" alt="petrapixel"
+    /></a>
+    <textarea name="" id="" cols="30" rows="10" aria-label="link-back code" class="code-textarea">
+<a href="https://petrapixel.neocities.org/" target="_blank"><img src="https://cdn.jsdelivr.net/gh/petracoding/petrapixel.neocities.org@latest/public/assets/img/linkback.gif" alt="petrapixel"></a></textarea
+    >
+  </div>
+</section>
 
 <section>
   <h2>Milestones</h2>
@@ -229,25 +244,12 @@ <h2>Milestones</h2>
   </ul>
 </section>
 
-<section>
-  <h2>Link back to me!</h2>
-  <p>Hotlinking is a-okay! <img aria-hidden="true" src="../assets/img/inline/happy.gif" /></p>
-  <div class="link-back">
-    <a href="https://petrapixel.neocities.org/" target="_blank"
-      ><img src="https://cdn.jsdelivr.net/gh/petracoding/petrapixel.neocities.org@latest/public/assets/img/linkback.gif" alt="petrapixel"
-    /></a>
-    <textarea name="" id="" cols="30" rows="10" aria-label="link-back code" class="code-textarea">
-<a href="https://petrapixel.neocities.org/" target="_blank"><img src="https://cdn.jsdelivr.net/gh/petracoding/petrapixel.neocities.org@latest/public/assets/img/linkback.gif" alt="petrapixel"></a></textarea
-    >
-  </div>
-</section>
 <section>
   <h2>Old Looks</h2>
   <p>
     You can use the <a href="https://web.archive.org/web/20240101000000*/https://petrapixel.neocities.org" target="_blank">Wayback Machine</a> to browse old version of my website if you're interested!
-    Here's my old button, too - please don't use it though:
   </p>
-  <p><img src="../assets/img/old-looks/oldbutton.gif" /></p>
+  <p>Here's my old button, too - please don't use it though: <img src="../assets/img/old-looks/oldbutton.gif" /></p>
 
   <div class="multi-line-gallery multi-line-gallery--big lightbox-images">
     <a data-fslightbox href="../assets/img/old-looks/halloween theme light.png" class="image">

content/about/cats.html

@@ -13,11 +13,10 @@ <h1>meow meow <span aria-title="Cats" aria-hidden="true" style="font-size: 19px;
   <div>
     <p>
       <small
-        ><b>This autumn I took in a stray cat that gave birth to 5 kittens in my apartment. As an unemployed uni student, the expenses have been rough for me.</b> Currently they eat almost 10 packages
-        of wet food a day, plus dry food, cat litter, and of course the expensive vet appointments. I also will have to get Holly (the mom) spayed, which will cost 200 Euros. I already spent over 400
-        Euros on them since October. I appreciate ANY help, no matter how small!</small
+        ><b>Last autumn I took in a stray cat that gave birth to 5 kittens in my apartment.</b> As an unemployed uni student, the expenses (400+ eur in three months + over 400 eur for the castration
+        of the mom) were rough for me. I appreciate ANY help, no matter how small!</small
       >
-      <a href="https://ko-fi.com/petrastipjar/goal?g=0" target="_blank">Buy me a coffee.</a>
+      <a href="https://ko-fi.com/petrastipjar/" target="_blank">Buy me a coffee.</a>
     </p>
   </div>
   <div><img src="{{ nesting }}assets/img/layout/coffee.gif" alt="coffee" width="80" /></div>

content/about/manifesto.html

@@ -6,23 +6,64 @@
 
 <section>
   <h1>Manifesto</h1>
-  <p>After reading some really good (and some <i>really bad</i>) manifestos on other people's websites, I decided to write my own.</p>
-  <p>What's the point of this? I don't really know. It's just me rambling about why I have a website, what the point of my website is, and what I think about the indie web community I guess.</p>
-  <p>Please note that these are just my opinions based on my experiences. I haven't had a personal website for long, and only really joined Neocities in 2024.</p>
-  <!--<p><b>As of February 2025 this manifesto is still work-in-progress and might change/expand a bit.</b></p>-->
+  <p style="padding-left: 1em"><i>manifesto</i> (n.): "a written statement declaring publicly the intentions, motives, or views of its author."</p>
+  <p>
+    After reading some really good (and some <i>really bad</i>) manifestos on other people's websites, I decided to write my own. What's the point of this? I don't really know. It's just me rambling
+    about why I have a website, what the point of my website is, and what I think about the indie web community I guess.
+  </p>
+  <div id="toc">
+    <b>Table of Contents:</b>
+    <ul>
+      <li><a href="#free-knowledge">Free Knowledge</a></li>
+      <li><a href="#nostalgia">Nostalgia</a></li>
+      <li><a href="#accessibility">Accessibility</a></li>
+      <li><a href="#social-media">(A-)Social Media</a></li>
+    </ul>
+  </div>
+  <!--<p>Please note that these are just my opinions based on my experiences. I haven't had a personal website for long (since 2024!).</p>
+ <p><b>As of February 2025 this manifesto is still work-in-progress and might change/expand a bit.</b></p>-->
+
   <hr />
 
-  <!-- -->
+  <h2>Free Knowledge</h2>
+  <p style="padding-left: 1em"><i>free knowledge</i>: "knowledge that is free to use, reuse, and redistribute without restriction."</p>
+  <p>
+    As you might have noticed, my website is full of resources for others, including tutorials, tools and tips. This is because I've realised that that is the role I'm supposed to play in the indie
+    web. I have something that most hobbyist coders don't have: an education in programming, and professional web development experience. I also always had a love for teaching - though I'm aware I
+    have my own weird style. I like to be straightforward and no-nonsense, prioritizing brevity over verbosity. But that doesn't mean I don't have a lot to say!
+  </p>
+  <p>
+    All of my knowledge that I share I share freely. Gatekeeping isn't cool, so I try my best to do the exact opposite! After all, it's not my web but <b>our web ☭</b>. (By the way,
+    <a href="https://github.com/petracoding/petrapixel.neocities.org" target="_blank">my entire code is open source</a>!) Free also means <i>free of charge</i>, which all of my resources are (though
+    <a href="https://ko-fi.com/petrastipjar" target="_blank">I do accept donations</a> from those who wish to support me financially, and highly appreciate any support!)
+  </p>
+  <p>
+    Basically, I want the indie web to gain popularity because I believe it is a great part of the internet and will help people get away from social media (more to that later.) The indie web is a
+    great community, coding is a great hobby, and web design is a wonderful creative outlet -- and I want to make this corner of the web more accessible to everyone, including those who have no
+    experience with creating websites whatsoever. I am especially happy whenever I can help girls, queer, disabled people and youngsters (meaning 16 and under, which outs me as a grandma). In high
+    school I was the only girl in some of my programming classes, so I take pride in teaching coding to girls, especially via my beautifully pink and girly site. If I can help just a little bit to
+    make coding less of a "boy's club" I'm happy!
+  </p>
+  <p>
+    From personal experience I can say that many "official" coding resources (such as official documentation) are not beginner-friendly. My biggest goal on my site is to create those resources that do
+    not exist yet in a beginner-friendly form. This also means that I don't like writing tutorials about things that have already been explained a million different ways on the Internet. For example,
+    I will not write "How to HTML" tutorial #389284320. Instead, I create indie web / Neocities-specific resources, as well as resources that I wish I had when I was still learning these things. Often
+    I even write a tutorial <i>as I am learning something myself</i>! (This is how my <a href="/coding/eleventy-tutorial">11ty tutorial</a> came to be!) That's how my brain just works - So I might as
+    well share what I've learned.
+  </p>
+
+  <hr />
 
-  <h4>Nostalgia</h4>
+  <h2>Nostalgia</h2>
+  <p style="padding-left: 1em"><i>nostalgia</i> (n.): "a sentimental longing or wistful affection for a period in the past."</p>
   <p>
-    I've read in other manifestos (not naming any names) that the whole nostalgia trip (aka 'old web aesthetic' surrounding most indie websites is bullshit. "The Internet was never truly like that!"
-    So what? I didn't grow up with the actual 'old web'. I'm even slightly too young to have had MySpace. I was born in 1999 (during the height of GeoCities' popularity), and the personal websites I
-    made as a kid were not coded, but created with easy-to-use website builders like Wix - and there weren't many personal websites. I experienced the dying art of HTML/CSS as a hobby for the masses
-    through <a href="https://www.wittyprofiles.com/" target="_blank">WittyProfiles</a> (which, for the uninitiated, is a community for posting quotes and other HTML/CSS snippets in fancy formats).
-    Then later in my teens I experienced the wonderful world of hobbyist tumblr theme makers (and even <a href="https://cloudythms.tumblr.com/" target="_blank">made my own</a>). So, that is all to
-    say, I didn't grow up with the actual 'old web' (and neither did most people joining the Indie Web today), and I don't care. The point of the indie web revival is not to resurrect the decomposing
-    corpse of the late 90s and early 00s. The point is to take the good parts of the 'old web' and carry them into the present, adapting them (if necessary) as we go.
+    I've read in other manifestos (not naming any names...) that the whole nostalgia trip (aka 'old web aesthetic' surrounding most indie websites is bullshit. "The Internet was never truly like
+    that!" So what? I didn't grow up with the actual 'old web'. I'm even slightly too young to have had MySpace. I was born in 1999 (during the height of GeoCities' popularity), and the personal
+    websites I made as a kid were not coded, but created with easy-to-use website builders like Wix - and there weren't many personal websites. I experienced the dying art of HTML/CSS as a hobby for
+    the masses through <a href="https://www.wittyprofiles.com/" target="_blank">WittyProfiles</a> (which, for the uninitiated, is a community for posting quotes and other HTML/CSS snippets in fancy
+    formats). Then later in my teens I experienced the wonderful world of hobbyist tumblr theme makers (and even <a href="https://cloudythms.tumblr.com/" target="_blank">made my own</a>). So, that is
+    all to say, I didn't grow up with the actual 'old web' (and neither did most people joining the Indie Web today), and I don't care. The point of the indie web revival is not to resurrect the
+    decomposing corpse of the late 90s and early 00s. The point is to take the good parts of the 'old web' and carry them into the present, adapting them (if necessary) as we go.
   </p>
   <p>
     I also highly disagree with any kind of statement others make about Neocities websites in general. Phrases like "all look the same" or "uninspired"... Neocities is a website hoster. That's it.
@@ -40,14 +81,15 @@ <h4>Nostalgia</h4>
     So, even if it was true that most indie web sites look the same and are uninspired (which I don't personally believe): Does it matter if everyone's having fun? Who decided that websites need to be
     high art? <a href="https://remoji.com/" target="_blank">They don't.</a>. Personally, self-indulgent art has always done more for me than 'beautiful' or 'meaningful' art. (I put those words in
     quotes because I don't actually believe that they are objective terms.) My own website is self-indulgent all the way. And if I come across the 200th indie website that looks like a Windows XP
-    desktop then it might not be unique, or even interesting, but it is almost definitely self-indulgent, and that's always a good thing to me.
+    desktop then it might not be unique, or even interesting to me personally, but it is almost definitely self-indulgent for its creator, and I believe that's a good thing.
   </p>
 
-  <!-- -->
+  <hr />
 
-  <h4>Accessibility</h4>
+  <h2>Accessibility</h2>
+  <p style="padding-left: 1em"><i>accessibility</i> (n.): "the quality of being easily reached or used, esp. by people who have a disability."</p>
   <p>
-    Of course, there are some basic etiquette "do"s and "don't"s, just like with anything. But very few of these are hard-written rules (e.g. marking your website as 18+ if it is) and at the end
+    On the indie web there are some basic etiquette "do"s and "don't"s, just like with anything. But very few of these are hard-written rules (e.g. marking your website as 18+ if it is) and at the end
     everyone has to decide for themselves whether they care about other people's experience on their website or not. I saw this the other day when there was a discussion about a Neocities site that
     included a screamer (a scary visual with loud sound intended to scare people who visit the site). There is no rule against that. You know what they say, being an asshole is not illegal. It's just
     being an asshole. I think this whole thing comes up a lot when talking about accessibility.
@@ -74,9 +116,10 @@ <h4>Accessibility</h4>
     art. For some it's more the former, for others it's more the latter.
   </p>
 
-  <!-- -->
+  <hr />
 
-  <h4>Social Media</h4>
+  <h2 id="social-media">(A-)Social Media</h2>
+  <p style="padding-left: 1em"><i>social media</i> (n.): "the sickness of today's generations and the downfall of future generations."</p>
   <p>
     Like many people who have a personal website these days, I'm sick of social media. I think my breaking point came in 2020-ish when I was using Twitter and TikTok and I hated it.
     <a href="/blog/why-i-stopped-using-social-media">I already talked about</a> why (and how) I stopped using most social media, so I won't go into detail now, but essentially: I think there's good
@@ -97,10 +140,10 @@ <h4>Social Media</h4>
     base, the indie web community just seems chill and quiet. For now...
   </p>
 
-  <!-- -->
-
+  <!-- 
   <hr />
 
+  <h2>Final Remarks</h2>
   <p>Some stuff I want to leave you with:</p>
   <ul>
     <li>Coding a personal website is really fun and rewarding, but it's not something for everyone.</li>
@@ -109,4 +152,10 @@ <h4>Social Media</h4>
     <li>Personal websites are a form of art that is often about self-expression.</li>
     <li>Nostalgia isn't cheap art as long as it is genuine.</li>
   </ul>
+
+  -->
+
+  <hr />
+
+  <p>That's it for now. I might expand my manifesto in the future.</p>
 </section>