{#
SPDX-License-Identifier: GPL-3.0-or-later OR CC-BY-SA-4.0
Hydrilla&Haketilo reusable base page template.
This file is part of Hydrilla&Haketilo.
Copyright (C) 2022 Wojtek Kosior
Dual licensed under
* GNU General Public License v3.0 or later and
* Creative Commons Attribution Share Alike 4.0 International.
You can choose to use either of these licenses or both.
I, Wojtek Kosior, thereby promise not to sue for violation of this
file's licenses. Although I request that you do not make use of this
code in a proprietary work, I am not going to enforce this in court.
#}
{% macro button_row(buttons_data, common_fields={}) %}
{% for classes, text, extra_fields in buttons_data %}
{% if not loop.first %}
{% do classes.append('button-bordering-left') %}
{% endif %}
{% if not loop.last %}
{% do classes.append('button-bordering-right') %}
{% endif %}
{% if 'disabled-button' in classes %}
{% set disabled_attr = ' disabled=""' %}
{% else %}
{% set disabled_attr = '' %}
{% endif %}
{% endfor %}
{{ label_text }}
{% if caller is defined %}
{{ caller() }}
{% endif %}
{% endmacro %}
{%
macro form_field(
field_name,
required = true,
sep_after = true,
height = none,
initial_value = none
)
%}
{%
set attrs = {
'id': field_name + '_field',
'name': field_name,
'required': '' if required else none,
'rows': height
}
%}
{% if height is none %}
{% do attrs.update({'value': initial_value}) %}
{% else %}
{% set value = initial_value|default('', true) %}
{{ value }}
{% endif %}
{% if sep_after %}
{% endif %}
{% endmacro %}
{% macro verbatim() %}
{{ caller()|safe }}
{{ caller() }}
{% endmacro %}
{% macro doc_link(doc_url) %}
{% block style %}
body {
color: #444;
margin: 0;
}
#main {
max-width: 750px;
margin: auto;
padding: 0 5px;
}
a {
text-decoration: inherit;
color: inherit;
}
.has-colored-links a {
color: #557b8e;
}
.small-print {
font-size: 80%;
color: #555;
}
.error-note {
display: block;
border-left: 5px solid #a33;
padding: 10px;
background-color: #fcc;
}
#main > .error-note:first-child {
margin-top: 10px;
}
.block-with-bottom-margin, .section-label, .flex-row, aside, p {
display: block;
margin: 0 0 10px 0;
}
.section-label > span:first-child {
font-style: italic;
text-decoration: underline #ccc;
}
.flex-row {
display: flex;
padding: 0;
}
.flex-row > * {
flex: 1 1 0;
}
.flex-row > .flex-row {
margin: 0;
}
.button-row-separator {
background-color: #888;
flex: 0 0 2px;
}
div.horizontal-separator {
display: block;
background-color: #e3e3e3;
height: 1px;
margin: 0 0 10px 0;
}
textarea {
resize: none;
}
.green-button, .red-button, .blue-button {
border: none;
border-radius: 2px;
color: white;
text-align: center;
text-decoration: none;
display: block;
padding: 5px 10px;
-moz-user-select: none;
user-select: none;
cursor: pointer;
font: 400 0.9em sans-serif;
}
.green-button {
background-color: #4caf50;
}
.red-button {
background-color: #af504c;
}
.blue-button {
background-color: #504caf;
}
.disabled-button {
background-color: #aaa;
cursor: default;
}
.button-bordering-right {
border-radius: 2px 0 0 2px;
}
.button-bordering-left {
border-radius: 0 2px 2px 0;
}
.button-bordering-left.button-bordering-right {
border-radius: 0;
}
.doc-link {
display: inline-block;
width: 1.2em;
height: 1em;
}
.doc-link::after {
content: "?";
position:absolute;
display: inline-block;
width:1.2em;
height:1.2em;
line-height: 1.2em;
border: 2px solid #ffffff88;
border-radius: 1em;
transform: translate(1px, calc(-0.1em - 1px));
background-color: #4caf50;
color:white;
text-align: center;
font-style: normal;
font-family: initial;
font-size: 90%;
font-weight:bold;
}
.doc-link:hover::after {
color: #ffffffaa;
border-color: #4caf50;
}
code > pre {
overflow-x: auto;
background-color: #f0f0f0;
padding: 5px;
border: 1px solid #e3e3e3;
}
.bold {
font-weight: bold;
}
.hide {
display: none !important;
}
{% endblock style %}
{% endblock head %}
{% block body %}
{% block main required %}{% endblock %}
{% endblock body %}