From fdef67388674314f18d3390553fe9ffa3fc01d65 Mon Sep 17 00:00:00 2001
From: sthag <sthag@interaktionsweise.de>
Date: Tue, 10 Mar 2026 19:40:03 +0100
Subject: [PATCH 1/6] feat: Update card and placeholder

- Change card from njk to liquid
- Fix flag placeholder
- Update structure of card
---
 .eleventy.js                                  |  3 +-
 source/screens/demo/examples/card.liquid      | 69 +++++++++++++++
 source/screens/demo/examples/card.njk         | 83 -------------------
 source/style/modules/card/_card_module.scss   |  2 +-
 .../hippie/partials/placeholder-flag.liquid   |  2 +-
 5 files changed, 73 insertions(+), 86 deletions(-)
 create mode 100644 source/screens/demo/examples/card.liquid
 delete mode 100644 source/screens/demo/examples/card.njk

diff --git a/.eleventy.js b/.eleventy.js
index 673656e..152f256 100644
--- a/.eleventy.js
+++ b/.eleventy.js
@@ -35,7 +35,8 @@ export default async function (eleventyConfig) {
 			name: 'Vorname Nachname',
 			address: 'Straße Nr., PLZ Ort',
 			phone: '+49 (0)101 1337 48',
-			mail: 'name@domain.tld'
+			mail: 'name@domain.tld',
+			domain: 'https://domain.tld'
 		},
 		debugMode: true,
 		legacyMode: false
diff --git a/source/screens/demo/examples/card.liquid b/source/screens/demo/examples/card.liquid
new file mode 100644
index 0000000..dbe560b
--- /dev/null
+++ b/source/screens/demo/examples/card.liquid
@@ -0,0 +1,69 @@
+---
+title: Card
+tags:
+- demoExample
+---
+{% assign pageClass = "html_card" %}
+{% layout 'hippie/simple.liquid' %}
+
+{% block body %}
+<div class="card_bkg">
+	<div id="dither"></div>
+	{% render 'hippie/partials/placeholder-flag.liquid', type: '', id: 'flag' %}
+	{% comment %}<img id="dither" src="art/flag_dither.png" width="1920" height="1200" alt="Background flag dithered"/>{% endcomment %}
+</div>
+<div class="card_box">
+	<main>
+		<p>Titel<br/>und Beschreibung</p>
+		<h1>{% text hippie.placeholders.name %}</h1>
+		<p>
+			{% link hippie.placeholders.mail, '', '', 'card_address' %}<br/>
+			{% link hippie.placeholders.domain, 'site.tld', '', 'decent' %}
+			&middot;
+			{% text hippie.placeholders.address, '', 'decent' %}</p>
+	</main>
+</div>
+{% endblock %}
+
+{% block script %}
+<script>
+	const flag = document.getElementById('flag');
+	let colors = new Array();
+	let iId = undefined;
+	let position = 0;
+
+	for (let i = 1; i <= flag.childElementCount; i++) {
+		colors.push(document.getElementById('triangle-' + i).getAttribute('fill'));
+	}
+
+	document
+		.querySelector('main')
+		.addEventListener('mouseenter', () => {
+			iId = setInterval(() => {
+				for (let i = 1; i <= colors.length; i++) {
+					position++;
+
+					if (position >= colors.length) {
+						position = 0;
+					}
+
+					document
+						.getElementById('triangle-' + i)
+						.setAttribute('fill', colors[position]);
+				}
+
+				position++;
+
+				if (position >= colors.length) {
+					position = 0;
+				}
+			}, 600);
+		});
+
+	document
+		.querySelector('main')
+		.addEventListener('mouseleave', () => {
+			iId && clearInterval(iId);
+		});
+</script>
+{% endblock %}
\ No newline at end of file
diff --git a/source/screens/demo/examples/card.njk b/source/screens/demo/examples/card.njk
deleted file mode 100644
index e05818d..0000000
--- a/source/screens/demo/examples/card.njk
+++ /dev/null
@@ -1,83 +0,0 @@
----
-title: Card
-tags:
-  - demoExample
----
-{% set pageId = page.fileSlug %}
-{% set pageClass = "html_card" %}
-
-{% extends "demo/_default.njk" %}
-{% import "hippie/macros/_placeholder.njk" as ph %}
-
-{% block title %}{{ title }}
-{% endblock %}
-
-{% block head %}
-	{{ super() }}
-{% endblock %}
-
-{% block body %}
-
-	<!-- {{ page.fileSlug }}.page -->
-	<div class="card_bkg">
-		<div id="dither"></div>
-		{{ ph.flag('svg', '', 'flag', '') }}
-		{# <img id="dither" src="art/flag_dither.png" width="1920" height="1200" alt="Background flag dithered"/> #}
-	</div>
-	<div class="card_box">
-		<div id="js_content">
-			<p>Titel<br/>und Beschreibung</p>
-			<h1>{{ ph.name() }}</h1>
-			<p>
-				{{ ph.email('card_address') }}<br/>
-				{{ ph.link('decent', 'site.tld') }}
-				&middot;
-				{{ ph.address('decent') }}</p>
-		</div>
-	</div>
-{% endblock %}
-
-{% block script %}
-	<script>
-		const flag = document.getElementById("flag");
-		let colors = new Array();
-		let iId = undefined;
-		let position = 0;
-
-		for (let i = 1; i <= flag.childElementCount; i++) {
-			colors.push(document.getElementById("triangle-" + i).getAttribute("fill"));
-		}
-
-		// console.log(colors);
-
-		document
-			.getElementById('js_content')
-			.addEventListener('mouseenter', () => {
-				iId = setInterval(() => {
-					for (let i = 1; i <= colors.length; i++) {
-						position++;
-
-						if (position >= colors.length) {
-							position = 0;
-						}
-
-						document
-							.getElementById("triangle-" + i)
-							.setAttribute("fill", colors[position]);
-					}
-
-					position++;
-
-					if (position >= colors.length) {
-						position = 0;
-					}
-				}, 600);
-			});
-
-		document
-			.getElementById('js_content')
-			.addEventListener('mouseleave', () => {
-				iId && clearInterval(iId);
-			});
-	</script>
-{% endblock %}
\ No newline at end of file
diff --git a/source/style/modules/card/_card_module.scss b/source/style/modules/card/_card_module.scss
index 5244c7f..86ab09c 100644
--- a/source/style/modules/card/_card_module.scss
+++ b/source/style/modules/card/_card_module.scss
@@ -32,7 +32,7 @@
 				// text-align: center;
 			}
 
-			& > div {
+			& > main {
 				position: relative;
 				padding: 64px 64px 24px 64px;
 				border: 1px solid #FFF;
diff --git a/source/templates/hippie/partials/placeholder-flag.liquid b/source/templates/hippie/partials/placeholder-flag.liquid
index 280a48c..6b6b048 100644
--- a/source/templates/hippie/partials/placeholder-flag.liquid
+++ b/source/templates/hippie/partials/placeholder-flag.liquid
@@ -14,7 +14,7 @@
 		<g>
 			<use xlink:href="#triangle-5" style="filter: url(#turb3);" />
 		</g>{% endcomment %}
-		{% if desc != '' %}
+		{% if desc %}
 			<desc>{{ desc }}</desc>
 		{% endif %}
 		<rect id="triangle-5" y="0" fill="#273F8B" width="1920" height="1200"/>

From 6a717b7ab8d2cf1f9871b3da7a59d43087007bc1 Mon Sep 17 00:00:00 2001
From: sthag <sthag@interaktionsweise.de>
Date: Tue, 10 Mar 2026 20:36:54 +0100
Subject: [PATCH 2/6] feat: Update basic screens

- Add order to front matter
- Separate script and assets block
- Sort index lists
---
 source/screens/demo/basics.liquid       |  1 +
 source/screens/demo/components.liquid   |  3 ++-
 source/screens/demo/index.liquid        |  9 ++++-----
 source/screens/demo/introduction.liquid |  7 +------
 source/screens/demo/layouts.liquid      | 10 +++++-----
 source/templates/hippie/full.liquid     |  5 +++--
 source/templates/hippie/page.liquid     |  6 ++++--
 7 files changed, 20 insertions(+), 21 deletions(-)

diff --git a/source/screens/demo/basics.liquid b/source/screens/demo/basics.liquid
index a300a21..d3c7a08 100644
--- a/source/screens/demo/basics.liquid
+++ b/source/screens/demo/basics.liquid
@@ -2,6 +2,7 @@
 title: Basics
 tags:
 - demoIndex
+order: 2
 ---
 {% layout 'hippie/page.liquid' %}
 
diff --git a/source/screens/demo/components.liquid b/source/screens/demo/components.liquid
index 7070190..ca72d3f 100644
--- a/source/screens/demo/components.liquid
+++ b/source/screens/demo/components.liquid
@@ -2,6 +2,7 @@
 title: Components
 tags:
 - demoIndex
+order: 3
 ---
 {% layout 'hippie/page.liquid' %}
 
@@ -306,7 +307,7 @@ tags:
 				<input id="inpPass" type="password"/>
 				<span id="hintPass" style="visibility:hidden"><kbd>Shift</kbd> is pressed.</span>
 				<br>
-				<input id ="inpText" type="text"/>
+				<input id="inpText" type="text"/>
 				<span id="hintText"><kbd>CapsLock</kbd> is on.</span>
 			</form>
 		</div>
diff --git a/source/screens/demo/index.liquid b/source/screens/demo/index.liquid
index bd3e609..684b6b3 100644
--- a/source/screens/demo/index.liquid
+++ b/source/screens/demo/index.liquid
@@ -1,8 +1,6 @@
 ---
 permalink: "/"
 title: Index
-tags:
-- demoIndex
 ---
 {% assign pageId = page.fileSlug -%}
 {% assign pageClass = 'h_full_view' -%}
@@ -35,7 +33,8 @@ tags:
 		</div>
 		<nav>
 			<ul class="block link">
-				{% for link in collections.demoIndex %}
+				{% assign indexByOrder = collections.demoIndex | sort: 'data.order' %}
+				{% for link in indexByOrder %}
 					<li>
 						<a href="{{ link.page.url }}">{{ link.data.title }}</a>
 					</li>
@@ -47,7 +46,6 @@ tags:
 				<h3>Page</h3>
 				<ul class="block link">
 					{% assign pagesByTitle = collections.demoPage | sort: 'data.title' %}
-
 					{% for link in pagesByTitle %}
 						<li>
 							<a href="{{ link.page.url }}">{{ link.data.title }}</a>
@@ -58,7 +56,8 @@ tags:
 			<section>
 				<h3>Example</h3>
 				<ul class="block link">
-					{% for link in collections.demoExample %}
+					{% assign examplesByTitle = collections.demoExample | sort: 'data.title' %}
+					{% for link in examplesByTitle %}
 						<li>
 							<a href="{{ link.page.url }}">{{ link.data.title }}</a>
 						</li>
diff --git a/source/screens/demo/introduction.liquid b/source/screens/demo/introduction.liquid
index 91993cb..21e2e52 100644
--- a/source/screens/demo/introduction.liquid
+++ b/source/screens/demo/introduction.liquid
@@ -2,6 +2,7 @@
 title: Introduction
 tags:
 - demoIndex
+order: 1
 ---
 {% layout 'hippie/page.liquid' %}
 
@@ -28,13 +29,7 @@ tags:
 {% block script %}
 {{ block.super -}}
 <script>
-	assetsLoaded = true;
-	logPerf('Assets loaded.', assetsLoaded);
-	// Page specific
-	// ------------------------------------------------------------------------------
 	composeMail('special', 'me', 'domain', 'tld', 'Me', 'HIPPIE')
 	composeMail('.general', 'name', 'domain', 'tld', '', '')
-
-	logPerf('Application ready... not.');
 </script>
 {% endblock %}
\ No newline at end of file
diff --git a/source/screens/demo/layouts.liquid b/source/screens/demo/layouts.liquid
index 6a41fe5..37da17e 100644
--- a/source/screens/demo/layouts.liquid
+++ b/source/screens/demo/layouts.liquid
@@ -2,6 +2,7 @@
 title: Layouts
 tags:
 - demoIndex
+order: 4
 ---
 {% layout 'hippie/page.liquid' %}
 
@@ -298,14 +299,13 @@ tags:
 </section>
 {% endblock %}
 
+{% block assets %}
+{{ block.super -}}
+<script src="/vendor/jq-sticky-anything.min.js"></script>
+{% endblock %}
 {% block script %}
 {{ block.super -}}
-<script src="/vendor/jq-sticky-anything.min.js" type="text/javascript"></script>
 <script>
-	assetsLoaded = true;
-	logPerf('Assets loaded.', assetsLoaded);
-	// Page specific
-	// ------------------------------------------------------------------------------
 	$(document).ready(function () {
 		// jq-sticky-anything
 		$('#js_demo_fix').stickThis({pushup: '#js_demo_stop'});
diff --git a/source/templates/hippie/full.liquid b/source/templates/hippie/full.liquid
index d445469..dbbe4ae 100644
--- a/source/templates/hippie/full.liquid
+++ b/source/templates/hippie/full.liquid
@@ -36,12 +36,13 @@
 {% render 'hippie/partials/log-log' with 'BODY start' as msg -%}
 {%- block body %}{% endblock -%}
 {% render 'hippie/partials/log-log' with 'BODY        :: Loading script assets...' as msg -%}
+{%- block assets %}{% endblock -%}
+{% render 'hippie/partials/log-assets', state: true -%}
+{% render 'hippie/partials/log-log', msg: 'BODY        :: Assets loaded, running page specific script...', arg: true -%}
 <script>
 	// {{ title }} script using full template
 </script>
 {%- block script %}{% endblock -%}
-{% render 'hippie/partials/log-assets', state: true -%}
-{% render 'hippie/partials/log-log', msg: 'BODY        :: Assets loaded, running page specific script...', arg: true -%}
 {% render 'hippie/partials/log-log' with 'BODY end    :: Page script might still be loading.' as msg -%}
 {% render 'hippie/partials/log-log' with 'Application ready... or is it?' as msg -%}
 </body>
diff --git a/source/templates/hippie/page.liquid b/source/templates/hippie/page.liquid
index dd6e6ed..5c8881f 100644
--- a/source/templates/hippie/page.liquid
+++ b/source/templates/hippie/page.liquid
@@ -34,11 +34,13 @@
 </div>
 {% endblock %}
 
-{% block script %}
+{% block assets %}
 <script src="/vendor/jquery.min.js"></script>
 <script src="/vendor/hippie-script.js"></script>
 <script src="/js/globals.js"></script>
 <script src="/js/app.js"></script>
+{% endblock %}
+{% block script %}
 <script>
 	// Setup global things for all screens
 	setup();
@@ -59,4 +61,4 @@
 		logPerf('EVENT       :: jQuery \'ready\' event fired.');
 	});
 </script>
-{% endblock %}
\ No newline at end of file
+{% endblock %}

From 92f3c4f81f8ea02e9cac241ca75de69693ac25df Mon Sep 17 00:00:00 2001
From: sthag <sthag@interaktionsweise.de>
Date: Tue, 10 Mar 2026 21:21:08 +0100
Subject: [PATCH 3/6] feat: Update ui screens

Separate script and assets block.
---
 source/screens/demo/examples/clock.liquid      | 4 +++-
 source/screens/demo/examples/game/intro.liquid | 7 +++++--
 source/screens/demo/examples/ui/drag.liquid    | 7 +++++--
 source/screens/demo/examples/ui/windows.liquid | 7 +++++--
 source/templates/hippie/app.liquid             | 6 ++++--
 source/templates/hippie/default.liquid         | 1 +
 6 files changed, 23 insertions(+), 9 deletions(-)

diff --git a/source/screens/demo/examples/clock.liquid b/source/screens/demo/examples/clock.liquid
index c55f9a9..b77d12b 100644
--- a/source/screens/demo/examples/clock.liquid
+++ b/source/screens/demo/examples/clock.liquid
@@ -17,11 +17,13 @@ tags:
 <main></main>
 {% endblock %}
 
-{% block script %}
+{% block assets %}
 <script src="/vendor/hippie-script.js"></script>
 <script src="/js/globals.js"></script>
 <script src="/js/app.js"></script>
+{% endblock %}
 
+{% block script %}
 <script>
 	class HippieClock {
 		constructor(element, date = new Date(), options = {}) {
diff --git a/source/screens/demo/examples/game/intro.liquid b/source/screens/demo/examples/game/intro.liquid
index 3c4710c..ac1de27 100644
--- a/source/screens/demo/examples/game/intro.liquid
+++ b/source/screens/demo/examples/game/intro.liquid
@@ -3,7 +3,6 @@ title: Intro
 tags:
 - game
 ---
-
 {% assign bodyClass = 'body_intro' -%}
 {% layout 'hippie/app.liquid' %}
 
@@ -46,9 +45,13 @@ tags:
 </div>
 {% endblock %}
 
-{%- block script %}
+{% block assets %}
 {{ block.super -}}
 <script src="/js/intro.js"></script>
+{% endblock %}
+
+{%- block script %}
+{{ block.super -}}
 <script>
 	//let intro = new Intro('Intro');
 	//intro.init();
diff --git a/source/screens/demo/examples/ui/drag.liquid b/source/screens/demo/examples/ui/drag.liquid
index 37d806e..1c3770f 100755
--- a/source/screens/demo/examples/ui/drag.liquid
+++ b/source/screens/demo/examples/ui/drag.liquid
@@ -21,9 +21,12 @@ tags:
 </div>
 {% endblock %}
 
-{%- block script %}
-<script src="/js/app.js"></script>
+{% block assets %}
+{{ block.super -}}
 <script src="/js/drag.js"></script>
+{% endblock %}
+
+{%- block script %}
 <script>
 	// Get the space element
 	const space = document.getElementById('space');
diff --git a/source/screens/demo/examples/ui/windows.liquid b/source/screens/demo/examples/ui/windows.liquid
index 8a9c65a..15d589b 100644
--- a/source/screens/demo/examples/ui/windows.liquid
+++ b/source/screens/demo/examples/ui/windows.liquid
@@ -49,10 +49,13 @@ tags:
 </div>
 {% endblock %}
 
+{% block assets %}
+{{ block.super -}}
+<script src="/js/windows.js"></script>
+{% endblock %}
+
 {%- block script %}
 {{ block.super -}}
-
-<script src="/js/windows.js"></script>
 <script>
 	console.log(HIPPIE.brand);
 	// Get the space element
diff --git a/source/templates/hippie/app.liquid b/source/templates/hippie/app.liquid
index 4118172..87db0cb 100644
--- a/source/templates/hippie/app.liquid
+++ b/source/templates/hippie/app.liquid
@@ -10,12 +10,14 @@
 <link href="/css/ui.css" media="all" rel="stylesheet"/>
 {% endblock %}
 
-{% block script %}
+{% block assets %}
 <script src="/vendor/jquery.min.js"></script>
 <script src="/vendor/hippie-script.js"></script>
 <script src="/js/globals.js"></script>
 <script src="/js/app.js"></script>
+{% endblock %}
 
+{% block script %}
 <script>
 	const frameHeader = document.querySelector('body > header.io');
 	const closeActionElements = document.querySelectorAll('[data-action=close]');
@@ -36,4 +38,4 @@
 		});
 	}
 </script>
-{% endblock %}
\ No newline at end of file
+{% endblock %}
diff --git a/source/templates/hippie/default.liquid b/source/templates/hippie/default.liquid
index b8cdbfd..0d6c050 100644
--- a/source/templates/hippie/default.liquid
+++ b/source/templates/hippie/default.liquid
@@ -28,6 +28,7 @@
 
 <body{{ bodyClassAttr }}>
 {%- block body %}{% endblock -%}
+{%- block assets %}{% endblock -%}
 <script>
 	// {{ title }} script using default template
 </script>

From 99b98635e74416afdd1d9754813393ab62f6a828 Mon Sep 17 00:00:00 2001
From: sthag <sthag@interaktionsweise.de>
Date: Tue, 10 Mar 2026 22:13:28 +0100
Subject: [PATCH 4/6] feat: Update songbook

- Change songbook from njk to liquid
- Add song partial
---
 .eleventy.js                                 |  2 +-
 source/screens/demo/examples/songbook.liquid | 39 +++++++++++++++
 source/screens/demo/examples/songbook.njk    | 52 --------------------
 source/templates/hippie/partials/song.liquid | 10 ++++
 4 files changed, 50 insertions(+), 53 deletions(-)
 create mode 100644 source/screens/demo/examples/songbook.liquid
 delete mode 100755 source/screens/demo/examples/songbook.njk
 create mode 100644 source/templates/hippie/partials/song.liquid

diff --git a/.eleventy.js b/.eleventy.js
index 152f256..48791f7 100644
--- a/.eleventy.js
+++ b/.eleventy.js
@@ -47,7 +47,7 @@ export default async function (eleventyConfig) {
 	});
 
 	eleventyConfig.addShortcode('link', function (target, text, attrId, attrClass) {
-		if (text === '') {
+		if (!text || text === '') {
 			text = target;
 		}
 
diff --git a/source/screens/demo/examples/songbook.liquid b/source/screens/demo/examples/songbook.liquid
new file mode 100644
index 0000000..5329c0a
--- /dev/null
+++ b/source/screens/demo/examples/songbook.liquid
@@ -0,0 +1,39 @@
+---
+title: Songbook
+tags:
+- demoExample
+---
+{% layout 'hippie/simple.liquid' %}
+
+{% block body %}
+<div class="sec_main_center">
+	<header class="header_txt">
+		<h1>Titel</h1>
+		<p>Jahr</p>
+	</header>
+	<nav role="doc-toc">
+		<h2>Inhaltsverzeichnis</h2>
+		<ul>
+			{%- for song in collections.song -%}
+				<li>
+					<a href="{{ song.page.url }}">{{ song.data.title }}</a>
+				</li>
+			{%- endfor -%}
+		</ul>
+	</nav>
+	<h2>Vorwort</h2>
+	<p>Liederbuch für
+		<em>Name</em>.</p>
+	<p>Gibt es gebunden und hier
+		{% link hippie.placeholders.domain %}.<br/>
+		Bestellungen bitte an
+		{% text hippie.placeholders.name %}
+		richten.</p>
+	<hr class="double dotted">
+	{%- for piece in collections.song -%}
+		{% render 'hippie/partials/song.liquid', index: forloop.index0, data: piece.data, content: piece.content %}
+	{%- endfor -%}
+	<hr/>
+	<address>{% text hippie.placeholders.name %}</address>
+</div>
+{% endblock %}
\ No newline at end of file
diff --git a/source/screens/demo/examples/songbook.njk b/source/screens/demo/examples/songbook.njk
deleted file mode 100755
index 78a9939..0000000
--- a/source/screens/demo/examples/songbook.njk
+++ /dev/null
@@ -1,52 +0,0 @@
----
-title: Songbook
-tags:
-  - demoExample
----
-{% set pageBase = "../" %}
-{% set pageId = page.fileSlug %}
-
-{% extends "demo/_default.njk" %}
-{% import "hippie/macros/_placeholder.njk" as ph %}
-{% import "hippie/macros/_song.njk" as song %}
-
-{% block title %}{{ title }}
-{% endblock %}
-
-{% block head %}
-	{{ super() }}
-{% endblock %}
-
-{% block body %}
-	<!-- {{ page.fileSlug }}.page -->
-	<div class="sec_main_center">
-		<header class="header_txt">
-			<h1>Titel</h1>
-			<p>Jahr</p>
-		</header>
-		<nav role="doc-toc">
-			<h2>Inhaltsverzeichnis</h2>
-			<ul>
-				{%- for song in collections.song -%}
-					<li>
-						<a href="{{ song.page.url }}">{{ song.data.title }}</a>
-					</li>
-				{%- endfor -%}
-			</ul>
-		</nav>
-		<h2>Vorwort</h2>
-		<p>Liederbuch für
-			<em>Name</em>.</p>
-		<p>Gibt es gebunden und hier
-			{{ ph.link() }}.<br/>
-			Bestellungen bitte an
-			{{ ph.name() }}
-			richten.</p>
-		<hr class="double dotted">
-		{%- for piece in collections.song -%}
-			{{ song.simple(loop.index0, piece.data, piece.content) }}
-		{%- endfor -%}
-		<hr/>
-		<address>{{ ph.name() }}</address>
-	</div>
-{% endblock %}
\ No newline at end of file
diff --git a/source/templates/hippie/partials/song.liquid b/source/templates/hippie/partials/song.liquid
new file mode 100644
index 0000000..534da59
--- /dev/null
+++ b/source/templates/hippie/partials/song.liquid
@@ -0,0 +1,10 @@
+<article class="songbook_song">
+	<header>
+		<h2>{{ data.title }}</h2>
+		<h6>{{ data.releaseDate }}</h6>
+		<p>{{ data.description }}</p>
+	</header>
+	{% comment %}<pre class="pre_code"><code>{{ content }}</code></pre>{% endcomment %}
+	{{ content }}
+	<footer>{{ index }}</footer>
+</article>
\ No newline at end of file

From 2091dc4f30b319314ec35277da46bf5e14df6b90 Mon Sep 17 00:00:00 2001
From: sthag <sthag@interaktionsweise.de>
Date: Tue, 10 Mar 2026 22:15:08 +0100
Subject: [PATCH 5/6] feat: Change mouse to pointer for windows

---
 source/code/hippie/app.js |  1 +
 source/code/windows.js    | 12 ++++++------
 2 files changed, 7 insertions(+), 6 deletions(-)

diff --git a/source/code/hippie/app.js b/source/code/hippie/app.js
index f0028a5..50efe38 100644
--- a/source/code/hippie/app.js
+++ b/source/code/hippie/app.js
@@ -341,6 +341,7 @@ class DateDisplay {
 	}
 }
 
+// TODO: Kompatibilität für Zeiger
 function checkButtonAndTarget(event, element, button = 0) {
 	return (
 		event.button === button &&
diff --git a/source/code/windows.js b/source/code/windows.js
index 8a115a9..01a3c7d 100644
--- a/source/code/windows.js
+++ b/source/code/windows.js
@@ -21,9 +21,9 @@ class HippieTaskBar {
 
 	// TODO: Ereignisse besser delegieren
 	init() {
-		this.element.addEventListener('mousedown', this.onMouseDown.bind(this));
-		document.addEventListener('mousemove', this.onMouseMove.bind(this));
-		document.addEventListener('mouseup', this.onMouseUp.bind(this));
+		this.element.addEventListener('pointerdown', this.onDown.bind(this));
+		document.addEventListener('pointermove', this.onMove.bind(this));
+		document.addEventListener('pointerup', this.onUp.bind(this));
 
 		const dateElement = document.createElement('span');
 
@@ -34,7 +34,7 @@ class HippieTaskBar {
 		this.setOptions(this.options.position);
 	}
 
-	onMouseDown(event) {
+	onDown(event) {
 		if (checkButtonAndTarget(event, this.element, 0)) {
 			console.debug('Drag mode enabled');
 
@@ -48,7 +48,7 @@ class HippieTaskBar {
 		event.preventDefault();
 	}
 
-	onMouseMove(event) {
+	onMove(event) {
 		if (this.isDragging) {
 			this.options.position = getClosestEdgeToMouse(event);
 			const borderRadius = '4px';
@@ -116,7 +116,7 @@ class HippieTaskBar {
 		}
 	}
 
-	onMouseUp() {
+	onUp() {
 		if (event.target === this.placeholder) {
 			console.debug('Drag mode disabled');
 

From a7431ec85d230300fc9d4582d2d5276b537906e8 Mon Sep 17 00:00:00 2001
From: sthag <sthag@interaktionsweise.de>
Date: Tue, 10 Mar 2026 22:33:00 +0100
Subject: [PATCH 6/6] feat: Update blog

- Change blog from njk to liquid
- Update content
---
 source/screens/demo/examples/blog.liquid     | 32 ++++++++++++
 source/screens/demo/examples/blog.njk        | 51 --------------------
 source/screens/demo/examples/blog/article.md |  2 +-
 3 files changed, 33 insertions(+), 52 deletions(-)
 create mode 100644 source/screens/demo/examples/blog.liquid
 delete mode 100644 source/screens/demo/examples/blog.njk

diff --git a/source/screens/demo/examples/blog.liquid b/source/screens/demo/examples/blog.liquid
new file mode 100644
index 0000000..59b9752
--- /dev/null
+++ b/source/screens/demo/examples/blog.liquid
@@ -0,0 +1,32 @@
+---
+title: Blog
+tags:
+- demoExample
+---
+{% layout 'hippie/simple.liquid' %}
+
+{% block body %}
+<div class="sec_main_center">
+	<header class="header_txt">
+		<h1>Blog</h1>
+	</header>
+	<nav role="doc-toc">
+		<h2>Inhaltsverzeichnis</h2>
+		<ul>
+			{%- for blog in collections.blog -%}
+				<li>
+					<a href="{{ blog.page.url }}">{{ blog.data.title }}</a>
+				</li>
+			{%- endfor -%}
+		</ul>
+	</nav>
+	<hr class="double dotted">
+	{%- for post in collections.article -%}
+		<article>
+			{{ post.content }}
+		</article>
+	{%- endfor -%}
+	<hr/>
+	<address>{% text hippie.placeholders.name %}</address>
+</div>
+{% endblock %}
\ No newline at end of file
diff --git a/source/screens/demo/examples/blog.njk b/source/screens/demo/examples/blog.njk
deleted file mode 100644
index 9573419..0000000
--- a/source/screens/demo/examples/blog.njk
+++ /dev/null
@@ -1,51 +0,0 @@
----
-title: Blog
-tags:
-  - demoExample
----
-{% set pageBase = "../" %}
-{% set pageId = page.fileSlug %}
-
-{% extends "demo/_default.njk" %}
-{% import "hippie/macros/_placeholder.njk" as ph %}
-{% import "hippie/macros/_song.njk" as song %}
-
-{% block title %}{{ title }}
-{% endblock %}
-
-{% block head %}
-	{{ super() }}
-{% endblock %}
-
-{% block body %}
-	<!-- {{ page.fileSlug }}.page -->
-	<div class="sec_main_center">
-		<header class="header_txt">
-			<h1>Blog</h1>
-		</header>
-		<nav role="doc-toc">
-			<h2>Inhaltsverzeichnis</h2>
-			<ul>
-				{%- for song in collections.song -%}
-					<li>
-						<a href="{{ song.page.url }}">{{ song.data.title }}</a>
-					</li>
-				{%- endfor -%}
-			</ul>
-		</nav>
-		<h2>Vorwort</h2>
-		<p>Liederbuch für
-			<em>Name</em>.</p>
-		<p>Gibt es gebunden und hier
-			{{ ph.link() }}.<br/>
-			Bestellungen bitte an
-			{{ ph.name() }}
-			richten.</p>
-		<hr class="double dotted">
-		{%- for post in collections.article -%}
-			{{ post.content }}
-		{%- endfor -%}
-		<hr/>
-		<address>{{ ph.name() }}</address>
-	</div>
-{% endblock %}
\ No newline at end of file
diff --git a/source/screens/demo/examples/blog/article.md b/source/screens/demo/examples/blog/article.md
index 0200c08..99b92e2 100644
--- a/source/screens/demo/examples/blog/article.md
+++ b/source/screens/demo/examples/blog/article.md
@@ -3,7 +3,7 @@ tags:
   - blog
   - article
 title: "Artikel"
-releaseDate: JJJJ
+publishDate: JJJJ
 description: Text
 ---
 # Titel