feat: add social options to login design

This commit is contained in:
Shivam Mishra 2020-09-30 13:29:16 +05:30
parent 816bd39383
commit 611bb79c4f
2 changed files with 35 additions and 19 deletions

View file

@ -20,9 +20,24 @@
.sign-up-message {
margin-top: var(--margin-md);
> * {
color: var(--text-light);
color: var(--text-light);
font-size: var(--text-sm);
a {
font-size: var(--text-sm);
color: var(--primary);
}
}
.social-logins {
margin: var(--margin-md) 0;
.social-login-buttons {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
grid-gap: var(--padding-sm);
}
.btn-social {
box-shadow: none;
}
}
}

View file

@ -63,28 +63,29 @@
{{ _("Login with LDAP") }}</button>
{% endif %}
<div class="social-logins text-center">
{%- if social_login -%}
<p class="text-muted small">{{ _("or") }}</p>
<div class="social-login-buttons">
{% for provider in provider_logins %}
<a href="{{ provider.auth_url }}"
class="btn btn-secondary btn-sm btn-social btn-{{ provider.name }}">
{{ provider.icon }} {{ provider.provider_name }}</a>
{% endfor %}
</div>
{%- endif -%}
</div>
{%- if not disable_signup -%}
<p class="text-center sign-up-message">
<a href="#signup">{{ _("Don't have an account? Sign up") }}</a>
</p>
<div class="text-center sign-up-message">
{{ _("Don't have an account?") }}
<a href="#signup">{{ _("Sign up") }}</a>
</div>
{%- endif -%}
</div>
</form>
</div>
<div class='form-footer'>
<div class='social-logins'>
{%- if social_login -%}
<h6>{{ _("Or login with") }}</h6>
<p class="text-center">
{% for provider in provider_logins %}
<a href="{{ provider.auth_url }}" class="btn btn-default btn-sm btn-social btn-{{ provider.name }}">
{{ provider.icon }} {{ provider.provider_name }}</a>
{% endfor %}
</p>
{%- endif -%}
</div>
</div>
</section>
<section class='for-signup {{ "signup-disabled" if disable_signup else "" }}'>
<div class="login-content page-card" style="margin-top: 20px;">