feat: Consolidate body navigation

- Update html spec in components page
- Add form components
- Add JS for components which is not globally available
- Move body navigation to main template
- Reformat main template
This commit is contained in:
sthag 2025-06-18 19:31:37 +02:00
parent 8f15664d57
commit 4fcd7742a8
6 changed files with 167 additions and 96 deletions

View file

@ -3,53 +3,67 @@
<!DOCTYPE html>
<html lang="de" class="{{ pageClass }}" id="{{ pageId }}">
<head>
<meta charset="utf-8">
<head>
<meta charset="utf-8">
{% block head %}
<title>{{ hippie.titlePrefix }}
{%- block title %}{% endblock %}{{ hippie.titlePostfix }}</title>
{% block head %}
<title>{{ hippie.titlePrefix }}
{%- block title %}{% endblock %}{{ hippie.titlePostfix }}</title>
{% block meta %}
{% include "hippie/partials/_head_meta.njk" %}
{% endblock %}
{% block meta %}
{% include "hippie/partials/_head_meta.njk" %}
{% endblock %}
{% include "hippie/partials/_head_script.njk" %}
{{ log.debug(hippie.debugMode, true) }}
{{ log.start() }}
{% include "hippie/partials/_head_script.njk" %}
{{ log.debug(hippie.debugMode, true) }}
{{ log.start() }}
{% block links %}
{% include "hippie/partials/_head_links.njk" %}
{% endblock %}
{% block links %}
{% include "hippie/partials/_head_links.njk" %}
{% endblock %}
{{ log.log('HEAD end :: Links parsed, starting to load.') }}
{% endblock %}
</head>
{{ log.log('HEAD end :: Links parsed, starting to load.') }}
{% endblock %}
</head>
<body class="{{ bodyClass }}">
{{ log.log('BODY start') }}
{% include "hippie/partials/_body_hover.njk" %}
<div id="root">
{% include "hippie/partials/_header.njk" %}
<body class="{{ bodyClass }}">
{{ log.log('BODY start') }}
{% include "hippie/partials/_body_hover.njk" %}
{% include "hippie/partials/_body_nav.njk" %}
<div id="root">
{% include "hippie/partials/_header.njk" %}
<main class="main_site">
{% block main %}{% endblock %}
</main>
<main class="main_site">
{% block main %}{% endblock %}
</main>
{% include "hippie/partials/_footer.njk" %}
</div>
{% include "hippie/partials/_footer.njk" %}
</div>
{% block script %}
{{ log.log('BODY :: Loading script assets...') }}
{# <script src="{{ pageBase }}js/{{hippie.jsFile}}.min.js" type="text/javascript"></script> #}
<!-- build:js js/main.concat.min.js -->
{# // TODO: Remove dependecy to jQuery; at least maek it optional #}
<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/functions.js"></script>
<script src="{{ pageBase }}js/global.js"></script>
{% endblock %}
{% block script %}
{{ log.log('BODY :: Loading script assets...') }}
{# <script src="{{ pageBase }}js/{{hippie.jsFile}}.min.js" type="text/javascript"></script> #}
<!-- build:js js/main.concat.min.js -->
{# // TODO: Remove dependecy to jQuery; at least maek it optional #}
<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/functions.js"></script>
<script src="{{ pageBase }}js/global.js"></script>
<script>
// Create instances of objects made by contructor functions
let scrollUi = new HippieScroll($('.js_scrolltop'), $('.js_scrolldown'));
let helpUi = new HippieMeta($('.js_showmeta'), $('.js_pop'));
{{ log.log('BODY end :: Page script might still be loading.') }}
</body>
document.addEventListener('scroll', () => {
scrollUi.check();
});
$(document).ready(function () {
logPerf('EVENT :: jQuery \'ready\' event fired.');
});
</script>
{% endblock %}
{{ log.log('BODY end :: Page script might still be loading.') }}
</body>
</html>