mirror of
https://github.com/haiwen/seahub.git
synced 2025-05-12 09:55:53 +00:00
Password reset (#5957)
* ['Password Reset'] redesigned the page * ['Password Reset done'] redesigned the page
This commit is contained in:
parent
f2a6316abf
commit
8f32b9c262
media/img
seahub
BIN
media/img/email.png
Normal file
BIN
media/img/email.png
Normal file
Binary file not shown.
After ![]() (image error) Size: 9.9 KiB |
@ -356,6 +356,8 @@ def password_reset(request, is_admin_site=False, template_name='registration/pas
|
||||
|
||||
if post_reset_redirect is None:
|
||||
post_reset_redirect = reverse('auth_password_reset_done')
|
||||
|
||||
login_bg_image_path = get_login_bg_image_path()
|
||||
if request.method == "POST":
|
||||
form = password_reset_form(request.POST)
|
||||
if form.is_valid():
|
||||
@ -374,6 +376,7 @@ def password_reset(request, is_admin_site=False, template_name='registration/pas
|
||||
messages.error(request, _('Failed to send email, please contact administrator.'))
|
||||
return render(request, template_name, {
|
||||
'form': form,
|
||||
'login_bg_image_path': login_bg_image_path,
|
||||
})
|
||||
else:
|
||||
return HttpResponseRedirect(post_reset_redirect)
|
||||
@ -381,10 +384,14 @@ def password_reset(request, is_admin_site=False, template_name='registration/pas
|
||||
form = password_reset_form()
|
||||
return render(request, template_name, {
|
||||
'form': form,
|
||||
'login_bg_image_path': login_bg_image_path,
|
||||
})
|
||||
|
||||
def password_reset_done(request, template_name='registration/password_reset_done.html'):
|
||||
return render(request, template_name)
|
||||
login_bg_image_path = get_login_bg_image_path()
|
||||
return render(request, template_name, {
|
||||
'login_bg_image_path': login_bg_image_path,
|
||||
})
|
||||
|
||||
# Doesn't need csrf_protect since no-one can guess the URL
|
||||
def password_reset_confirm(request, uidb36=None, token=None, template_name='registration/password_reset_confirm.html',
|
||||
|
@ -112,15 +112,6 @@ html, body, #wrapper { height:100%; }
|
||||
$('.login-panel-outer-container').prepend($($('#logo').html()).attr({'height': 40}).addClass('login-panel-logo'));
|
||||
$('.login-panel-bottom-container').append($('#lang').removeClass('fright').addClass('px-2'));
|
||||
|
||||
$('#toggle-show-password').click(function() {
|
||||
$(this).toggleClass('fa-eye-slash fa-eye');
|
||||
if ($(this).hasClass('fa-eye-slash')) {
|
||||
$('#password-input').attr('type', 'password');
|
||||
} else {
|
||||
$('#password-input').attr('type', 'text');
|
||||
}
|
||||
});
|
||||
|
||||
var $el = $('.login-panel-outer-container');
|
||||
var elHeight = $el.outerHeight();
|
||||
var wdHeight = $(window).height();
|
||||
@ -149,6 +140,15 @@ $('#lang-context').on('click', function() {
|
||||
|
||||
$('[name="login"]').trigger('focus');
|
||||
|
||||
$('#toggle-show-password').click(function() {
|
||||
$(this).toggleClass('fa-eye-slash fa-eye');
|
||||
if ($(this).hasClass('fa-eye-slash')) {
|
||||
$('#password-input').attr('type', 'password');
|
||||
} else {
|
||||
$('#password-input').attr('type', 'text');
|
||||
}
|
||||
});
|
||||
|
||||
function setCaptchaInputWidth() {
|
||||
$('#id_captcha_1').outerWidth($('.input').outerWidth() - $('.captcha').width() - $('#refresh-captcha').outerWidth(true) - 10);
|
||||
}
|
||||
|
@ -1,10 +1,49 @@
|
||||
{% extends "base.html" %}
|
||||
{% load i18n %}
|
||||
|
||||
{% block title %}{% trans "Password Reset" %}{% endblock %}
|
||||
{% block sub_title %}{% trans "Password Reset" %} - {% endblock %}
|
||||
{% block header_css_class %}hide{% endblock %}
|
||||
{% block extra_base_style %}
|
||||
<link rel="stylesheet" type="text/css" href="{{ MEDIA_URL }}css/seafile-ui.css" />
|
||||
{% endblock %}
|
||||
{% block extra_style %}
|
||||
<style type="text/css">
|
||||
html, body, #wrapper { height:100%; }
|
||||
#wrapper {
|
||||
background: url('{{ MEDIA_URL }}{{login_bg_image_path}}') center top no-repeat scroll;
|
||||
background-size: cover;
|
||||
padding-top:1px;
|
||||
}
|
||||
.login-panel-hd {
|
||||
margin-bottom: 34px;
|
||||
}
|
||||
#back-to-login {
|
||||
margin: 31px 0 41px;
|
||||
}
|
||||
</style>
|
||||
{% endblock %}
|
||||
|
||||
{% block main_content %}
|
||||
<div class="text-panel">
|
||||
<div class="login-panel-outer-container vh">
|
||||
<div class="login-panel text-center" id="log-in-panel">
|
||||
<h1 class="login-panel-hd">{% trans "Password Reset" %}</h1>
|
||||
<img src="{{ MEDIA_URL }}img/email.png" alt="" width="100" />
|
||||
<p>{% trans "We've sent a password reset email to your mailbox." %}</p>
|
||||
<a class="btn btn-primary" href="{{ SITE_ROOT }}accounts/login/" id="back-to-login">{% trans "Back to login page" %}</a>
|
||||
</div>
|
||||
</div>
|
||||
{% endblock %}
|
||||
|
||||
{% block extra_script %}
|
||||
<script type="text/javascript">
|
||||
$('.login-panel-outer-container').prepend($($('#logo').html()).attr({'height': 40}).addClass('login-panel-logo'));
|
||||
|
||||
var $el = $('.login-panel-outer-container');
|
||||
var elHeight = $el.outerHeight();
|
||||
var wdHeight = $(window).height();
|
||||
if (wdHeight > elHeight) {
|
||||
$el.css({'margin-top': (wdHeight - elHeight)/2});
|
||||
}
|
||||
$el.removeClass('vh');
|
||||
</script>
|
||||
{% endblock %}
|
||||
|
@ -1,22 +1,80 @@
|
||||
{% extends "base.html" %}
|
||||
{% load i18n %}
|
||||
|
||||
{% block title %}{% trans "Password Reset" %}{% endblock %}
|
||||
{% block sub_title %}{% trans "Password Reset" %} - {% endblock %}
|
||||
{% block header_css_class %}hide{% endblock %}
|
||||
{% block extra_base_style %}
|
||||
<link rel="stylesheet" type="text/css" href="{{ MEDIA_URL }}fontawesome/css/fontawesome-all.min.css" />
|
||||
<link rel="stylesheet" type="text/css" href="{{ MEDIA_URL }}css/seafile-ui.css" />
|
||||
{% endblock %}
|
||||
{% block extra_style %}
|
||||
<style type="text/css">
|
||||
html, body, #wrapper { height:100%; }
|
||||
#wrapper {
|
||||
background: url('{{ MEDIA_URL }}{{login_bg_image_path}}') center top no-repeat scroll;
|
||||
background-size: cover;
|
||||
padding-top:1px;
|
||||
}
|
||||
#lang {
|
||||
margin:0;
|
||||
}
|
||||
#lang-context {
|
||||
font-weight:normal;
|
||||
}
|
||||
#lang-context-selector {
|
||||
text-align:left;
|
||||
}
|
||||
#log-in-panel .input {
|
||||
width: 284px;
|
||||
}
|
||||
</style>
|
||||
{% endblock %}
|
||||
|
||||
{% block main_content %}
|
||||
<div class="new-narrow-panel">
|
||||
<h2 class="hd">{% trans "Password Reset" %}</h2>
|
||||
<form action="" method="post" class="con">{% csrf_token %}
|
||||
<label for="id_email">{% trans "Your email used in login: " %}</label>
|
||||
{{ form.email }}
|
||||
{{ form.email.errors }}
|
||||
<p class="tip">{% trans "We will send you an email to set new password" %}</p>
|
||||
<input type="submit" value="{% trans "Submit" %}" class="submit" />
|
||||
<div class="login-panel-outer-container vh">
|
||||
<div class="login-panel" id="log-in-panel">
|
||||
<h1 class="login-panel-hd">{% trans "Password Reset" %}</h1>
|
||||
<form action="" method="post" id="login-form">{% csrf_token %}
|
||||
<p>{% trans "We will send you an email to set new password" %}</p>
|
||||
<input type="email" name="email" maxlength="255" required="" id="id_email" class="input" placeholder="{% trans "Your email used in login" %}" />
|
||||
{{ form.email.errors }}
|
||||
<button type="submit" class="submit btn btn-primary btn-block h-auto mb-3">{% trans "Submit" %}</button>
|
||||
</form>
|
||||
<div class="login-panel-bottom-container d-flex justify-content-center" id="login-bottom">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endblock %}
|
||||
|
||||
{% block extra_script %}
|
||||
<script type="text/javascript">
|
||||
$('[name="email"]').addClass('input');
|
||||
$('.login-panel-outer-container').prepend($($('#logo').html()).attr({'height': 40}).addClass('login-panel-logo'));
|
||||
$('.login-panel-bottom-container').append($('#lang').removeClass('fright').addClass('px-2'));
|
||||
|
||||
var $el = $('.login-panel-outer-container');
|
||||
var elHeight = $el.outerHeight();
|
||||
var wdHeight = $(window).height();
|
||||
if (wdHeight > elHeight) {
|
||||
$el.css({'margin-top': (wdHeight - elHeight)/2});
|
||||
}
|
||||
$el.removeClass('vh');
|
||||
|
||||
$('#lang-context').on('click', function() {
|
||||
var langTop = $('#lang').offset().top;
|
||||
var langSelectorTop;
|
||||
var langSelectorHeight = $('#lang-context-selector .sf-popover-con').outerHeight();
|
||||
if (langSelectorHeight > langTop) {
|
||||
langSelectorTop = '-' + (langTop - 5) + 'px';
|
||||
} else {
|
||||
langSelectorTop = '-' + (langSelectorHeight + 5) + 'px';
|
||||
}
|
||||
$('#lang-context-selector').css({
|
||||
'top': langSelectorTop,
|
||||
'right': 0
|
||||
});
|
||||
$('#lang-context-selector .sf-popover-con').css({
|
||||
'max-height': $('#lang').offset().top - 10
|
||||
});
|
||||
});
|
||||
</script>
|
||||
{% endblock %}
|
||||
|
Loading…
Reference in New Issue
Block a user