<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <link rel="stylesheet" href="/_matrix/static/client/login/style.css">
        <title>{{server_name | e}} Login</title>
    </head>
    <body>
        <div id="container">
            <h1 id="title">{{server_name | e}} Login</h1>
            <div class="login_flow">
                <p>Choose one of the following identity providers:</p>
            <form>
                <input type="hidden" name="redirectUrl" value="{{redirect_url | e}}">
                <ul class="radiobuttons">
{% for p in providers %}
                    <li>
                        <input type="radio" name="idp" id="prov{{loop.index}}" value="{{p.idp_id}}">
                        <label for="prov{{loop.index}}">{{p.idp_name | e}}</label>
{% if p.idp_icon %}
                        <img src="{{p.idp_icon | mxc_to_http(32, 32)}}"/>
{% endif %}
                    </li>
{% endfor %}
                </ul>
                <input type="submit" class="button button--full-width" id="button-submit" value="Submit">
            </form>
            </div>
        </div>
    </body>
</html>
