Commit 6da378e7 by Tom Giannattasio Committed by Calen Pennington

tweaked edge template to target students only

parent f4bdb464
.edge-landing { .edge-landing {
border-top: 5px solid $blue;
header { header {
@include clearfix; @include clearfix;
background: $extraDarkGrey; background: $extraDarkGrey;
border-bottom: 3px solid $blue; border-bottom: 3px solid $blue;
} }
.log-in-form { .main-wrapper {
width: 940px;
margin: auto;
.content {
padding: 24px 60px 36px;
border-radius: 3px;
background: #fff;
box-shadow: 0 0 50px rgba(0, 0, 0, .1);
@include clearfix; @include clearfix;
float: right; }
padding: 10px;
.column { .log-in-form {
float: left; float: left;
width: 200px; width: 470px;
margin-right: 10px; margin-right: 50px;
padding-right: 49px;
border-right: 1px solid $lightGrey;
.row {
margin-bottom: 20px;
}
&.submit { label {
width: auto; font-weight: 700;
} }
input { input {
width: 100%; width: 100%;
padding: 5px 8px 7px; font-size: 21px;
@include linear-gradient(top, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.1)); font-weight: 300;
background-color: #4e5153;
border-color: #1c1e20;
color: #fff;
} }
input[type="submit"] { .log-in-submit-button {
@include dark-grey-button; @include blue-button;
position: relative; width: 130px;
top: -1px; padding: 8px 20px 10px;
width: 100px; font-size: 16px;
padding: 6px 20px 8px;
font-size: 11px;
font-weight: 400;
}
} }
.forgot-button { .forgot-button {
font-size: 11px; font-size: 12px;
margin-left: 5px; margin-left: 10px;
} }
} }
.main-wrapper { .sign-up {
width: 980px;
margin: auto;
.column {
float: left; float: left;
width: 400px; width: 250px;
padding: 26px 40px 40px;
border-radius: 3px;
background: #fff;
-webkit-transition: all .15s;
@include box-shadow(0 0 50px rgba(0, 0, 0, .1));
&:hover {
background: $blue;
h2 {
color: #fff;
}
p { .register-button {
color: #bee1f0; @include grey-button;
} margin-top: 20px;
}
&.left {
margin-right: 10px;
}
&.right {
margin-left: 10px;
} }
} }
h2 { h2 {
margin-bottom: 12px; margin-bottom: 30px;
font-size: 30px; font-size: 24px;
font-weight: 300; font-weight: 300;
color: $blue;
@include transition(all .15s);
} }
p { h3 {
font-size: 14px; margin-bottom: 30px;
line-height: 1.4; font-size: 24px;
color: #7d7d7d; font-weight: 300;
@include transition(all .15s);
} }
} }
......
...@@ -5,33 +5,32 @@ ...@@ -5,33 +5,32 @@
<%block name="content"> <%block name="content">
<header> <div class="main-wrapper">
<div class="edx-edge-logo-large"></div>
<div class="content">
<div class="log-in-form"> <div class="log-in-form">
<h2>Log in to your courses</h2>
<form> <form>
<div class="column"> <div class="row">
<input name="email" type="email" class="email-field" tabindex="1" placeholder="email"> <label>Email</label>
<input name="email" type="email" class="email-field" tabindex="1">
</div> </div>
<div class="column"> <div class="row">
<input name="password" type="password" class="password-field" tabindex="2" placeholder="password"> <label>Password</label>
<input name="password" type="password" class="password-field" tabindex="2">
</div> </div>
<div class="column submit"> <div class="row submit">
<input name="submit" type="submit" value="Log In" class="log-in-submit-button" tabindex="3"> <input name="submit" type="submit" value="Log In" class="log-in-submit-button" tabindex="3">
<a href="#" class="forgot-button">Forgot password?</a> <a href="#" class="forgot-button">Forgot password?</a>
</div> </div>
</form> </form>
</div> </div>
</header> <div class="sign-up">
<h3>Register for classes</h3>
<div class="main-wrapper"> <p>Take free online courses from today's leading universities.</p>
<div class="edx-edge-logo-large"></div> <p><a href="#" class="register-button">Register</a></p>
<a href="#" class="column left"> </div>
<h2>Create a course</h2> </div>
<p>Hendrerit in vulputate velit, esse molestie consequat vel illum dolore eu feugiat. Exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Modo typi qui nunc nobis, videntur parum clari.</p>
</a>
<a href="#" class="column right">
<h2>Register for courses</h2>
<p>Hendrerit in vulputate velit, esse molestie consequat vel illum dolore eu feugiat. Exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Modo typi qui nunc nobis, videntur parum clari.</p>
</a>
</div> </div>
</%block> </%block>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment