Commit 7705941a by Brian Talbot

edx.org - added in isolated register button styling/states for <iframe>-based registration fix

parent aa895cbc
// edX LMS - shame
// shame file - used for any bad-form/orphaned scss that knowingly violate edX FED architecture/standards (see - http://csswizardry.com/2013/04/shame-css/)
// ====================
// marketing site - registration iframe band-aid (poor form enough to isolate out)
.view-partial-mktgregister {
// dimensions needed for course about page on marketing site
.wrapper-view {
width: 301px; // taken from bad marketing grid
overflow: hidden;
}
// button elements - not a better place to put these, sadly
.btn {
display: block;
padding: $baseline/2 $baseline*2.5;
text-transform: lowercase;
color: $white;
letter-spacing: 0.1rem;
cursor: pointer;
text-align: center;
border: none !important;
text-shadow: none;
letter-spacing: 0.1rem;
font-size: 17px;
font-weight: 300;
box-shadow: 0 !important;
strong {
font-weight: 400;
}
}
.btn-primary {
@extend .btn;
@include linear-gradient($m-blue-s1 5%, $m-blue-d1 95%);
// no hover state conventions to follow from marketing :/
&:hover, &:active {
}
}
.btn-secondary {
@extend .btn;
@include linear-gradient($m-gray 5%, $m-gray-d1 95%);
// no hover state conventions to follow from marketing :/
&:hover, &:active {
}
}
// nav list
[class|="list"] {
list-style: none;
margin: 0;
padding: 0;
.item {
margin: 0;
}
}
// register actions
.action {
// not registered (default)
&.action-register {
@extend .btn-primary;
}
// not signed in
&.is-not-signedin {
@extend .btn-primary;
}
// already registered
&.is-registered {
@extend .btn-secondary;
}
}
}
......@@ -34,3 +34,5 @@
@import 'discussion';
@import 'news';
@import 'shame';
......@@ -7,6 +7,11 @@
<%inherit file="../mktg_iframe.html" />
<%block name="title"><title>About ${course.number}</title></%block>
<%block name="bodyclass">view-partial-mktgregister</%block>
<%block name="headextra">
<%include file="../google_analytics.html" />
</%block>
......@@ -53,46 +58,21 @@
<script src="${static.url('js/course_info.js')}"></script>
</%block>
<%block name="title"><title>About ${course.number}</title></%block>
<section class="course-info">
<header class="course-profile">
<div class="intro-inner-wrapper">
<div class="main-cta">
%if user.is_authenticated():
%if registered:
%if show_courseware_link:
<a href="${course_target}">
%endif
<span class="register disabled">You are registered for this course (${course.number})</span>
%if show_courseware_link:
<strong>View Courseware</strong>
</a>
%endif
%else:
<a href="#" class="register">Register for ${course.number}</a>
<div id="register_message"></div>
%endif
<%block name="content">
<ul class="list-actions register">
<li class="item">
%if user.is_authenticated():
%if registered:
<!-- signed in, registered -->
<a class="action action-register is-registered" href="${course_target}">Registered for <strong>${course.number}</strong></a>
%else:
<a href="/login" class="register">Register for ${course.number}</a>
<!-- signed in, not registered -->
<a class="action action-register" href="[register path next view]">Register for <strong>${course.number}</strong></a>
%endif
</div>
</header>
</section>
%if not registered:
<div style="display: none;">
<form id="class_enroll_form" method="post" data-remote="true" action="${reverse('change_enrollment')}">
<fieldset class="enroll_fieldset">
<input name="course_id" type="hidden" value="${course.id}">
<input name="enrollment_action" type="hidden" value="enroll">
</fieldset>
<div class="submit">
<input name="submit" type="submit" value="enroll">
</div>
</form>
</div>
%endif
%else:
<!-- not signed in -->
<a class="action action-register is-not-signedin" href="[signin view]">Register for <strong>${course.number}</strong></a>
%endif
</li>
</ul>
</%block>
......@@ -2,36 +2,39 @@
<!DOCTYPE html>
<html>
<head>
<%block name="title"><title>edX</title></%block>
<%block name="title"></%block>
<link rel="icon" type="image/x-icon" href="${static.url('images/favicon.ico')}" />
<meta name="path_prefix" content="${MITX_ROOT_URL}" />
<meta name="google-site-verification" content="_mipQ4AtZQDNmbtOkwehQDOgCxUUV2fb_C0b6wbiRHY" />
<%static:css group='application'/>
<%static:js group='main_vendor'/>
<%block name="headextra"/>
<!--[if lt IE 9]>
<script src="${static.url('js/html5shiv.js')}"></script>
<script src="${static.url('js/html5shiv.js')}"></script>
<![endif]-->
<!--[if lte IE 9]>
<%static:css group='ie-fixes'/>
<%static:css group='ie-fixes'/>
<![endif]-->
<meta name="path_prefix" content="${MITX_ROOT_URL}">
<meta name="google-site-verification" content="_mipQ4AtZQDNmbtOkwehQDOgCxUUV2fb_C0b6wbiRHY" />
<%block name="headextra"/>
% if not course:
<%include file="google_analytics.html" />
% endif
</head>
<body>
<body class="<%block name='bodyclass'></%block>">
<!-- view -->
<div class="wrapper wrapper-view">
<%block name="content"></%block>
</div>
${self.body()}
<%static:js group='application'/>
<%static:js group='module-js'/>
<%block name="js_extra"/>
<%block name="jsextra"></%block>
</body>
</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