From 2ad0889025599bca772c5921c404d7ad66616a8c Mon Sep 17 00:00:00 2001 From: Wojtek Kosior Date: Sat, 29 Oct 2022 12:28:26 +0200 Subject: make common Jinja templates repo usable as a Python package module --- templates/base.html.jinja | 305 ++++++++++++++++++++++ templates/import/checkbox_tricks.html.jinja | 42 +++ templates/include/checkbox_tricks_style.css.jinja | 45 ++++ templates/include/item_list_style.css.jinja | 57 ++++ 4 files changed, 449 insertions(+) create mode 100644 templates/base.html.jinja create mode 100644 templates/import/checkbox_tricks.html.jinja create mode 100644 templates/include/checkbox_tricks_style.css.jinja create mode 100644 templates/include/item_list_style.css.jinja (limited to 'templates') diff --git a/templates/base.html.jinja b/templates/base.html.jinja new file mode 100644 index 0000000..c4d288b --- /dev/null +++ b/templates/base.html.jinja @@ -0,0 +1,305 @@ +{# +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 %} + +
+ {% for name, value in extra_fields.items() %} + + {% endfor %} + {% for name, value in common_fields.items() %} + + {% endfor %} + + +
+ {% endfor %} +
+{% endmacro %} + +{% macro error_note(note_text) %} + +{% endmacro %} + +{% macro label(label_text, label_name=none) %} + {% set for_attr = label_name and (label_name + "_field") %} + +{% 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 }}
 +{% endmacro %} + +{% macro unordered_list() %} + +{% endmacro %} + +{% macro list_entry() %} +
  • + {{ caller() }} +
    • +{% endmacro %} + +{% macro doc_link(doc_url) %} + +{% endmacro %} + + + + {% block head %} + {% if style_nonce is defined %} + {% set style_attrs = {'nonce': style_nonce} %} + {% endif %} + + {% 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 %} + + diff --git a/templates/import/checkbox_tricks.html.jinja b/templates/import/checkbox_tricks.html.jinja new file mode 100644 index 0000000..4ad9ca1 --- /dev/null +++ b/templates/import/checkbox_tricks.html.jinja @@ -0,0 +1,42 @@ +{# +SPDX-License-Identifier: GPL-3.0-or-later OR CC-BY-SA-4.0 + +Proxy web UI reusable macros for checkbox-based dynamically displayed elements. + +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 hider_id(name) -%} + {{ name }}_chbx +{%- endmacro %} + +{% macro sibling_hider_but(button_text, name, initial_show=false) %} + {% set attrs = {'type': 'checkbox', 'class': 'chbx-tricks-show-hide'} %} + {% do attrs.update({'id': hider_id(name)}) %} + {% do attrs.update({'checked': none if initial_show else ''}) %} + + +{% endmacro %} + +{% macro sibling_hider_radio(name, radio_id, initial_show=false) %} + {% set attrs = {'type': 'radio', 'class': 'chbx-tricks-show'} %} + {% do attrs.update({'name': name, 'id': radio_id}) %} + {% do attrs.update({'checked': '' if initial_show else none}) %} + +{% endmacro %} diff --git a/templates/include/checkbox_tricks_style.css.jinja b/templates/include/checkbox_tricks_style.css.jinja new file mode 100644 index 0000000..a47a438 --- /dev/null +++ b/templates/include/checkbox_tricks_style.css.jinja @@ -0,0 +1,45 @@ +{# +SPDX-License-Identifier: GPL-3.0-or-later OR CC-BY-SA-4.0 + +Proxy web UI reusable stylesheet for checkbox-based dynamically displayed +elements. + +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. +#} + +input.chbx-tricks-show-hide, input.chbx-tricks-hide-show { + display: none !important; +} + +input.chbx-tricks-show-hide:checked+*+*, +input.chbx-tricks-hide-show:not(:checked)+*+* { + display: none !important; +} + +input.chbx-tricks-hide-show:checked+*, +input.chbx-tricks-show-hide:not(:checked)+* { + display: none !important; +} + + +input.chbx-tricks-show, input.chbx-tricks-hide { + display: none !important; +} + +input.chbx-tricks-hide:checked+*, +input.chbx-tricks-show:not(:checked)+* { + display: none !important; +} diff --git a/templates/include/item_list_style.css.jinja b/templates/include/item_list_style.css.jinja new file mode 100644 index 0000000..66fcf10 --- /dev/null +++ b/templates/include/item_list_style.css.jinja @@ -0,0 +1,57 @@ +{# +SPDX-License-Identifier: GPL-3.0-or-later OR CC-BY-SA-4.0 + +Proxy web UI reusable stylesheet for lists. + +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. +#} +ul.item-list { + padding: 0; +} + +ul.item-list > li { + list-style-type: none; + max-width: 100%; + white-space: nowrap; + margin: 0; +} + +ul.item-list > li > :only-child { + display: block; + padding: 5px; + overflow-x: auto; + border-bottom: 2px solid #999; +} + +ul.item-list > li.entry-line-dashed > :only-child { + border-bottom-style: dashed +} + +ul.item-list > li.entry-line-green > :only-child { + border-color: #4caf50; +} + +ul.item-list > li.entry-line-blue > :only-child { + border-color: #504caf; +} + +ul.item-list > li.entry-line-red > :only-child { + border-color: #af504c; +} + +ul.item-list > li.invisible-entry-line > :only-child { + border-color: #fff; +} -- cgit v1.2.3