interaktionsweise/hippie
1
1
Fork 0
Code Issues Pull requests Releases 3 Activity Actions

feat: Add app frame template

Browse source 
- All frame pages use app frame template
- Add form page to frames and add header
This commit is contained in:
sthag 2025-06-23 22:08:31 +02:00
parent 0c37acf47f
commit e572f64259
6 changed files with 29 additions and 70 deletions
Download patch file Download diff file Expand all files Collapse all files

24
source/screens/demo/examples/ui/cli.njk
View file

@ -6,21 +6,7 @@ tags:
{% set pageId = page.fileSlug %}
{% set bodyClass = "body_cli" %}
{% extends "hippie/_app.njk" %}
{% import "hippie/macros/_io.njk" as io %}
{% block title %}{{ title }}
{% endblock %}
{% block links %}
{{ 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 head %}
{{ super() }}
{% endblock %}
{% extends "hippie/_app_frame.njk" %}
{% block body %}
<div id="cli">
@ -47,9 +33,11 @@ tags:
const textarea = document.getElementById('prompt');
document.body.addEventListener('click', () => {
textarea.focus();
});
document
.body
.addEventListener('click', () => {
textarea.focus();
});
textarea.addEventListener('input', () => {
resizeTextArea(textarea);

21
source/screens/demo/examples/ui/explorer.njk
View file

@ -4,23 +4,8 @@ tags:
- ui
---
{% set pageId = page.fileSlug %}
{% set bodyClass = "body_frame" %}
{% extends "hippie/_app.njk" %}
{% import "hippie/macros/_io.njk" as io %}
{% block title %}{{ title }}
{% endblock %}
{% block links %}
{{ 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 head %}
{{ super() }}
{% endblock %}
{% extends "hippie/_app_frame.njk" %}
{% block body %}
{{ io.frameHeader('title-bar') }}
@ -178,7 +163,3 @@ tags:
</nav>
</footer>
{% endblock %}
{% block script %}
{{ super() }}
{% endblock %}

14
source/screens/demo/examples/ui/form.njk
View file

@ -3,20 +3,10 @@ title: Form
tags:
- ui
---
{% extends "hippie/_app.njk" %}
{% block title %}{{ title }}
{% endblock %}
{% block links %}
<link href="{{ pageBase }}css/ui.css" media="all" rel="stylesheet"/>
{% endblock %}
{% block head %}
{{ super() }}
{% endblock %}
{% extends "hippie/_app_frame.njk" %}
{% block body %}
{{ io.frameHeader('title-bar') }}
<header class="io">
<h1>Formulare</h1>
<button data-action="add">Hinzufügen</button>

21
source/screens/demo/examples/ui/tui.njk
View file

@ -4,31 +4,14 @@ tags:
- ui
---
{% set pageId = page.fileSlug %}
{% set bodyClass = "body_frame" %}
{% extends "hippie/_app.njk" %}
{% import "hippie/macros/_io.njk" as io %}
{% extends "hippie/_app_frame.njk" %}
{% block title %}{{ title }}
{% endblock %}
{% block links %}
{{ 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 head %}
{{ super() }}
{% endblock %}
{% block body %}
{{ io.frameHeader('title-bar') }}
<main class="io">
</main>
<main class="io"></main>
{{ io.frameFooter('mode-bar') }}
{% endblock %}
{%- block script %}
{{ super() }}
{% endblock %}

2
source/templates/hippie/_app.njk
View file

@ -18,7 +18,7 @@
{% endblock %}
</head>
<body class="{{ bodyClass }}">
<body class="{{ bodyClass if bodyClass else 'body_frame' }}">
{% block body %}{% endblock %}
{% block script %}

17
source/templates/hippie/_app_frame.njk Executable file
View file

@ -0,0 +1,17 @@
<!-- frame.app.template -->
{% extends "hippie/_app.njk" %}
{% import "hippie/macros/_io.njk" as io %}
{% block head %}
{{ super() }}
{% endblock %}
{% block links %}
{{ 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 %}
{{ super() }}
{% endblock %}