Skip to content
Snippets Groups Projects
base.html 15 KiB
Newer Older
  • Learn to ignore specific revisions
  • Todd Dembrey's avatar
    Todd Dembrey committed
    {% load static wagtailuserbar wagtailcore_tags wagtailimages_tags navigation_tags util_tags %}<!doctype html>
    
    <html class="no-js" lang="en">
    
    Todd Dembrey's avatar
    Todd Dembrey committed
        <head>
            {# TODO fallbacks if page is not defined e.g. for 404 page #}
            <meta charset="utf-8" />
            <title>{% block title_prefix %}{{ TITLE_PREFIX }}{% endblock %}{% block title %}{% if page.seo_title %}{{ page.seo_title }}{% else %}{{ page.title }}{% endif %}{% endblock %}{% block title_suffix %}{{ TITLE_SUFFIX }}{% endblock %}</title>
            <meta name="description" content="{% if page.search_description %}{{ page.search_description }}{% else %}{{ page.listing_summary }}{% endif %}" />
            <meta name="viewport" content="width=device-width, initial-scale=1" />
    
            <!-- favicons -->
            {% comment %}
                Generate favicons by http://realfavicongenerator.net using the following path: settings.STATIC_URL + img/favicons.
                Then favicon.ico should be copied to a directory called "public" in the application root and puppet does some magic to serve it up at the site root.
            {% endcomment %}
    
    Chris Lawton's avatar
    Chris Lawton committed
            <link rel="icon" sizes="144x144" href="{% static 'images/favicons/android-chrome-144.png' %}">
            <link rel="icon" type="image/png" sizes="16x16" href="{% static 'images/favicons/favicon-16.png' %}">
            <link rel="icon" type="image/png" sizes="32x32" href="{% static 'images/favicons/favicon-32.png' %}">
            <link rel="apple-touch-icon" sizes="76x76" href="{% static 'images/favicons/apple-icon-76.png' %}">
            <link rel="apple-touch-icon" sizes="120x120" href="{% static 'images/favicons/apple-icon-120.png' %}">
            <link rel="apple-touch-icon" sizes="152x152" href="{% static 'images/favicons/apple-icon-152.png' %}">
            <link rel="apple-touch-icon" sizes="180x180" href="{% static 'images/favicons/apple-icon-180.png' %}">
    
            <link rel="manifest" href="{% static 'images/favicons/site.webmanifest.json' %}">
    
    Chris Lawton's avatar
    Chris Lawton committed
            <meta name="msapplication-TileColor" content="#da532c">
            <meta name="msapplication-TileImage" content="{% static 'images/favicons/mstile-150.png' %}">
            <meta name="theme-color" content="#ffffff">
            <link rel="mask-icon" href="{% static 'images/favicons/safari-pinned-tab.svg' %}" color="#5bbad5">
    
    Todd Dembrey's avatar
    Todd Dembrey committed
    
            <!-- Twitter summary card - see https://dev.twitter.com/cards/types/summary -->
            <!--  and https://dev.twitter.com/cards/getting-started -->
            <meta name="twitter:card" content="summary" />
            <meta name="twitter:site" content="@{{ settings.utils.SocialMediaSettings.twitter_handle }}" />
            <meta name="twitter:title" content="{{ page.title }}" />
            <meta name="twitter:description" content="{{ page|social_text:request.site }}">
            {% if page.social_image  %}
                {% image page.social_image width-320 as social_img %}
                <meta name="twitter:image" content="{{ request.site.root_url }}{{ social_img.url }}">
            {% else %}
                <!-- Add a default image to use for social sharing here in case one is not provided on the page. -->
            {% endif %}
    
            <!--facebook opengraph tags-->
            <meta property="fb:app_id" content="{{ settings.utils.SocialMediaSettings.facebook_app_id }}" />
            <meta property="og:type" content="website" />
            <meta property="og:url" content="{{ page.url }}" />
            <meta property="og:title" content="{{ page.title }}" />
            {% if page.social_image %}
                <meta property="og:image" content="http://{{ request.site.hostname }}{{ social_img.url }}" />
            {% else %}
                <!-- Add a default image to use for social sharing here in case one is not provided on the page. -->
            {% endif %}
            <meta property="og:description" content="{{ page|social_text:request.site }}" />
            <meta property="og:site_name" content="{{ settings.utils.SocialMediaSettings.site_name }}" />
    
    
            <link rel="stylesheet" type="text/css" href="{% static 'css/public/main.css' %}">
    
    Todd Dembrey's avatar
    Todd Dembrey committed
    
            {% block extra_css %}{% endblock %}
    
    
            <script type="text/javascript" src="{% static 'js/main.js' %}"></script>
    
    Todd Dembrey's avatar
    Todd Dembrey committed
        </head>
    
        <body class="{% block body_class %}template-{{ page.get_verbose_name|slugify }}{% endblock %}">
    
    
            {% include "includes/sprites.html" %}
    
    
    Todd Dembrey's avatar
    Todd Dembrey committed
            {% wagtailuserbar %}
    
    
            {% include 'includes/messages.html' %}
    
    
                {% image page.header_image fill-2560x410 as header_image %}
    
                <header class="header header--standard {% if page.header_image %}header--has-bg-image{% endif %} {% block header_modifier %}{% endblock %}" {% if page.header_image %}style="background-image:url('{{ header_image.url }}')"{% endif %}>
    
                    {% block apply_button %}
                        {% include "includes/apply_button.html" %}
                    {% endblock %}
    
    Todd Dembrey's avatar
    Todd Dembrey committed
    
    
                    <div class="header__inner wrapper wrapper--large">
                        <a href="{% slugurl 'home' %}" aria-label="Home link">
                            <svg class="header__logo header__logo--desktop header__logo--desktop-light"><use xlink:href="#logo-desktop"></use></svg>
                            <svg class="header__logo header__logo--desktop header__logo--desktop-dark"><use xlink:href="#logo-desktop--dark"></use></svg>
                            <svg class="header__logo header__logo--mobile"><use xlink:href="#logo-mobile"></use></svg>
                        </a>
    
                        <div class="header__inner header__inner--mobile-buttons">
                            <button class="button js-search-toggle" aria-haspopup="true">
                                <svg class="header__icon header__icon--open-search header__icon--open-search-menu-closed icon icon--mobile-menu"><use xlink:href="#magnifying-glass"></use></svg>
                                <svg class="header__icon header__icon--close-search header__icon--close-search-menu-closed icon icon--mobile-menu"><use xlink:href="#cross"></use></svg>
                            </button>
                            <button class="button button--left-space js-mobile-menu-toggle" aria-haspopup="true">
                                <svg class="icon icon--mobile-menu"><use xlink:href="#mobile-menu-toggle"></use></svg>
                            </button>
                        </div>
    
    Todd Dembrey's avatar
    Todd Dembrey committed
    
    
                        <section class="header__menus header__menus--desktop">
                            {% primarynav %}
    
                            <button class="button button--contains-icons button--left-space js-search-toggle" aria-haspopup="true" aria-label="Toggle desktop search">
                                <svg class="header__icon header__icon--open-search icon"><use xlink:href="#magnifying-glass"></use></svg>
                                <svg class="header__icon header__icon--close-search icon"><use xlink:href="#cross"></use></svg>
                            </button>
                        </section>
    
                        <section class="header__menus header__menus--mobile">
                            <div class="header__inner header__inner--menu-open">
                                <a href="{% slugurl 'home' %}" aria-label="Home link">
                                    <svg class="header__logo header__logo--mobile"><use xlink:href="#logo-mobile"></use></svg>
                                </a>
                                <div class="header__inner header__inner--mobile-buttons">
                                    <button class="button js-mobile-search-toggle" aria-haspopup="true" aria-label="Toggle mobile search">
                                        <svg class="header__icon header__icon--open-search icon icon--mobile-menu"><use xlink:href="#magnifying-glass"></use></svg>
                                    </button>
                                    <button class="button button--left-space js-mobile-menu-close">
                                        <svg class="header__icon header__icon--cross icon icon--mobile-menu"><use xlink:href="#cross"></use></svg>
                                    </button>
                                </div>
    
                            {% primarynav %}
                        </section>
    
                        <div class="header__button-container">
                            <a href="{% url 'users:login' %}" class="button button--transparent button--contains-icons">
                                <svg class="icon icon--person"><use xlink:href="#person-icon"></use></svg>
                                My OTF
                            </a>
                            <div class="button button--google-translate" id="google_translate_element"></div>
    
                    <div class="header__search">
                        <form action="{% url 'search' %}" method="get" role="search" class="form form--header-search-desktop">
                            <button class="button" type="submit" aria-label="Search">
                                <svg class="icon icon--magnifying-glass icon--search"><use xlink:href="#magnifying-glass"></use></svg>
                            </button>
                            <input class="input input--transparent input--secondary" type="text" placeholder="Search…" name="query"{% if search_query %} value="{{ search_query }}{% endif %}" aria-label="Search input">
                        </form>
    
                    </div>
    
    
                    <div class="wrapper wrapper--small wrapper--page-title">
                        {% block breadcrumbs %}
                            {% include "navigation/breadcrumbs.html" %}
                        {% endblock %}
                        <h1 class="header__title">{% block page_title %}{{ page.title }}{% endblock %}</h1>
                    </div>
                    <svg class="header__icon header__icon--pixels header__icon--pixels-left"><use xlink:href="#hero-standard-left-pixels"></use></svg>
                    <svg class="header__icon header__icon--pixels header__icon--pixels-right"><use xlink:href="#hero-standard-right-pixels"></use></svg>
                </header>
            {% endblock %}
    
    Todd Dembrey's avatar
    Todd Dembrey committed
    
    
            <main class="wrapper wrapper--large wrapper--main {% block main_class %}{% endblock %}">
    
    Todd Dembrey's avatar
    Todd Dembrey committed
                {% block content %}{% endblock %}
            </main>
    
    
                <div class="grid grid--two wrapper wrapper--large">
                    <div class="footer__inner">
                        <h4>Get the latest internet freedom news</h4>
                        <form class="form">
                            <div>
                                <div class="mailchimp-signup-subscribe-form-description"></div>
                                <div id="mailchimp-newsletter-32632431e3-mergefields" class="mailchimp-newsletter-mergefields">
                                    <div class="form-item form-type-textfield form-item-mergevars-EMAIL">
                                        <label for="edit-mergevars-email">Email Address <span class="form-required" title="This field is required.">*</span></label>
    
                                        <input type="text" id="edit-mergevars-email" name="mergevars[EMAIL]" value="" size="25" maxlength="128" class="form-text required input--secondary">
    
                                    </div>
    
                                    <div class="form-item form-type-textfield form-item-mergevars-FNAME">
                                        <label for="edit-mergevars-fname">First Name </label>
    
                                        <input type="text" id="edit-mergevars-fname" name="mergevars[FNAME]" value="" size="25" maxlength="128" class="form-text input--secondary">
    
                                    </div>
    
                                    <div class="form-item form-type-textfield form-item-mergevars-LNAME">
                                        <label for="edit-mergevars-lname">Last Name </label>
    
                                        <input type="text" id="edit-mergevars-lname" name="mergevars[LNAME]" value="" size="25" maxlength="128" class="form-text input--secondary">
    
                                    </div>
    
                                </div>
                                <input type="hidden" name="form_build_id" value="form-2Dy9x5istHLUmufjcHabtyuZ_niL-RlfSoHBIq39hpI">
                                <input type="hidden" name="form_id" value="mailchimp_signup_subscribe_block_otf_newsletter_form">
                                <div class="form-actions form-wrapper" id="edit-actions--3">
                                    <input type="submit" id="edit-submit--3" name="op" value="Sign up" class="form-submit link link--button-transparent link--footer-signup">
                                </div>
                            </div>
                        </form>
                    </div>
    
                    <div class="footer__inner">
                        <div class="footer__social-links">
    
                            {% if settings.utils.SocialMediaSettings.twitter_handle %}
                                <a href="https://twitter.com/{{ settings.utils.SocialMediaSettings.twitter_handle }}">
                                    <svg class="icon icon--footer-social"><use xlink:href="#twitter"></use></svg>
    
                                    <h4 class="heading heading--no-margin">@OpenTechFund</h4>
    
                        </div>
    
                            <p>2025 M Street NW, Suite 300</br>
                            Washington, DC 20036 USA</p>
    
                            <p>
                                <a href="mailto:hello@opentech.fund">hello@opentech.fund</a></br>
                                <a href="mailto:press@opentech.fund">press@opentech.fund</a></br>
    
                                <span>PGP: <a href="https://keybase.io/opentechfund/pgp_keys.asc?fingerprint=67acddcfb909468536ddbc03f7663861965a90d2">67AC DDCF B909 4685 36DD BC03 F766 3861 965A 90D2</a></span>
    
                            <p><a class="link link--underlined" href="/tos">Terms of Use</a></p>
    
    
                            <p>Test the OTF website for censorship</p>
    
    
                            <a class="link link--button link--button-transparent" href="https://run.ooni.io/nettest?tn=web_connectivity&ta=%7B%22urls%22%3A%5B%22https%3A%2F%2Fwww.opentech.fund%2F%22%5D%7D&mv=1.2.0">Run OONI!</a>
    
    
                            <div class="footer__credits">
    
                                <a href="https://www.bbg.gov/" aria-label="Link to the Broadcasting Board of Governors website">
    
                                    <svg class="icon icon--footer-credit"><use xlink:href="#bbg-logo"></use></svg>
    
                                <a href="http://www.rfa.org/english/" aria-label="Link to the Radio Free Asia website">
    
                                    <img src="{% static 'images/radio-free-asia-logo.svg' %}" alt="logo fo radio free asia">
                                </a>
                            </div>
    
    Todd Dembrey's avatar
    Todd Dembrey committed
                </div>
    
    Todd Dembrey's avatar
    Todd Dembrey committed
            </footer>
    
    
            <script type="text/javascript" src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>
            <script type="text/javascript">
                function googleTranslateElementInit() {
                  new google.translate.TranslateElement({pageLanguage: 'en', layout: google.translate.TranslateElement.InlineLayout.SIMPLE}, 'google_translate_element');
                }
            </script>
    
    Todd Dembrey's avatar
    Todd Dembrey committed
            {% block extra_js %}{% endblock %}
        </body>
    </html>