1
0
mirror of https://github.com/haiwen/seahub.git synced 2025-05-12 09:55:53 +00:00

Password reset ()

* ['Password Reset'] redesigned the page

* ['Password Reset done'] redesigned the page
This commit is contained in:
llj 2024-02-21 17:40:48 +08:00 committed by GitHub
parent f2a6316abf
commit 8f32b9c262
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
5 changed files with 126 additions and 22 deletions

BIN
media/img/email.png Normal file

Binary file not shown.

After

(image error) Size: 9.9 KiB

View File

@ -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',

View File

@ -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);
}

View File

@ -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 %}

View File

@ -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 %}