Skip to content

E
edx-platform
Commit d4e8034f by Frances Botsford
Options

refinements on the verification html and sass

parent 061b994e
Showing with 68 additions and 64 deletions
lms/static/sass/views/_verification.scss
......@@ -8,6 +8,16 @@ body.register.verification {
font-family: 'Open Sans', sans-serif;
}
dt {
margin-bottom: ($baseline*.75);
}
dd {
margin: 0;
}
.content-wrapper {
background: none repeat scroll 0 0 #F7F7F7;
}
......@@ -79,49 +89,6 @@ body.register.verification {
&.block-cert {
border-top: 5px solid #008801;
ul {
list-style-type: none;
margin: 0;
padding: 0;
li {
display: inline-block;
background-color: $light-gray;
padding: ($baseline/2) ($baseline*.75);
margin-right: ($baseline/4);
vertical-align: middle;
label {
font-style: normal;
font-family: 'Open Sans', sans-serif;
font-weight: 400;
vertical-align: middle;
}
&.other1 {
margin-right: -($baseline/4);
padding-right: ($baseline/4);
}
&.other2 {
padding: ($baseline/4) ($baseline*.75) ($baseline/4) 0;
}
input {
vertical-align: middle;
}
}
}
dt {
margin-bottom: ($baseline*.75);
}
dd {
margin: 0;
}
}
......@@ -160,10 +127,43 @@ body.register.verification {
font-size: 14px;
}
}
}
.pay-options {
list-style-type: none;
margin: 0;
padding: 0;
li {
display: inline-block;
background-color: $light-gray;
padding: ($baseline/2) ($baseline*.75);
margin-right: ($baseline/4);
vertical-align: middle;
label {
font-style: normal;
font-family: 'Open Sans', sans-serif;
font-weight: 400;
vertical-align: middle;
}
&.other1 {
margin-right: -($baseline/4);
padding-right: ($baseline/4);
}
&.other2 {
padding: ($baseline/4) ($baseline*.75) ($baseline/4) 0;
}
input {
vertical-align: middle;
}
}
}
.m-btn-primary {
a {
......
lms/templates/verify_student/face_upload.html
......@@ -37,7 +37,7 @@ $(document).ready(function() {
<section class="wrapper carousel" data-transition="slide">
<div id="wrapper-facephoto" class="block-photo">
<div id="wrapper-facephoto" class="block block-photo">
<h3 class="title">Take Your Photo</h3>
<p>Use your webcam to take a picture of your face so we can match it with the picture on your ID.</p>
......@@ -93,7 +93,9 @@ $(document).ready(function() {
<div class="actions">
<ul>
<li class="action action-next">
<a class="next" href="#next" aria-hidden="true" title="Next">Go to Step 2: Take ID Photo</a>
<p class="m-btn-primary">
<a class="next" href="#next" aria-hidden="true" title="Next">Go to Step 2: Take ID Photo</a>
</p>
<p class="tips">Once you verify your photo looks good, you can move on to step 2.</p>
</li>
</ul>
......@@ -104,7 +106,7 @@ $(document).ready(function() {
<div id="wrapper-idphoto" class="block-photo">
<div id="wrapper-idphoto" class="block block-photo">
<h3 class="title">Take Your Photo</h3>
<p>Use your webcam to take a picture of your face so we can match it with the picture on your ID.</p>
......@@ -163,7 +165,9 @@ $(document).ready(function() {
<div class="actions">
<ul>
<li class="action action-next">
<a class="next" href="#next" aria-hidden="true" title="Next">Go to Step 3: Review Your Info</a>
<p class="m-btn-primary">
<a class="next" href="#next" aria-hidden="true" title="Next">Go to Step 3: Review Your Info</a>
</p>
<p class="tips">Once you verify your ID photo looks good, you can move on to step 3.</p>
</li>
</ul>
......@@ -174,7 +178,7 @@ $(document).ready(function() {
<div id="wrapper-review" class="block-photo">
<div id="wrapper-review" class="block block-photo">
<h3 class="title">Verify Your Submission</h3>
<p>Make sure we can verify your identity with the photos and information below.</p>
......@@ -219,24 +223,24 @@ $(document).ready(function() {
<dl>
<dt>
The contribution you selected for this course is (in USD):
Select your contribution for this course:
</dt>
<dd>
<ul>
<ul class="pay-options">
<li>
<input type="radio" name="contribution-25" id="contribution"> <label for="contribution-25">$25</label>
<input type="radio" id="contribution-25" name="contribution"> <label for="contribution-25">$25 USD</label>
</li>
<li>
<input type="radio" name="contribution-50" id="contribution"> <label for="contribution-50">$50</label>
<input type="radio" id="contribution-50" name="contribution"> <label for="contribution-50">$50 USD</label>
</li>
<li>
<input type="radio" name="contribution-100" id="contribution"> <label for="contribution-100">$100</label>
<input type="radio" id="contribution-100" name="contribution"> <label for="contribution-100">$100 USD</label>
</li>
<li>
<input type="radio" name="contribution-other" id="contribution"> <label for="contribution-other">Other</label>
<li class="other1">
<input type="radio" id="contribution-other" name="contribution"> <label for="contribution-other"><span class="sr">Other</span></label>
</li>
<li>
<label for="contribution-other-amt">Other Amount</label> <input type="text" name="contribution-other" id="contribution-other-amt">
<li class="other2">
<label for="contribution-other-amt"><span class="sr">Other Amount</span> $</label> <input type="text" size="5" name="contribution-other-amt" id="contribution-other-amt">
</li>
</ul>
</dd>
......@@ -254,7 +258,7 @@ $(document).ready(function() {
<div class="actions">
<ul>
<li class="action action-next">
<a href="#">Go to Step 4: Secure Payment</a>
<p class="m-btn-primary"><a href="#">Go to Step 4: Secure Payment</a></p>
<p class="tips">Once you verify your details match the requirements, you can move on to step 4, payment on our secure server.</p>
</li>
</ul>
......@@ -265,8 +269,8 @@ $(document).ready(function() {
<section class="support">
<p>More questions? <a rel="external" href="">Check out our FAQs.</a></p>
<p>Change your mind? <a href="">You can always Audit the course for free without verifying.</a></p>
<p class="tip">More questions? <a rel="external" href="">Check out our FAQs.</a></p>
<p class="tip">Change your mind? <a href="">You can always Audit the course for free without verifying.</a></p>
</section>
......
lms/templates/verify_student/photo_id_upload.html
......@@ -59,7 +59,7 @@ $(document).ready(function() {
Select your contribution for this course:
</dt>
<dd>
<ul>
<ul class="pay-options">
<li>
<input type="radio" id="contribution-25" name="contribution"> <label for="contribution-25">$25 USD</label>
</li>
......
lms/templates/verify_student/show_requirements.html
......@@ -79,8 +79,8 @@
</section>
<section class="support">
<p>More questions? <a rel="external" href="">Check out our FAQs.</a></p>
<p>Change your mind? <a href="">You can always Audit the course for free without verifying.</a></p>
<p class="tip">More questions? <a rel="external" href="">Check out our FAQs.</a></p>
<p class="tip">Change your mind? <a href="">You can always Audit the course for free without verifying.</a></p>
</section>
</div>
......
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