Skip to content

Commit bed41f2

Browse files
petracodingpetracoding
committed
heller als licht
1 parent 328a583 commit bed41f2

File tree

121 files changed

+973
-569
lines changed

Some content is hidden

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

121 files changed

+973
-569
lines changed

‎.gitignore‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,6 @@ notes.txt
1818
img-Verknüpfung.lnk
1919
public/assets/js/layoutGenerator.js.LICENSE.txt
2020

21-
2221
# -----------------------------------------------------------------
2322
# .gitignore
2423
# Bare Minimum Git

‎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-07-XX", "text": "TEMPLATE", "link": "" },
3+
{ "date": "2025-07-23", "text": "New tutorial: Using the Google Sheets API", "link": "/coding/google-sheets-api-tutorial" },
34
{ "date": "2025-07-22", "text": "I now have a list of text cliques! Submit cliques now!", "link": "/coding/cliques" },
45
{ "date": "2025-07-18", "text": "The layout generator now has a download function", "link": "/coding/layout-generator" },
56
{ "date": "2025-07-17", "text": "Updated my age. Happy birthday to me!", "link": "" },

‎content/_data/nav.json‎

Lines changed: 27 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
"link": "/"
55
},
66
{
7-
"label": "about",
7+
"label": "About",
88
"new": false,
99
"items": [
1010
{
@@ -71,7 +71,7 @@
7171
]
7272
},
7373
{
74-
"label": "my creations",
74+
"label": "My Creations",
7575
"new": false,
7676
"items": [
7777
{
@@ -119,7 +119,7 @@
119119
]
120120
},
121121
{
122-
"label": "media recs",
122+
"label": "Media Recs",
123123
"new": false,
124124
"items": [
125125
{
@@ -167,7 +167,7 @@
167167
]
168168
},
169169
{
170-
"label": "resources for you",
170+
"label": "Resources",
171171
"new": false,
172172
"items": [
173173
{
@@ -209,7 +209,7 @@
209209
]
210210
},
211211
{
212-
"label": "fun stuff!",
212+
"label": "Fun Stuff!",
213213
"new": true,
214214
"items": [
215215
{
@@ -257,13 +257,13 @@
257257
]
258258
},
259259
{
260-
"label": "coding & webmastery",
260+
"label": "Coding & Webmastery",
261261
"new": false,
262262
"isCodeMenu": true,
263263
"items": [
264264
{
265265
"label": "Tools",
266-
"new": true,
266+
"new": false,
267267
"items": [
268268
{
269269
"link": "/coding/layout-generator",
@@ -324,6 +324,7 @@
324324
{
325325
"link": "/coding/webringu",
326326
"label": "Webringu",
327+
"labelInMainMenu": "Webring Script",
327328
"sublabel": "Simple Webring Script",
328329
"new": false,
329330
"hide": false,
@@ -450,12 +451,20 @@
450451
"new": false,
451452
"hide": false,
452453
"icon": "fa-solid fa-code"
454+
},
455+
{
456+
"link": "/coding/google-sheets-api-tutorial",
457+
"label": "Google Sheets API Tutorial",
458+
"sublabel": "Read sheets data with JS",
459+
"new": true,
460+
"hide": false,
461+
"icon": "fa-brands fa-google-drive"
453462
}
454463
]
455464
},
456465
{
457466
"label": "Miscellaneous",
458-
"new": false,
467+
"new": true,
459468
"items": [
460469
{
461470
"link": "/coding/neocities",
@@ -481,14 +490,6 @@
481490
"hide": false,
482491
"icon": "fa-solid fa-toolbox"
483492
},
484-
{
485-
"link": "/webring",
486-
"label": "Code Collective Webring",
487-
"sublabel": "",
488-
"new": true,
489-
"hide": false,
490-
"icon": "fa-solid fa-ring"
491-
},
492493
{
493494
"link": "/coding/now-what",
494495
"label": "I know HTML, CSS, and JS. Now what?",
@@ -521,6 +522,16 @@
521522
"new": true,
522523
"hide": false,
523524
"icon": "fa-solid fa-list-ul"
525+
},
526+
527+
{
528+
"link": "/webring",
529+
"label": "Code Collective Webring",
530+
"sublabel": "",
531+
"new": true,
532+
"hide": false,
533+
"icon": "fa-solid fa-ring",
534+
"hideInCodingNav": true
524535
}
525536
]
526537
}

‎content/_includes/nav.njk‎

Lines changed: 37 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -7,38 +7,62 @@
77
<a href="{{ mainNavItem.link }}"><img width="9" src="{{ nesting }}assets/img/layout/heart.png" alt="" aria-hidden="true" />{{ mainNavItem.label }}</a>
88
</li>
99

10-
{% else %}
10+
{% else %} {% if mainNavItem.isCodeMenu %}
11+
</ul>
12+
13+
<!-- CODING HEADER -->
14+
<div class="aside-nav__heading" aria-hidden="true">Coding/Webmastery</div>
15+
16+
<ul aria-label="Coding Menu">
17+
{% for codingCategory in mainNavItem.items %}
1118

19+
<!-- CODING DETAIL-ELEMENTS -->
1220
<li>
13-
<details>
21+
<details data-id="{{ codingCategory.label }}">
1422
<summary>
15-
{{ mainNavItem.label }}{% if mainNavItem.new %}<small class="aside-nav__new"><img src="{{ nesting }}assets/img/layout/new.gif" alt="" aria-hidden="true" /></small>{% endif %}
23+
{{ codingCategory.label }}{% if codingCategory.new %}<small class="aside-nav__new"><img src="{{ nesting }}assets/img/layout/new.gif" alt="" aria-hidden="true" /></small>{% endif %}
1624
</summary>
1725
<ul>
18-
{% for navItem in mainNavItem.items %} {% if not navItem.hide %} {% if navItem.link %}
26+
{% for navItem in codingCategory.items %} {% if not navItem.hide %}
1927

28+
<!-- CODING MENU ITEMS -->
2029
<li {% if navItem.mobileOnly %}class="mobile-only" {% endif %}>
2130
<a href="{{ navItem.link }}"
22-
>{{ navItem.label | safe }}{% if navItem.new %}<small class="aside-nav__new"><img src="{{ nesting }}assets/img/layout/new.gif" alt="" aria-hidden="true" /></small>{% endif %}</a
31+
>{% if navItem.labelInMainMenu %}{{ navItem.labelInMainMenu | safe }}{% else %}{{ navItem.label | safe }}{% endif %}{% if navItem.new %}<small class="aside-nav__new"
32+
><img src="{{ nesting }}assets/img/layout/new.gif" alt="" aria-hidden="true" /></small
33+
>{% endif %}</a
2334
>
2435
</li>
2536

26-
{% else %}
37+
{% endif %} {% endfor %}
38+
</ul>
39+
</details>
40+
</li>
41+
42+
{% endfor %} {% else %}
2743

28-
<b>{{ navItem.label }}</b>
44+
<!-- GENERAL DETAIL-ELEMENTS -->
2945

30-
{% for subNavItem in navItem.items %} {% if not subNavItem.hide %}
31-
<li {% if subNavItem.mobileOnly %}class="mobile-only" {% endif %}>
32-
<a href="{{ subNavItem.link }}"
33-
>{{ subNavItem.label }}{% if subNavItem.new %}<small class="aside-nav__new"><img src="{{ nesting }}assets/img/layout/new.gif" alt="" aria-hidden="true" /></small>{% endif %}</a
46+
<li>
47+
<details data-id="{{ mainNavItem.label }}">
48+
<summary>
49+
{{ mainNavItem.label }}{% if mainNavItem.new %}<small class="aside-nav__new"><img src="{{ nesting }}assets/img/layout/new.gif" alt="" aria-hidden="true" /></small>{% endif %}
50+
</summary>
51+
<ul>
52+
{% for navItem in mainNavItem.items %} {% if not navItem.hide %}
53+
54+
<!-- GENERAL MENU ITEMS -->
55+
<li {% if navItem.mobileOnly %}class="mobile-only" {% endif %}>
56+
<a href="{{ navItem.link }}"
57+
>{{ navItem.label | safe }}{% if navItem.new %}<small class="aside-nav__new"><img src="{{ nesting }}assets/img/layout/new.gif" alt="" aria-hidden="true" /></small>{% endif %}</a
3458
>
3559
</li>
3660

37-
{% endif %} {% endfor %} {% endif %} {% endif %} {% endfor %}
61+
{% endif %} {% endfor %}
3862
</ul>
3963
</details>
4064
</li>
4165

42-
{% endif %} {% endfor %}
66+
{% endif %} {% endif %} {% endfor %}
4367
</ul>
4468
</nav>

‎content/_includes/petrapixel.njk‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -237,6 +237,12 @@ testingOnLocalhost: false
237237
</center>
238238
</div>
239239

240+
<!-- ----------------- TAMANOTCHI ----------------- -->
241+
242+
<div class="aside-stuff aside-tamanotchi">
243+
<a href="https://tamanotchi.world/25005c"><img src="https://tamanotchi.world/i2/25005" alt="It's tamaNOTchi! Click to feed!" /></a>
244+
</div>
245+
240246
<!-- ----------------- COMING SOON ----------------- -->
241247
<!--
242248
<div class="aside-stuff aside-changelog">

‎content/blog/neocities-automatic-deployment.html‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,11 @@
55
nesting: "../"
66
---
77

8+
<script>
9+
// Redirect to other Page!
10+
window.location.replace("https://petrapixel.neocities.org/coding/neocities#how-to-upload-changes-to-neocities-automatically");
11+
</script>
12+
813
<section>
914
<article class="blog-article" data-date="2024-02-20" data-tags="neocities, coding">
1015
<h1 class="blog-article__title">How to upload changes to Neocities automatically</h1>

‎content/coding/checklist.html‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -83,6 +83,7 @@ <h3 id="beginners-html">HTML</h3>
8383
</li>
8484
<li><input type="checkbox" /><a href="https://www.w3schools.com/html/html_entities.asp" target="_blank">HTML Entities</a> <span>(&lt;, &gt;, &, ...)</span></li>
8585
<li><input type="checkbox" /><a href="https://www.w3schools.com/html/html_favicon.asp" target="_blank">FavIcon</a> <span>(small image shown in tab)</span></li>
86+
<li><input type="checkbox" /><a href="https://stackoverflow.com/a/8424811/3187492" target="_blank">Anchor links</a> <span>(jump to a section of a page)</span></li>
8687
</ul>
8788
<h3 id="beginners-css">CSS</h3>
8889
<ul class="checklist">

‎content/coding/cliques.html‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -94,6 +94,13 @@ <h2 id="faq">FAQ</h2>
9494
Forms or something similar to collect responses. Some cliques also use <a href="https://thefanlistings.org/start/apply.php" target="_blank">fanlisting functionality</a>.
9595
</p>
9696
<br />
97+
98+
<b>Can you add this/my clique?</b>
99+
<p>I could, but I'd prefer it if you can added it yourself by <a href="https://forms.gle/CEa9bg7ZZV2x3qBY8" target="_blank">filling out this form</a>!</p>
100+
<br />
101+
102+
<b>How did you make this?</b>
103+
<p>With Google Forms, Google Sheets and the Google Sheets API. <a href="/coding/google-sheets-api-tutorial" target="_blank">I have a tutorial here.</a></p>
97104
</section>
98105

99106
<section>

‎content/coding/git-tutorial.html‎

Lines changed: 14 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -117,7 +117,7 @@ <h3>The process</h3>
117117
etc.) We will then <b>commit</b> these chosen ("staged") files and give all of the changes a name, e.g. <i>"Update About-Me Page"</i>.
118118
</p>
119119
<p>I've tried to visualize it here: <span style="opacity: 0.5">(Behold my magnum opus)</span></p>
120-
<div class="image"><img src="../assets/img/coding/git-tutorial/magnumopus.png" alt="" /></div>
120+
<img class="image" src="../assets/img/coding/git-tutorial/magnumopus.png" alt="" />
121121
</section>
122122
<!-- ----------------------------------------------------------------------------------------------------- -->
123123
<!-- ----------------------------------------------------------------------------------------------------- -->
@@ -142,8 +142,8 @@ <h3>How to use commands</h3>
142142
<p>
143143
If you're using <b>VSCode</b>, simply right-click the file tree on the left side of the program and choose "Open in Integrated Terminal". This will open the terminal on the bottom of the program:
144144
</p>
145-
<div class="image"><img src="../assets/img/coding/git-tutorial/1.png" alt="" /></div>
146-
<div class="image"><img src="../assets/img/coding/git-tutorial/2.png" alt="" /></div>
145+
<img class="image" src="../assets/img/coding/git-tutorial/1.png" alt="" />
146+
<img class="image" src="../assets/img/coding/git-tutorial/2.png" alt="" />
147147
<p>
148148
Other IDEs (= programs you code in) might also have integrated terminals. If you use Notepad++ or other simple editors to work on your code you can open a Windows terminal by
149149
<b>right-clicking in your folder in the Windows explorer and choosing "Open in Terminal"</b> (I'm using Windows 11 so it might be labelled differently for you). The Windows Powershell will open.
@@ -166,11 +166,11 @@ <h3>How to use commands</h3>
166166
<h2 id="new-project">1. Creating a new project</h2>
167167

168168
<p>Go to GitHub and create an empty repository. You could call it <i>my-website</i> or <i>example.neocities.org</i> or something like that. Do <b>not</b> include a .README file.</p>
169-
<div class="image"><img src="../assets/img/coding/git-tutorial/0.png" alt="" /></div>
169+
<img class="image" src="../assets/img/coding/git-tutorial/0.png" alt="" />
170170
<p>On the repostiory page, copy the HTTPS (not SSH!) link. We will need this in a second.</p>
171-
<div class="image"><img src="../assets/img/coding/git-tutorial/3b.png" alt="" /></div>
171+
<img class="image" src="../assets/img/coding/git-tutorial/3b.png" alt="" />
172172
<p>(If you want to find this link later, it will be in the "Code" menu:)</p>
173-
<div class="image"><img src="../assets/img/coding/git-tutorial/3.png" alt="" /></div>
173+
<img class="image" src="../assets/img/coding/git-tutorial/3.png" alt="" />
174174
<p>Open a terminal in your project folder. (If you don't have a project folder yet create it now and add at least one file.)</p>
175175
<!-- <p>
176176
Choose whether you want to call your primary branch <em>main</em> or <em>master</em> . (It doesn't really matter. <em>master</em> used to be the default, and is still extremely common, but
@@ -246,7 +246,7 @@ <h2 id="staging">2. Staging changes</h2>
246246

247247
<p>To stage <em>every</em> changed file, you can simply do: <code>git add .</code></p>
248248
<p><strong>Or: </strong>When using the VSCode UI simply press the small "+" next any changed file to stage it:</p>
249-
<div class="image"><img src="../assets/img/coding/git-tutorial/4.png" alt="" /></div>
249+
<img class="image" src="../assets/img/coding/git-tutorial/4.png" alt="" />
250250

251251
<!-- <p>
252252
To stage only a <strong>part</strong> of a file, you can use: <code>git add -p &lt;filename&gt;</code> and define for every line what you want to do. (y=stage,n=not stage,q=not stage and
@@ -260,7 +260,7 @@ <h3>Unstaging Files</h3>
260260
<p>When unstaging files your changes will <b>not</b> be undone. The only thing that changes is the status of the file: It will change from staged to unstaged.</p>
261261
<p>To un-stage files/folders, execute <code>git restore --staged &lt;file&gt;</code> or <code>git reset HEAD -- &lt;file&gt;</code> (They do the same thing.)</p>
262262
<p><strong>Or: </strong>When using the VSCode UI simply press the small "-" next to any staged file to unstage it:</p>
263-
<div class="image"><img src="../assets/img/coding/git-tutorial/5.png" alt="" /></div>
263+
<img class="image" src="../assets/img/coding/git-tutorial/5.png" alt="" />
264264
<br />
265265
</details>
266266
<br />
@@ -284,7 +284,7 @@ <h2 id="committing">3. Committing changes</h2>
284284
<pre><code>git commit -m "Example message"</code></pre>
285285
</div>
286286
<p><strong>Or: </strong>When using the VSCode UI simply type your message into the input box at the top and click 'Commit':</p>
287-
<div class="image"><img src="../assets/img/coding/git-tutorial/6.png" alt="" /></div>
287+
<img class="image" src="../assets/img/coding/git-tutorial/6.png" alt="" />
288288
<p>Some <strong>good</strong> examples for commit messages:</p>
289289
<ul>
290290
<li>"BUGFIX: Fix order of gallery items"</li>
@@ -307,7 +307,7 @@ <h3>Amending changes</h3>
307307
<pre><code>git commit --amend --no-edit</code></pre>
308308
<p>This will add your changes to your most recent commit. The commit message will stay unchanged.</p>
309309
<p><strong>Or: </strong>If you're using VSCode you can open the submenu of the "Commit" button and click "Commit (Amend)":</p>
310-
<div class="image"><img src="../assets/img/coding/git-tutorial/amend.png" alt="" /></div>
310+
<img class="image" src="../assets/img/coding/git-tutorial/amend.png" alt="" />
311311
</details>
312312

313313
<h3>Undoing commits</h3>
@@ -358,10 +358,10 @@ <h2 id="pushing">4. Pushing changes</h2>
358358
<pre><code>git push</code></pre>
359359
</div>
360360
<p><strong>Or: </strong>When using the VSCode UI simply press "Sync Changes":</p>
361-
<div class="image"><img src="../assets/img/coding/git-tutorial/7.png" alt="" /></div>
361+
<img class="image" src="../assets/img/coding/git-tutorial/7.png" alt="" />
362362
<p>Now, if you refresh your GitHub page, you should see the changes.</p>
363363
<p>If you click on the "Commits" button you can see a list of all your previous commits/changes.</p>
364-
<div class="image"><img src="../assets/img/coding/git-tutorial/8.png" alt="" /></div>
364+
<img class="image" src="../assets/img/coding/git-tutorial/8.png" alt="" />
365365
</section>
366366
<!-- ----------------------------------------------------------------------------------------------------- -->
367367
<!-- ----------------------------------------------------------------------------------------------------- -->
@@ -392,12 +392,12 @@ <h4>How to set it up:</h4>
392392
</li>
393393
<li>
394394
Get your API Key for your Neocities account. (It can be found in your Site Settings on Neocities under "<span style="text-transform: none">API</span>").<br />
395-
<div class="image"><img src="../assets/img/coding/git-tutorial/api1.png" alt="" /></div>
395+
<img class="image" src="../assets/img/coding/git-tutorial/api1.png" alt="" />
396396
</li>
397397
<li>
398398
Open your repository on GitHub, go to its "Settings", then "Secrets and Variables" -&gt; "Actions". Add a secret with the name
399399
<span style="text-transform: none">NEOCITIES_API_TOKEN</span> and set your Neocities API Key as the value.<br />
400-
<div class="image"><img src="../assets/img/coding/git-tutorial/api2.png" alt="" /></div>
400+
<img class="image" src="../assets/img/coding/git-tutorial/api2.png" alt="" />
401401
</li>
402402
</ol>
403403
<p>Done! Now whenever you push to your master/main branch, the changed/added files will automatically be uploaded to your Neocities site.</p>

0 commit comments

Comments
 (0)