{% if openid_auths | length > 0  %}
    <div class="mt-5 ml-5 text-violet-500 text-lg flex items-center">
        <svg class="mr-3" width="30" height="30" aria-hidden="true"><use href="#symbl-openid"/></svg>
        <div class="ml-3"> OpenID Sign in with </div>
    </div>
    <div class="mt-2 flex items-center justify-between">
    {% for item in openid_auths %}
       <button id="otp-signin-button" class="capitalize !bg-violet-600 !hover:bg-violet-200 text-white !hover:text-violet-600  py-2 px-4 rounded  focus:outline-none focus:shadow-inline accent-violet-500" onclick="on_openid('{{item}}')">
           {{ item }}
       </button>
    {% endfor %}
    </div>
{% endif %}