adds styles to reset password page
This commit is contained in:
94
lms/static/sass/_password_reset.scss
Normal file
94
lms/static/sass/_password_reset.scss
Normal file
@@ -0,0 +1,94 @@
|
||||
.password-reset {
|
||||
background: rgb(245,245,245);
|
||||
border: 1px solid rgb(200,200,200);
|
||||
@include border-radius(4px);
|
||||
@include box-sizing(border-box);
|
||||
@include box-shadow(0 5px 50px 0 rgba(0,0,0, 0.3));
|
||||
margin: 120px auto 0;
|
||||
padding: 0px 40px 40px;
|
||||
width: grid-width(5);
|
||||
|
||||
header {
|
||||
margin-bottom: 30px;
|
||||
overflow: hidden;
|
||||
padding: 28px 20px 0px;
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
|
||||
&::before {
|
||||
@include background-image(radial-gradient(50% 50%, circle closest-side, rgba(255,255,255, 0.8) 0%, rgba(255,255,255, 0) 100%));
|
||||
content: "";
|
||||
display: block;
|
||||
height: 400px;
|
||||
left: 0px;
|
||||
margin: 0 auto;
|
||||
position: absolute;
|
||||
top: -140px;
|
||||
width: 100%;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
hr {
|
||||
@extend .faded-hr-divider-light;
|
||||
border: none;
|
||||
margin: 0px;
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
|
||||
&::after {
|
||||
@extend .faded-hr-divider;
|
||||
bottom: 0px;
|
||||
content: "";
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: -1px;
|
||||
}
|
||||
}
|
||||
|
||||
h2 {
|
||||
position: relative;
|
||||
text-align: center;
|
||||
text-shadow: 0 1px rgba(255,255,255, 0.4);
|
||||
z-index: 2;
|
||||
}
|
||||
}
|
||||
|
||||
> p {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
form {
|
||||
margin-bottom: 12px;
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
|
||||
label {
|
||||
display: none;
|
||||
}
|
||||
|
||||
input[type="checkbox"] {
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
input[type="email"],
|
||||
input[type="text"],
|
||||
input[type="password"] {
|
||||
background: rgb(255,255,255);
|
||||
display: block;
|
||||
height: 45px;
|
||||
margin-bottom: 20px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.submit {
|
||||
padding-top: 10px;
|
||||
|
||||
input[type="submit"] {
|
||||
display: block;
|
||||
height: 45px;
|
||||
margin: 0 auto;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -32,6 +32,7 @@
|
||||
@import 'jobs';
|
||||
@import 'about_pages';
|
||||
@import 'press_release';
|
||||
@import 'password_reset';
|
||||
|
||||
|
||||
// Courseware styles
|
||||
|
||||
@@ -177,51 +177,6 @@
|
||||
}
|
||||
}
|
||||
|
||||
.honor-code-summary {
|
||||
margin-bottom: 20px;
|
||||
padding: 0px;
|
||||
position: relative;
|
||||
|
||||
p {
|
||||
color: $lighter-base-font-color;
|
||||
font-family: $sans-serif;
|
||||
}
|
||||
|
||||
hr {
|
||||
@extend .faded-hr-divider-light;
|
||||
border: none;
|
||||
margin-top: 30px;
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
|
||||
&::after {
|
||||
@extend .faded-hr-divider;
|
||||
bottom: 0px;
|
||||
content: "";
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: -1px;
|
||||
}
|
||||
}
|
||||
|
||||
ul {
|
||||
@include box-sizing(border-box);
|
||||
margin: 0;
|
||||
padding: 0 0 0 20px;
|
||||
width: 100%;
|
||||
|
||||
li {
|
||||
color: $lighter-base-font-color;
|
||||
font: 300 1.2rem/1.6rem $sans-serif;
|
||||
margin-bottom: 10px;
|
||||
|
||||
&:last-child {
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.submit {
|
||||
padding-top: 10px;
|
||||
|
||||
|
||||
@@ -16,33 +16,51 @@
|
||||
|
||||
<body>
|
||||
|
||||
{% block content %}
|
||||
<section class="outside-app">
|
||||
<header class="global" aria-label="Global Navigation">
|
||||
<nav>
|
||||
<h1 class="logo"><a href="${reverse('root')}"></a></h1>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
{% if validlink %}
|
||||
{% block content %}
|
||||
<section class="password-reset">
|
||||
|
||||
<h1>Enter new password</h1>
|
||||
{% if validlink %}
|
||||
|
||||
<p>Please enter your new password twice so we can verify you typed it in correctly.</p>
|
||||
<header>
|
||||
<h2>Enter new password</h2>
|
||||
<hr>
|
||||
</header>
|
||||
|
||||
<form action="" method="post">{% csrf_token %}
|
||||
{{ form.new_password1.errors }}
|
||||
<p class="aligned wide"><label for="id_new_password1">New password:</label>{{ form.new_password1 }}</p>
|
||||
{{ form.new_password2.errors }}
|
||||
<p class="aligned wide"><label for="id_new_password2">Confirm password:</label>{{ form.new_password2 }}</p>
|
||||
<p><input type="submit" value="Change my password" /></p>
|
||||
</form>
|
||||
<p>Please enter your new password twice so we can verify you typed it in correctly.</p>
|
||||
|
||||
{% else %}
|
||||
<form action="" method="post">{% csrf_token %}
|
||||
{{ form.new_password1.errors }}
|
||||
<label for="id_new_password1">New password:</label>
|
||||
{{ form.new_password1 }}
|
||||
|
||||
<h1>Password reset unsuccessful</h1>
|
||||
{{ form.new_password2.errors }}
|
||||
<label for="id_new_password2">Confirm password:</label>
|
||||
{{ form.new_password2 }}
|
||||
|
||||
<p>The password reset link was invalid, possibly because the link has already been used. Please request a new password reset.</p>
|
||||
<div class="submit">
|
||||
<input type="submit" value="Change my password" />
|
||||
</div>
|
||||
</form>
|
||||
|
||||
{% endif %}
|
||||
{% else %}
|
||||
|
||||
</section>
|
||||
{% endblock %}
|
||||
<header>
|
||||
<h1>Password reset unsuccessful</h1>
|
||||
<hr>
|
||||
</header>
|
||||
|
||||
<p>The password reset link was invalid, possibly because the link has already been used. Please request a new password reset.</p>
|
||||
|
||||
{% endif %}
|
||||
|
||||
</section>
|
||||
{% endblock %}
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -1,3 +1,8 @@
|
||||
<h1>Password reset successful</h1>
|
||||
<header>
|
||||
<h2>Password reset successful</h2>
|
||||
<hr>
|
||||
</header>
|
||||
|
||||
<p>We've e-mailed you instructions for setting your password to the e-mail address you submitted. You should be receiving it shortly.</p>
|
||||
<div class="message">
|
||||
<p>We've e-mailed you instructions for setting your password to the e-mail address you submitted. You should be receiving it shortly.</p>
|
||||
</div>
|
||||
|
||||
@@ -36,26 +36,6 @@
|
||||
<a href="${reverse('honor')}" target="blank">Honor Code</a>
|
||||
</label>
|
||||
|
||||
<!--
|
||||
-<div class="honor-code-summary">
|
||||
- <ul>
|
||||
- <li>
|
||||
- <p>Complete all mid-terms and final exams with only my own work.</p>
|
||||
- </li>
|
||||
- <li>
|
||||
- <p>Maintain only one account, and not share the username or password.</p>
|
||||
- </li>
|
||||
- <li>
|
||||
- <p>Not engage in any activity that would dishonestly improve my results, or improve or hurt those of others.</p>
|
||||
- </li>
|
||||
- <li>
|
||||
- <p>Not post answers to problems that are being used to assess student performance.</p>
|
||||
- </li>
|
||||
- </ul>
|
||||
- <hr>
|
||||
-</div>
|
||||
-->
|
||||
|
||||
<div class="submit">
|
||||
<input name="submit" type="submit" value="Create My Account">
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user