misuzu/templates/master.twig

100 lines
3.8 KiB
Twig

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
{% include '_layout/meta.twig' %}
<link href="{{ '/css/style.css'|asset_url }}" rel="stylesheet">
<link href="{{ '/css/libraries.css'|asset_url }}" rel="stylesheet">
{% if site_background_url is defined %}
<style>
:root {
--site-background-image: url('{{ site_background_url|raw }}');
}
</style>
{% endif %}
</head>
<body
class="main {{ use_legacy_style|default(false) ? 'main--legacy' : 'main--default' }}{% if current_user.user_background_settings is defined %} {{ current_user.user_background_settings|bg_settings('main--bg-%s')|join(' ') }}{% endif %}"
style="{% if global_accent_colour is defined %}{{ global_accent_colour|html_colour('--accent-colour') }}{% endif %}">
{% include '_layout/header.twig' %}
<div class="main__wrapper">
{% block content %}
<div class="container">
<div class="container__title">Hello!</div>
<div class="container__content">
This page has no content!
</div>
</div>
{% endblock %}
</div>
<footer class="footer">
{% autoescape false %}
<div class="footer__copyright">
{{ 'https://flash.moe'|html_link('Flashwave', 'footer__link') }} 2013-{{
''|date('Y') }} /
{{ ('https://github.com/flashwave/misuzu/tree/' ~ git_tag())|html_link(git_tag(), 'footer__link') }}
# {{ ('https://github.com/flashwave/misuzu/commit/' ~ git_commit_hash(true))|html_link(git_commit_hash(), 'footer__link') }}
{% if constant('MSZ_DEBUG') or current_user.user_id|default(0) == 1 %}
/ SQL Queries: {{ sql_query_count()|number_format }}
/ Took: {{ startup_time()|number_format(5) }} seconds
/ Render: {{ startup_time(constant('MSZ_TPL_RENDER'))|number_format(5) }} seconds
{% endif %}
</div>
{% endautoescape %}
</footer>
<script src="{{ '/js/libraries.js'|asset_url }}" charset="utf-8"></script>
<script>
window.addEventListener('load', () => {
timeago().render(document.querySelectorAll('time'));
hljs.initHighlighting();
});
// move this to an external JS/TS file eventually.
const containerClass = 'container',
containerHiddenClass = 'container--hidden';
function validateContainer(elem) {
return elem.classList.contains(containerClass);
}
function containerIsClosed(elem) {
return elem.classList.contains(containerHiddenClass);
}
function toggleContainer(id) {
const elem = document.getElementById(id);
if (!validateContainer(elem))
return;
if (containerIsClosed(elem))
openContainer(id);
else
closeContainer(id);
}
function openContainer(id) {
const elem = document.getElementById(id);
if (!validateContainer(elem) || !containerIsClosed(elem))
return;
elem.classList.remove(containerHiddenClass);
}
function closeContainer(id) {
const elem = document.getElementById(id);
if (!validateContainer(elem) || containerIsClosed(elem))
return;
elem.classList.add(containerHiddenClass);
}
</script>
</body>
</html>