Commit d5ae55cb by Chris Dodge

Add matching header bar to heartbeat page

parent c16f9772
{% load i18n %} <!DOCTYPE html>
<html> <html lang="en">
<body> <head>
</body> <meta charset="UTF-8">
<p> <title>Sample Progress Steps edX</title>
{% blocktrans %} <style>
Your proctoring session has started. Do not close this window. body {
Return to the browser window where your course is open to take your exam. background-color: #FAFAFA;
{% endblocktrans %} color: #3c3c3c;
</p> font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
padding: 0;
margin: 0;
}
.steps-bk {
background: #DFE6E8;
}
.steps-container {
width: 80%;
}
.steps-container p {
line-height: 28px;
font-size: 16px;
color: #5F626C;
margin-bottom: 20px;
}
#steps-wrapper {
width: 960px;
margin: 0 auto;
text-align: center;
position: relative;
}
.steps {
overflow: hidden;
padding: 0;
margin-top: 0;
}
.steps li {
list-style-type: none;
font-size: 12px;
width: 25%;
float: left;
position: relative;
padding: 40px 0 20px;
color: #3C464A;
font-weight: bold;
}
.steps li:before {
content: '';
width: 12px;
font-size: 12px;
margin: 0 auto 5px auto;
border-radius: 9px;
border: 2px solid #ccc;
height: 12px;
background-color: #DFE6E8;
position: absolute;
z-index: 2;
left: 50%;
top: 20px;
margin-left: -6px;
}
.steps li:after {
content: "";
width: 100%;
height: 1px;
background: #ccc;
position: absolute;
left: -50%;
top: 26px
}
li.active {
background: #D3DBDC;
}
.steps li:first-child:after {
content: none;
}
.steps li.active:before {
background: #3C464A;
width: 12px;
height: 12px;
border: none;
}
li.completed {
color: #27AE60 !important;
}
.steps li.completed:before {
border: 2px solid #27AE60;
}
.steps li:not(.active) {
color: rgba(51, 51, 51, 0.4);
}
</style>
<link rel="stylesheet" href="main.css">
</head>
<body>
<div class="steps-bk">
<div id="steps-wrapper">
<ul class="steps">
<li class="photoid completed">Take ID Photo </li>
<li class="roomscan completed">Record Room Scan</li>
<li class="photo completed">Take User Photo</li>
<li class="end active" >Enter Exam</li>
</ul>
</div>
</div>
<p>Your proctored exam has started. Please immediately go back to the website to enter into your exam</p>
</body>
</html> </html>
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