feat: Change file structure

- Move return object to named export for 11ty config
- screens is now view
- 11ty data files moved to view/_data
- templates is now view/_includes
- Both are the default directories
- data is now used as intended, for user data
- Update index to reflect filenames and structure

source/view/demo/examples/ui/form.liquid

@@ -0,0 +1,56 @@
+---
+title: Form
+tags:
+- ui
+---
+{% assign bodyClass = 'body_frame' -%}
+{% layout 'hippie/app.liquid' %}
+
+{% block body %}
+{% render 'hippie/partials/frame-header.liquid' %}
+<header class="io">
+	<h1>Formulare</h1>
+	<button data-action="add">Hinzufügen</button>
+	<button data-action="change">Ändern</button>
+	<hr>
+</header>
+<form id="form" action="">
+	<div id="grid">
+		<div>a</div>
+		<div>b</div>
+		<div>c</div>
+	</div>
+</form>
+{% endblock %}
+
+{%- block script %}
+{{ block.super -}}
+<script>
+	const add = document.querySelector('[data-action=add]');
+	const change = document.querySelector('[data-action=change]');
+	const grid = document.getElementById('grid');
+
+	add.addEventListener('click', (e) => {
+		const item = document.createElement('div');
+
+		item.style.backgroundColor = '#f0f';
+		item.textContent = 'c'
+
+		grid.appendChild(item);
+	});
+
+	change.addEventListener('click', (e) => {
+		changeLayout(grid);
+	});
+
+	function changeLayout(grid) {
+		const currentTemplate = grid.style.gridTemplateColumns;
+
+		if (currentTemplate === 'repeat(4, 1fr)') {
+			grid.style.gridTemplateColumns = 'repeat(2, 1fr)';
+		} else {
+			grid.style.gridTemplateColumns = 'repeat(4, 1fr)';
+		}
+	}
+</script>
+{% endblock %}