diff options
Diffstat (limited to 'src/koszko_org_website/templates/__koszko_base.html.jinja')
| -rw-r--r-- | src/koszko_org_website/templates/__koszko_base.html.jinja | 210 |
1 files changed, 210 insertions, 0 deletions
diff --git a/src/koszko_org_website/templates/__koszko_base.html.jinja b/src/koszko_org_website/templates/__koszko_base.html.jinja new file mode 100644 index 0000000..b7de249 --- /dev/null +++ b/src/koszko_org_website/templates/__koszko_base.html.jinja @@ -0,0 +1,210 @@ +{# +SPDX-License-Identifier: CC0-1.0 + +koszko.org website campaign pages template. + +Copyright (C) 2021,2022 Wojtek Kosior <koszko@koszko.org> +#} +{% set section_attrs = {'class': 'layout-item'} %} +{% set header_attrs = {'class': 'content-subhead'} %} + +{% extends "__base.html.jinja" %} + +{% macro gitlink() -%} + {%- for project_id in varargs -%} + {{ numberlink('https://git.koszko.org/' ~ project_id ~ '/') }} + {%- endfor -%} +{%- endmacro %} + +{% block external_css %} + {{ super() }} + + <link rel="stylesheet" href="/static/pure-main.css"> + <link rel="stylesheet" href="/static/pure-layouts.css"> +{% endblock %} + +{% block style %} + {{ super() }} + + .pure-menu-item a { + display: block; + } + + #no-fb { + position: relative; + } + + #no-fb img { + width: 150px; + height: auto; + position: absolute; + left: 100px; + top: -70px; + -webkit-backface-visibility: hidden; + } + + @media (max-width: 520px) { + #no-fb img { + width: 130px; + left: 90px; + top: -60px; + } + } + @media (max-width: 460px) { + #no-fb img { + width: 110px; + top: -50px; + } + } + @media (max-width: 410px) { + #no-fb img { + width: 100px; + left: 80px; + top: -40px; + } + } + @media (max-width: 380px) { + #no-fb img { + width: 70px; + left: 65px; + top: -30px; + } + } + + #main { + min-height: 100vh; + display: flex; + flex-direction: column; + } + + .header, .content { + width: 100%; + } + + .content { + flex-grow: 1; + } + + aside { + background: #1f8dd6; + margin: 10px 0; + padding: 3px 10px; + border-radius: 3px; + color: #fff; + } + + .layout-item:first-child { + margin-top: 0; + border-top: 0; + } + + .content .content-subhead { + margin-top: 0; + } + + dt { + float: left; + margin-right: .5em; + } + + dd { + display: inline; + } + + dl.indent-dl dt { + margin-left: -2em; + } + + dl.indent-dl { + margin-top: 0; + margin-left: 2em; + } + + footer > p { + max-width: 768px; + margin: auto; + } +{% endblock %} + +{% macro menu_item(link_url, text, active) %} + <li class="pure-menu-item"> + {% if active %} + {% set link_url = "#" %} + {% endif %} + {% set attrs = {'href': link_url, 'class': 'active' if active else none} %} + <a{{ attrs|xmlattr }}>{{ text }}</a> + </li> +{% endmacro %} + +{% block body %} + <input id="show-menu" type="checkbox"></input> + <label href="#menu" id="menuLink" class="menu-link" for="show-menu"> + <span></span> + </label> + <nav id="menu"> + <div class="pure-menu"> + <span class="pure-menu-heading"> + {{ _('koszko_base.menu.span:languages') }} + </span> + <ul class="pure-menu-list"> + {% for current_lang, text in [('en', 'English'), ('pl', 'Polski')] %} + {% set flask_endpoint = '.show_page_in_' ~ current_lang %} + {% set link_url = url_for(flask_endpoint, page_path=page_path) %} + {{ menu_item(link_url, text, lang_short == current_lang) }} + {% endfor %} + </ul> + <span class="pure-menu-heading"> + {{ _('koszko_base.menu.span:places') }} + </span> + <ul class="pure-menu-list"> + {% + for current_page, text in [ + ('koszko.html', _('koszko_base.menu.a:home')), + ('cv.html', _('koszko_base.menu.a:curriculum_vitae')), + ('', _('koszko_base.menu.a:campaign')) + ] + %} + {% set link_url = same_lang_url(current_page) %} + {{ menu_item(link_url, text, page_path == current_page) }} + {% endfor %} + </ul> + </div> + </nav> + + <div id="main"> + <div class="header"> + {% block header %} + <h1> + {% if page_path == 'koszko.html' %} + {% set url = '#' %} + {% else %} + {% set url = same_lang_url('koszko.html') %} + {% endif %} + <a href="{{ url }}"> + {{ _('koszko_base.h1:wojtek_kosior') }} + </a> + </h1> + <h2> + <a href="#"> + {% block subheading_text %} + {% endblock %} + </a> + </h2> + {% if include_not_facebookd|default(false) %} + <span id="no-fb"> + <a href="https://stallman.org/facebook.html" draggable="false"> + <img src="/static/no-facebook.svg" draggable="false"> + </a> + </span> + {% endif %} + {% endblock %} + </div> + <div class="content"> + {% block content %} + {% endblock %} + </div> + <footer class="footer center-text"> + {% include [dedicated_footer_path, lang_short ~ '/__footer.html.jinja'] %} + </footer> + </div> +{% endblock %} |