Andal.LND/edx-platform
6
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

studio - soft landing UI: sign in and basic styling/layout tweaks

Browse Source
This commit is contained in:
Brian Talbot
2013-02-04 00:43:24 -05:00
parent 5a1795db85
commit 4946eace2a
5 changed files with 88 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
cms/static/sass/_account.scss
View File

@@ -19,7 +19,7 @@
header {
position: relative;
margin-bottom: ($baseline/2);
margin-bottom: $baseline;
border-bottom: 1px solid $gray-l4;
padding-bottom: ($baseline/2);
@@ -129,6 +129,22 @@
&.short {
width: 25%;
}
::-webkit-input-placeholder {
color: $gray-l4;
}
:-moz-placeholder {
color: $gray-l3;
}
::-moz-placeholder {
color: $gray-l3;
}
:-ms-input-placeholder {
color: $gray-l3;
}
}
textarea.long {
@@ -212,12 +228,20 @@
.signup {
}
.signin {
#field-password {
position: relative;
.action-forgotpassword {
@include font-size(13);
position: absolute;
top: 0;
right: 0;
}
}
}
// @include transition(all 1s ease-in-out);

4
cms/static/sass/_header.scss
View File

@@ -19,13 +19,13 @@
}
}
.header {
header {
@include clearfix();
max-width: $fg-max-width;
min-width: $fg-min-width;
width: flex-grid(12);
margin: 0 auto;
color: $lightGrey;
color: $gray-l1;
}
}

73
cms/templates/login.html
View File

@@ -1,33 +1,61 @@
<%inherit file="base.html" />
<%! from django.core.urlresolvers import reverse %>
<%block name="title">Log in</%block>
<%block name="title">Sign in</%block>
<%block name="bodyclass">not-signedin signin</%block>
<%block name="content">
<div class="edx-studio-logo-large"></div>
<article class="log-in-box">
<div class="wrapper-content wrapper">
<section class="content">
<header>
<h1>Log in to edX studio</h1>
<h1>Sign into edX Studio</h1>
<a href="" class="action action-signin">Don't have a Studio Account? Sign up!</a>
</header>
<form class="log-in-form" id="login_form" action="login_post" method="post">
<div class="row">
<label>Email</label>
<input name="email" type="email" class="email-field" tabindex="1">
</div>
<div class="row">
<label>Password <a href="${forgot_password_link}" class="forgot-button">Forgot password?</a></label>
<input name="password" type="password" class="password-field" tabindex="2">
</div>
<div class="row form-actions">
<input name="submit" type="submit" value="Log In" class="log-in-button" tabindex="3">
<span class="or">or</span>
<a href="${reverse('signup')}" class="sign-up-button" tabindex="4">Sign up</a>
</div>
</form>
</article>
<article class="content-primary" role="main">
<form id="login_form" method="post" action="login_post">
<div id="login_error" name="login_error" class="message message-status message-status-error">
</div>
<fieldset>
<legend class="sr">Required Information to Sign into edX Studio</legend>
<ol class="list-input">
<li class="field text required" id="field-email">
<label for="email">Email Address</label>
<input id="email" type="email" name="email" placeholder="e.g. jane.doe@gmail.com" />
</li>
<li class="field text required" id="field-password">
<a href="${forgot_password_link}" class="action action-forgotpassword">Forgot password?</a>
<label for="password">Password</label>
<input id="password" type="password" name="password" />
</li>
</ol>
</fieldset>
<div class="form-actions">
<button type="submit" id="submit" name="submit" class="action action-primary">Sign into edX Studio</button>
</div>
<!-- no honor code for CMS, but need it because we're using the lms student object -->
<input name="honor_code" type="checkbox" value="true" checked="true" hidden="true">
</form>
</article>
<aside class="content-supplementary" role="complimentary">
<h2 class="sr">Studio Support</h2>
<div class="bit">
<h3>Need Help?</h3>
<p>Having trouble with your account? Use <a href="" rel="external">our support center</a> to look over self help steps, find solutions others have found to the same problem, or let us know of your issue.</p>
</div>
</aside>
</section>
</div>
</%block>
<%block name="jsextra">
<script type="text/javascript">
(function() {
function getCookie(name) {
@@ -64,5 +92,4 @@
});
})(this)
</script>
</%block>
</%block>

7
cms/templates/signup.html
View File

@@ -10,13 +10,13 @@
<section class="content">
<header>
<h1>Sign Up for edX Studio</h1>
<a href="" class="action action-signin">Already have a Studio Account? Sign In</a>
<a href="" class="action action-signin">Already have a Studio Account? Sign in</a>
</header>
<p class="introduction">Ready to start creating online courses? Sign up below and start creating your first edX course today.</p>
<article class="content-primary" role="main">
<form id="register_form" method="post">
<form id="register_form" method="post" action="register_post">
<div id="register_error" name="register_error" class="message message-status message-status-error">
</div>
@@ -67,6 +67,9 @@
<div class="form-actions">
<button type="submit" id="submit" name="submit" class="action action-primary">Create My Account & Start Authoring Courses</button>
</div>
<!-- no honor code for CMS, but need it because we're using the lms student object -->
<input name="honor_code" type="checkbox" value="true" checked="true" hidden="true">
</form>
</article>

5
cms/templates/widgets/header.html
View File

@@ -2,6 +2,11 @@
<div class="wrapper-header wrapper">
<header class="primary" role="banner">
<span class="wrapper wrapper-flex">
</span>
<h1 class="branding"><a href="#">edX Studio</a></h1>
% if context_course: