{% load static %}
{% load sqrl %}

<link type="text/css" rel="stylesheet" href="{% static 'sqrl/dropin.css' %}"/>
{% if sqrl_session.sqrl_url %}
<div class="sqrl-parent">
    <form class="sqrl-form" method="get" action="{{ sqrl_session.sqrl_url }}">
        <div class="sqrl-wrap">
            SQRL Login
            <a href="{{ sqrl_session.sqrl_url }}">
                <div id="sqrl-qr" data-sqrl="{{ sqrl_session.sqrl_url }}"></div>
            </a>
            <a href="https://www.grc.com/sqrl/sqrl.htm">What is SQRL?</a>
        </div>
        
        <input type="hidden" name="nut" value="{{ sqrl_session.nut.nonce }}">
        <input type="hidden" name="next" value="{{ redir }}">
        <input type="submit" value="Authenticate using SQRL">
    </form>
</div>
{% else %}
<div class="sqrl-parent">
    <p><strong>You are not connected on a secure connection. For your safety, SQRL login is disabled. It is advised that you do not log into this website at all until you are connected via a HTTPS connection.</strong></p>
</div>
{% endif %}
<script>SQRL_NEXT="{{ redir }}"; SQRL_CHECK_URL="{% sqrl_status_url_script_tag sqrl_session %}"</script>
<script type="application/javascript" src="{% static 'sqrl/sqrl.js' %}"></script>