customize style for authentication templates

Former-commit-id: a91806147f213ac3d7dec32ffd6d29207fd3b54d

ippisite/ippidb/templates/account/login.html

@@ -7,9 +7,9 @@
 
 {% block content %}
 
-<div class="d-flex justify-content-center">
+<div class="d-flex justify-content-center mt-2">
 
-    <div class="card" style="width: 18rem;">
+    <div class="card">
         <div class="card-header">
             <h1>{% trans "Sign In" %}</h1>
         </div>
@@ -21,16 +21,16 @@
         of your existing third party accounts. Or, <a href="{{ signup_url }}">sign up</a>
         for a {{ site_name }} account and sign in below:{% endblocktrans %}</p>
 
-            <div class="socialaccount_ballot">
+            <div class="socialaccount_ballot d-flex">
 
-              <ul class="socialaccount_providers">
+              <ul class="socialaccount_providers list-inline mx-auto justify-content-between">
                 {% include "socialaccount/snippets/provider_list.html" with process="login" %}
               </ul>
 
-              <div class="login-or">{% trans 'or' %}</div>
-
             </div>
 
+            <div class="login-or">{% trans 'or' %}</div>
+
             {% include "socialaccount/snippets/login_extra.html" %}
 
             {% else %}

ippisite/ippidb/templates/base.html

@@ -196,7 +196,7 @@
                         <li>Welcome {{ user.username }} !!! <a href="{% url 'logout' %}">logout</a></li>
                         {% else %}
                         <li><a href="{% provider_login_url 'github' %}"><i class="fab fa-github" title="Login with github"></i> Login with GitHub</a></li>
-                        <li><a href="{% provider_login_url 'orcid' %}"><i class="fab fa-orcid" title="Login with ORCID"></i> Login with ORCID</a></li>
+                        <li><a href="{% provider_login_url 'orcid' %}"><i class="ai ai-orcid" title="Login with ORCID"></i> Login with ORCID</a></li>
                         {% endif %}
                     </ul>
                 </div>

ippisite/ippidb/templates/socialaccount/snippets/login_extra.html

+{% load socialaccount %}
+
+{% providers_media_js %}

ippisite/ippidb/templates/socialaccount/snippets/provider_list.html

+{% load socialaccount %}
+
+{% get_providers as socialaccount_providers %}
+
+{% for provider in socialaccount_providers %}
+{% if provider.id == "openid" %}
+{% for brand in provider.get_brands %}
+<li class="list-inline-item">
+  <a title="{{brand.name}}" 
+     class="socialaccount_provider {{provider.id}} {{brand.id}}" 
+     href="{% provider_login_url provider.id openid=brand.openid_url process=process %}"
+     ><i class="fab fa-{{provider.id}}" title="Login with {{provider.id}}"></i>Login with {{brand.name}}</a>
+</li>
+{% endfor %}
+{% endif %}
+<li class="list-inline-item">
+  <a title="{{provider.name}}" class="socialaccount_provider {{provider.id}}" 
+     href="{% provider_login_url provider.id process=process scope=scope auth_params=auth_params %}"><i class="{% if  provider.id != 'orcid' %}fab fa-{% else %}ai ai-{% endif %}{{provider.id}}" title="Login with {{provider.id}}"></i> Login with {{provider.name}}</a>
+</li>
+{% endfor %}