Skip to content

Commit 40e5d50

Browse files
committed
boom boom pow
1 parent 983b085 commit 40e5d50

File tree

106 files changed

+1594
-565
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

106 files changed

+1594
-565
lines changed

content/_data/changelog.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
[
22
{ "date": "2025-02-XX", "text": "TEMPLATE", "link": "" },
3+
{ "date": "2025-02-23", "text": "Guide about cachebusting is up. It's still WIP though!", "link": "/coding/cachebusting" },
34
{ "date": "2025-02-18", "text": "Lots of small updates, and I expanded my 'VSCode Setup' page!", "link": "/coding/my-setup" },
45
{ "date": "2025-02-12", "text": "The layout generator was updated: New features, new looks, and other improvements!", "link": "/coding/layout-generator" },
56
{ "date": "2025-02-09", "text": "Coding bookmarks have moved to their own page and have been expanded!", "link": "/coding/bookmarks" },

content/_includes/blog.njk

Lines changed: 13 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
---
22
testingOnLocalhost: false
3-
noCache: "20250218"
43
---
54

65
<!DOCTYPE html>
@@ -13,9 +12,8 @@ noCache: "20250218"
1312
content="{{ description or 'Welcome to petrapixel! Here you can find many resources for Neocities, coding help, media recommendations and more in a cute Old Web aesthetic!' }}"
1413
/>
1514
{% endif %}
16-
<script src="{{ nesting }}assets/js/main.js?nocache={{ noCache }}"></script>
17-
<link rel="stylesheet" href="{{ nesting }}assets/main.css?nocache={{ noCache }}" />
18-
<meta charset="utf-8">
15+
16+
<meta charset="utf-8" />
1917
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
2018
<link href="{{ nesting }}assets/img/favicon.ico" rel="icon" type="image/x-icon" />
2119

@@ -37,6 +35,10 @@ noCache: "20250218"
3735
gtag("config", "G-J64TL8KVTJ");
3836
</script>
3937
{% endif %}
38+
39+
<!-- CSS/JS + CACHEBUSTING -->
40+
<script src="{{ nesting }}assets/js/main.js?nocache={{ page.date | slugify }}"></script>
41+
<link rel="stylesheet" href="{{ nesting }}assets/main.css?nocache={{ page.date | slugify }}" />
4042
</head>
4143
<body class="{{ bodyClass }} blog-page-layout">
4244
<noscript id="no-js-warning">Please enable JavaScript to to be able to use all functions of this website!</noscript>
@@ -68,10 +70,10 @@ noCache: "20250218"
6870
<nav>
6971
<ul>
7072
<li><a href="/">Home</a></li>
71-
<li><a href="/blog{% if testingOnLocalhost %}/index{% endif %}" class="{% if title == "blog" %}active{% endif %}">All Blog Posts</a></li>
73+
<li><a href="/blog{% if testingOnLocalhost %}/index{% endif %}" class="{% if title == 'blog' %}active{% endif %}">All Blog Posts</a></li>
7274
<li><a href="https://neocities.org/site/petrapixel" target="_blank">Follow on Neocities</a></li>
7375
<li>
74-
<a href="/rss.xml" target="_blank" aria-label="RSS Feed" >RSS</a>
76+
<a href="/rss.xml" target="_blank" aria-label="RSS Feed">RSS</a>
7577
</li>
7678
</ul>
7779
</nav>
@@ -91,16 +93,16 @@ noCache: "20250218"
9193

9294
{% if dateCreated %}
9395
<div class="blog-page-date">Posted {{ dateCreated }}{% if dateUpdated != dateCreated %}, Updated {{ dateUpdated }}{% endif %}</div>
94-
{% endif %}
95-
96-
{% if title !== "blog" %}
96+
{% endif %} {% if title !== "blog" %}
9797
<section>
9898
<h2 style="height: 0px; overflow: hidden">Comments</h2>
99-
{% if commentsText %}<p>{{ commentsText | safe }}</p>{% endif %}
99+
{% if commentsText %}
100+
<p>{{ commentsText | safe }}</p>
101+
{% endif %}
100102
<div id="c_widget">Comment Widget could not be loaded!</div>
101103
<script src="{{ nesting }}assets/js/comment-widget.js"></script>
102104
</section>
103-
{% endif %}
105+
{% endif %}
104106
</main>
105107

106108
<!-- ------------------------------------------------ -->

content/_includes/coding.njk

Lines changed: 28 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
---
22
testingOnLocalhost: false
3-
noCache: "20250218"
43
---
54

65
<!DOCTYPE html>
@@ -13,8 +12,7 @@ noCache: "20250218"
1312
content="{{ description or 'Welcome to petrapixel! Here you can find many resources for Neocities, coding help, media recommendations and more in a cute Old Web aesthetic!' }}"
1413
/>
1514
{% endif %}
16-
<script src="{{ nesting }}assets/js/main.js?nocache={{ noCache }}"></script>
17-
<link rel="stylesheet" href="{{ nesting }}assets/main.css?nocache={{ noCache }}" />
15+
1816
<meta charset="utf-8" />
1917
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
2018
<link href="{{ nesting }}assets/img/favicon.ico" rel="icon" type="image/x-icon" />
@@ -51,6 +49,10 @@ noCache: "20250218"
5149
}
5250
</style>
5351
{% endif %}
52+
53+
<!-- CSS/JS + CACHEBUSTING -->
54+
<script src="{{ nesting }}assets/js/main.js?nocache={{ page.date | slugify }}"></script>
55+
<link rel="stylesheet" href="{{ nesting }}assets/main.css?nocache={{ page.date | slugify }}" />
5456
</head>
5557
<body class="{{ bodyClass }} coding-page-layout" {% if freezeframe %}onload="new Freezeframe();" {% endif %}>
5658
<noscript id="no-js-warning">Please enable JavaScript to to be able to use all functions of this website!</noscript>
@@ -97,6 +99,12 @@ noCache: "20250218"
9799
<li>
98100
<a href="/coding/checklist"><i class="fa-solid fa-list-check"></i><span>Self-study Checklist</span></a>
99101
</li>
102+
<!--
103+
<li>
104+
<a href="/coding/webringu"
105+
><i class="fa-solid fa-ring"></i><span>Webringu<small>Webring Script</small></span></a
106+
>
107+
</li>-->
100108
</ul>
101109
</div>
102110

@@ -127,13 +135,22 @@ noCache: "20250218"
127135
<div class="coding-navigation-category__title">Beginner Tutorials</div>
128136
<ul>
129137
<li>
130-
<a href="/coding/layout-base-code"><i class="fa-solid fa-border-none"></i><span>How to Load the Same Layout on Every Page</span></a>
138+
<a href="/coding/layout-base-code"><i class="fa-solid fa-border-none"></i><span>How to load the same layout on every page</span></a>
131139
</li>
132140
<li>
133141
<a href="/coding/positioning-tutorial"
134142
><i class="fa-brands fa-css"></i><span>CSS Positioning/Layout Tutorial<small>(display, position, transform, z-index, flexbox, grid, ...)</small></span></a
135143
>
136144
</li>
145+
<li>
146+
<a href="/coding/cachebusting"
147+
><i class="fa-solid fa-bomb"></i
148+
><span
149+
>Cachebusting <small class="aside-nav__new"><img src="{{ nesting }}assets/img/layout/new.gif" alt="" aria-hidden="true" /></small
150+
><small>(how to stop your website from being cached)</small>
151+
</span></a
152+
>
153+
</li>
137154
<!--
138155
<li>
139156
<a href="/coding/performance">how to make pages load faster<small>(performance optimization)</small></a>
@@ -165,12 +182,6 @@ noCache: "20250218"
165182
<div class="coding-navigation-category" aria-label="Miscellaneous">
166183
<div class="coding-navigation-category__title">Miscellaneous</div>
167184
<ul>
168-
<li>
169-
<a href="/coding/neocities"><i class="fa-solid fa-city"></i><span>Neocities Tips</span></a>
170-
</li>
171-
<li>
172-
<a href="/coding/snippets"><i class="fa-solid fa-code"></i><span>Code Snippets</span></a>
173-
</li>
174185
<li>
175186
<a href="/coding/my-setup"
176187
><i class="fa-solid fa-toolbox"></i
@@ -179,6 +190,12 @@ noCache: "20250218"
179190
></a
180191
>
181192
</li>
193+
<li>
194+
<a href="/coding/neocities"><i class="fa-solid fa-city"></i><span>Neocities Tips</span></a>
195+
</li>
196+
<li>
197+
<a href="/coding/snippets"><i class="fa-solid fa-code"></i><span>Code Snippets</span></a>
198+
</li>
182199
<li>
183200
<a href="/coding/now-what"><i class="fa-regular fa-lightbulb"></i><span>I know HTML, CSS, and JS. Now what?</span></a>
184201
</li>
@@ -227,7 +244,7 @@ noCache: "20250218"
227244

228245
<!-- ----------------- Visitors ----------------- -->
229246
<div class="aside-stats__stat" style="margin-bottom: 0; margin-top: 2em">
230-
<div class="aside-stuff__heading"><span>Visitors</span><img src="{{ nesting }}assets/img/layout/icon-stats.png" alt="" aria-hidden="true" /></div>
247+
<div class="aside-stuff__heading"><span>website hits</span><img src="{{ nesting }}assets/img/layout/icon-stats.png" alt="" aria-hidden="true" /></div>
231248
<div class="aside-stats__stat-content">
232249
<center>
233250
{% if not testingOnLocalhost %}<a href="https://www.free-website-hit-counter.com">

content/_includes/nav.njk

Lines changed: 7 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -133,9 +133,7 @@
133133
</li>
134134
<li><a href="/coding/cheatsheet">cheatsheet</a></li>
135135
<li>
136-
<a href="/coding/bookmarks"
137-
>list of helpful sites <small class="aside-nav__new"><img src="{{ nesting }}assets/img/layout/new.gif" alt="" aria-hidden="true" /></small
138-
></a>
136+
<a href="/coding/bookmarks">helpful sites </a>
139137
</li>
140138
<li>
141139
<a href="/coding/checklist">self-study checklist</a>
@@ -161,6 +159,11 @@
161159
<li>
162160
<a href="/coding/positioning-tutorial">positioning/layout tutorial (+ flexbox, grid)</a>
163161
</li>
162+
<li>
163+
<a href="/coding/positioning-tutorial"
164+
>cachebusting <small class="aside-nav__new"><img src="{{ nesting }}assets/img/layout/new.gif" alt="" aria-hidden="true" /></small
165+
></a>
166+
</li>
164167
<!-- <li>
165168
<a href="/coding/performance">how to make pages load faster</a>
166169
</li> -->
@@ -184,9 +187,9 @@
184187

185188
<strong>Miscellaneous:</strong>
186189
<ul>
190+
<li><a href="/coding/my-setup">my vscode setup</a></li>
187191
<li><a href="/coding/neocities">neocities tips</a></li>
188192
<li><a href="/coding/snippets">code snippets</a></li>
189-
<li><a href="/coding/my-setup">my vscode setup</a></li>
190193
<li>
191194
<a href="/coding/now-what">i know html/css/js... now what?</a>
192195
</li>

content/_includes/petrapixel.njk

Lines changed: 29 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
---
22
testingOnLocalhost: false
3-
noCache: "20250218"
43
---
54

65
<!DOCTYPE html>
@@ -13,8 +12,7 @@ noCache: "20250218"
1312
content="{{ description or 'Welcome to petrapixel! Here you can find many resources for Neocities, coding help, media recommendations and more in a cute Old Web aesthetic!' }}"
1413
/>
1514
{% endif %}
16-
<script src="{{ nesting }}assets/js/main.js?nocache={{ noCache }}"></script>
17-
<link rel="stylesheet" href="{{ nesting }}assets/main.css?nocache={{ noCache }}" />
15+
1816
<meta charset="utf-8" />
1917
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
2018
<link href="{{ nesting }}assets/img/favicon.ico" rel="icon" type="image/x-icon" />
@@ -45,6 +43,33 @@ noCache: "20250218"
4543
}
4644
</style>
4745
{% endif %}
46+
47+
<!-- CSS/JS + CACHEBUSTING -->
48+
<link rel="stylesheet" href="{{ nesting }}assets/main.css" />
49+
<script>
50+
document.addEventListener("DOMContentLoaded", function () {
51+
// Path to your CSS file (like usual), or empty ("") if you don't have one:
52+
const CSS_FILE_PATH = "{{ nesting }}assets/main.css";
53+
54+
// Path to your JS file (like usual), or empty ("") if you don't have one:
55+
const JS_FILE_PATH = "{{ nesting }}assets/js/main.js";
56+
57+
function loadScript(src) {
58+
const script = document.createElement("script");
59+
script.src = src + "?nocache=" + new Date().getTime();
60+
script.async = true;
61+
document.head.appendChild(script);
62+
}
63+
function loadCSS(href) {
64+
const link = document.createElement("link");
65+
link.rel = "stylesheet";
66+
link.href = href + "?nocache=" + new Date().getTime();
67+
document.head.appendChild(link);
68+
}
69+
if (JS_FILE_PATH) loadScript(JS_FILE_PATH);
70+
if (CSS_FILE_PATH) loadCSS(CSS_FILE_PATH);
71+
});
72+
</script>
4873
</head>
4974
<body class="{{ bodyClass }}" {% if freezeframe %}onload="new Freezeframe();" {% endif %}>
5075
<noscript id="no-js-warning">Please enable JavaScript to to be able to use all functions of this website!</noscript>
@@ -253,7 +278,7 @@ noCache: "20250218"
253278
</div>
254279
-->
255280
<div class="aside-stats__stat">
256-
<div class="aside-stuff__heading"><span>visitors</span><img src="{{ nesting }}assets/img/layout/icon-stats.png" alt="" aria-hidden="true" /></div>
281+
<div class="aside-stuff__heading"><span>website hits</span><img src="{{ nesting }}assets/img/layout/icon-stats.png" alt="" aria-hidden="true" /></div>
257282
<div class="aside-stats__stat-content">
258283
<center>
259284
{% if not testingOnLocalhost %}<a href="https://www.free-website-hit-counter.com">

content/about/about-me.html

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -441,11 +441,11 @@ <h2>Elsewhere</h2>
441441
<section>
442442
<h2>My Home</h2>
443443
<p>Some pics of my real-life home. It's nothing special, but it's mine :3</p>
444-
<div class="about-me-pages__gpoy">
445-
<img src="../assets/img/me/home3.jpg" loading="lazy" alt="A bedroom with orange tones and a bisexuality flag." />
446-
<img src="../assets/img/me/home4.jpg" loading="lazy" alt="A living room with a dino wall decal." />
447-
<img src="../assets/img/me/home1.jpg" loading="lazy" alt="A wall filled with posters of various sizes." />
448-
<img src="../assets/img/me/home2.jpg" loading="lazy" alt="A desk with a laptop, a monitor and a keyboard." />
444+
<div class="about-me-pages__home-gallery">
445+
<img src="../assets/img/me/home3.png" loading="lazy" alt="A bedroom with orange tones and a bisexuality flag." />
446+
<img src="../assets/img/me/home4.png" loading="lazy" alt="A living room with a dino wall decal." />
447+
<img src="../assets/img/me/home1.png" loading="lazy" alt="A wall filled with posters of various sizes." />
448+
<img src="../assets/img/me/home2.png" loading="lazy" alt="A desk with a laptop, a monitor and a keyboard." />
449449
</div>
450450
<hr />
451451
<h2>My Digital Home</h2>
@@ -469,7 +469,7 @@ <h2>Aesthetics</h2>
469469
<div class="about-me-page__aesthetic">
470470
<div class="about-me-page__aesthetic-title">midwest/southern gothic</div>
471471
<div class="about-me-page__aesthetic-images">
472-
<a href="https://pinterest.com/pin/357402920447092471/" target="_blank"><img alt="" src="https://i.pinimg.com/564x/99/aa/09/99aa099f901436b68fca0dcbc5e03bf6.jpg" /></a>
472+
<!-- <a href="https://pinterest.com/pin/357402920447092471/" target="_blank"><img alt="" src="https://i.pinimg.com/564x/99/aa/09/99aa099f901436b68fca0dcbc5e03bf6.jpg" /></a> -->
473473
<a href="https://pinterest.com/pin/357402920447055031/" target="_blank"><img alt="" src="https://i.pinimg.com/564x/ce/84/73/ce84732126d1adf5200d833ef1e6bda4.jpg" /></a>
474474
<a href="https://pinterest.com/pin/357402920443811250/" target="_blank"><img alt="" src="https://i.pinimg.com/564x/1b/03/74/1b037496e03a47526e9bd2a34d693adc.jpg" /></a>
475475
<a href="https://pinterest.com/pin/357402920443854880/" target="_blank"
@@ -485,23 +485,23 @@ <h2>Aesthetics</h2>
485485
<a href="https://pinterest.com/pin/357402920444421737/" target="_blank"
486486
><img alt="" src="https://i.pinimg.com/564x/ce/b9/20/ceb92072d4842f2b5f08d45191b9854a.jpg" style="object-position: top"
487487
/></a>
488-
<a href="https://pinterest.com/pin/357402920444421742/" target="_blank"><img alt="" src="https://i.pinimg.com/564x/44/48/5a/44485ad8128cc6fd169b89ca8ac28dd6.jpg" /></a>
488+
<!-- <a href="https://pinterest.com/pin/357402920444421742/" target="_blank"><img alt="" src="https://i.pinimg.com/564x/44/48/5a/44485ad8128cc6fd169b89ca8ac28dd6.jpg" /></a>-->
489489
</div>
490490
</div>
491491
<div class="about-me-page__aesthetic">
492492
<div class="about-me-page__aesthetic-title">sailing/pirates</div>
493493
<div class="about-me-page__aesthetic-images">
494494
<a href="https://pinterest.com/pin/357402920445987395/" target="_blank"><img alt="" src="https://i.pinimg.com/564x/f8/5b/18/f85b180b2a5f59d0e4d9f4c10a67b473.jpg" /></a>
495495
<a href="https://pinterest.com/pin/357402920443840378/" target="_blank"><img alt="" src="https://i.pinimg.com/564x/f8/18/da/f818da3e8680bb320783428e05860114.jpg" /></a>
496-
<a href="https://pinterest.com/pin/357402920445987397/" target="_blank"><img alt="" src="https://i.pinimg.com/564x/96/d8/aa/96d8aadca4fb0a59c6047388d7627fb8.jpg" /></a>
496+
<!-- <a href="https://pinterest.com/pin/357402920445987397/" target="_blank"><img alt="" src="https://i.pinimg.com/564x/96/d8/aa/96d8aadca4fb0a59c6047388d7627fb8.jpg" /></a>-->
497497
<a href="https://pinterest.com/pin/357402920443840323/" target="_blank"><img alt="" src="https://i.pinimg.com/564x/d3/e7/2a/d3e72a53fab319d3b5621192dea9cd4f.jpg" /></a>
498498
</div>
499499
</div>
500500
<div class="about-me-page__aesthetic">
501501
<div class="about-me-page__aesthetic-title">dark academia</div>
502502
<div class="about-me-page__aesthetic-images">
503503
<a href="https://pinterest.com/pin/357402920443840253/" target="_blank"><img alt="" src="https://i.pinimg.com/564x/83/f8/95/83f895c48901750716e17a5a602ca311.jpg" /></a>
504-
<a href="https://pinterest.com/pin/357402920442215233/" target="_blank"><img alt="" src="https://i.pinimg.com/564x/2d/c0/cd/2dc0cd97fd7b82145c1de51cfdc966fc.jpg" /></a>
504+
<!--<a href="https://pinterest.com/pin/357402920442215233/" target="_blank"><img alt="" src="https://i.pinimg.com/564x/2d/c0/cd/2dc0cd97fd7b82145c1de51cfdc966fc.jpg" /></a>-->
505505
<a href="https://pinterest.com/pin/357402920442189721/" target="_blank"><img alt="" src="https://i.pinimg.com/564x/ed/4d/9a/ed4d9ae2baa063ca5d5af751c1823af2.jpg" /></a>
506506
<a href="https://pinterest.com/pin/357402920442184480/" target="_blank"><img alt="" src="https://i.pinimg.com/564x/70/a8/ec/70a8ec9629020b4be791276206dbfdb3.jpg" /></a>
507507
</div>
@@ -511,14 +511,14 @@ <h2>Aesthetics</h2>
511511
<div class="about-me-page__aesthetic-images">
512512
<a href="https://pinterest.com/pin/357402920446443556/" target="_blank"><img alt="" src="https://i.pinimg.com/564x/e0/e0/e0/e0e0e0dae072087ae166284d6cf5d113.jpg" /></a>
513513
<a href="https://pinterest.com/pin/357402920447709414/" target="_blank"><img alt="" src="https://i.pinimg.com/736x/33/f1/51/33f151c67404a7b397d653412189dc27.jpg" /></a>
514-
<a href="https://pinterest.com/pin/357402920446242871/" target="_blank"><img alt="" src="https://i.pinimg.com/564x/fc/8f/18/fc8f180dfa2c81c65c5f32cd6c954669.jpg" /></a>
514+
<!--<a href="https://pinterest.com/pin/357402920446242871/" target="_blank"><img alt="" src="https://i.pinimg.com/564x/fc/8f/18/fc8f180dfa2c81c65c5f32cd6c954669.jpg" /></a>-->
515515
<a href="https://pinterest.com/pin/357402920445777299/" target="_blank"><img alt="" src="https://i.pinimg.com/564x/18/0c/b2/180cb25f093b0ca2fcd1f0eebbf9b8e5.jpg" /></a>
516516
</div>
517517
</div>
518518
<div class="about-me-page__aesthetic">
519519
<div class="about-me-page__aesthetic-title">misc.</div>
520520
<div class="about-me-page__aesthetic-images">
521-
<a href="https://pinterest.com/pin/357402920442211336/" target="_blank"><img alt="" src="https://i.pinimg.com/564x/90/20/ea/9020ea6705e4a7e6af3656994f1bf68a.jpg" /></a>
521+
<!--<a href="https://pinterest.com/pin/357402920442211336/" target="_blank"><img alt="" src="https://i.pinimg.com/564x/90/20/ea/9020ea6705e4a7e6af3656994f1bf68a.jpg" /></a>-->
522522
<a href="https://pinterest.com/pin/357402920447293183/" target="_blank"><img alt="" src="https://i.pinimg.com/564x/57/81/c9/5781c90b85dc10d5cf7e94aff0e35638.jpg" /></a>
523523
<a href="https://pinterest.com/pin/357402920443841849/" target="_blank"><img alt="" src="https://i.pinimg.com/564x/fd/b7/d4/fdb7d45d49ef19742e545db8beabed29.jpg" /></a>
524524
<a href="https://pinterest.com/pin/357402920447293089/" target="_blank"><img alt="" src="https://i.pinimg.com/736x/2b/03/48/2b03482b8ce9b0da600283fabf1482f6.jpg" /></a>

content/about/credits.html

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -167,4 +167,5 @@ <h2>Images:</h2>
167167
on it for the source (If it's not linked it's my own picture)!-->
168168
The website logo was created by me on Canva.
169169
</p>
170+
<p>I dithered some images using <a href="https://ditherit.com/" target="_blank">ditherit.com</a>.</p>
170171
</section>

0 commit comments

Comments
 (0)