feat: Replace ui drag screen with liquid template

- Recreate io macros as liquid partials
- Add app template based on default
- Drag screen uses app.liquid layout instead of _app_frame.njk

source/templates/hippie/app.liquid

@@ -0,0 +1,40 @@
+{% assign pageBase = "../../../" -%}
+{% assign pageId = page.fileSlug -%}
+{% assign pageClass = "html_ui" -%}
+{%- layout "hippie/default.liquid" %}
+
+{% block title %}{{ title }}{% endblock %}
+
+{% block links %}
+{{ block.super -}}
+<link href="/vendor/bootstrap-icons/font/bootstrap-icons.min.css" rel="stylesheet">
+<link href="{{ pageBase }}css/ui.css" media="all" rel="stylesheet"/>
+{% endblock %}
+
+{% block script %}
+{{ block.super -}}
+<script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>
+<script src="{{ pageBase }}js/variables.js"></script>
+<script src="{{ pageBase }}js/app.js"></script>
+
+<script>
+	const frameHeader = document.querySelector('body > header.io');
+	const closeActionElements = document.querySelectorAll('[data-action=close]');
+
+	if (frameHeader) {
+		console.log('frame header found', frameHeader);
+
+		frameHeader.addEventListener('click', (e) => {
+			if (e.target.dataset.action === 'close') {
+				console.debug('close', e.target);
+
+				history.back();
+
+				if (closeActionElements.length > 1) {
+					console.debug('other frames present', closeActionElements.length);
+				}
+			}
+		});
+	}
+</script>
+{% endblock %}