Skip to content

E
edx-platform
Commit 5674dd19 by Brian Talbot
Options

studio - soft landing and nav: slight visual tweaks to soft landing UI and added… 

studio - soft landing and nav: slight visual tweaks to soft landing UI and added in support link + new tab/window and modal management JS
parent cb9d960a
Showing with 40 additions and 30 deletions
cms/static/js/base.js
......@@ -49,18 +49,30 @@ $(document).ready(function() {
e.preventDefault();
if ($subnav.hasClass('is-shown')) {
$subnav.removeClass('is-shown');
$title.removeClass('is-selected');
}
if ($subnav.hasClass('is-shown')) {
$subnav.removeClass('is-shown');
$title.removeClass('is-selected');
}
else {
$('.nav-dropdown .nav-item .title').removeClass('is-selected');
$('.nav-dropdown .nav-item .wrapper-nav-sub').removeClass('is-shown');
$title.addClass('is-selected');
$subnav.addClass('is-shown');
}
});
else {
$('.nav-dropdown .nav-item .title').removeClass('is-selected');
$('.nav-dropdown .nav-item .wrapper-nav-sub').removeClass('is-shown');
$title.addClass('is-selected');
$subnav.addClass('is-shown');
}
});
// general link management - new window/tab
$('a[rel="external"]').attr('title','This link will open in a new browser/window tab').click(function(e) {
window.open($(this).attr('href'));
e.preventDefault();
});
// general link management - lean modal window
$('a[rel="modal"]').attr('title','This link will open in a modal window').leanModal({overlay : 0.50, closeButton: '.action-modal-close' });
$('.action-modal-close').click(function(e){
(e).preventDefault();
});
// toggling overview section details
$(function(){
......
cms/static/sass/_header.scss
......@@ -63,7 +63,7 @@ nav .nav-item {
vertical-align: top;
}
.branding, .info-course, .nav-course {
.branding, .info-course {
margin: 0 ($baseline*0.75) 0 0;
}
......@@ -85,9 +85,8 @@ nav .nav-item {
// specific elements - course name/info
.info-course {
position: relative;
max-width: 195px;
margin-top: -3px;
padding-right: $baseline;
padding-right: ($baseline*0.75);
@include font-size(14);
&:before {
......@@ -122,6 +121,7 @@ nav .nav-item {
.course-title {
width: 100%;
max-width: 220px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
......@@ -140,7 +140,6 @@ nav .nav-item {
> ol > .nav-item {
vertical-align: bottom;
width: 100px;
margin: 0 ($baseline/2) 0 0;
&:last-child {
......@@ -205,13 +204,6 @@ nav .nav-item {
.nav-account-username {
width: 100%;
.ss-icon {
display: inline-block;
vertical-align: middle;
margin-right: 3px;
@include font-size(12);
}
.account-username {
display: inline-block;
width: 80%;
......@@ -231,8 +223,9 @@ nav .nav-item {
position: relative;
.icon-expand {
@include transition (color 0.5s ease-in-out);
@include transition (color 0.5s ease-in-out, opacity 0.5s ease-in-out);
margin-left: 2px;
opacity: 0.5;
color: $gray-l2;
}
......@@ -240,6 +233,7 @@ nav .nav-item {
.icon-expand {
color: $blue;
opacity: 1.0;
}
}
}
......@@ -320,6 +314,10 @@ nav .nav-item {
.nav-sub {
text-align: left;
.icon-expand {
top: -2px;
}
}
.nav-sub:after {
......
cms/static/sass/_index.scss
......@@ -58,9 +58,9 @@
// welcome content
.wrapper-content-header {
@include linear-gradient($blue-l1,$blue,$blue-d1);
padding-bottom: ($baseline*4);
padding-top: ($baseline*4);
background: $blue;
}
.content-header {
......
cms/templates/widgets/footer.html
......@@ -15,7 +15,7 @@
<a href="#">Privacy Policy</a>
</li>
<li class="nav-item nav-peripheral-help">
<a href="#">edX Studio Help</a>
<a href="http://help.edge.edx.org/" rel="external">edX Studio Help</a>
</li>
<li class="nav-item nav-peripheral-contact">
<a href="#">Contact edX</a>
......
cms/templates/widgets/header.html
......@@ -12,7 +12,7 @@
<h2 class="sr">Current Course:</h2>
<a href="${reverse('course_index', kwargs=dict(org=ctx_loc.org, course=ctx_loc.course, name=ctx_loc.name))}">
<span class="course-number">PH207x:</span>
<span class="course-title">${context_course.display_name}</span>
<span class="course-title" title="${context_course.display_name}">${context_course.display_name}</span>
</a>
</div>
......@@ -28,7 +28,7 @@
<ul>
<li class="nav-item"><a href="${reverse('course_index', kwargs=dict(org=ctx_loc.org, course=ctx_loc.course, name=ctx_loc.name))}">Outline</a></li>
<li class="nav-item"><a href="${reverse('course_info', kwargs=dict(org=ctx_loc.org, course=ctx_loc.course, name=ctx_loc.name))}">Updates</a></li>
<li class="nav-item"><a href="${reverse('edit_tabs', kwargs=dict(org=ctx_loc.org, course=ctx_loc.course, coursename=ctx_loc.name))}">Pages/Tabs</a></li>
<li class="nav-item"><a href="${reverse('edit_tabs', kwargs=dict(org=ctx_loc.org, course=ctx_loc.course, coursename=ctx_loc.name))}">Static Pages</a></li>
<li class="nav-item"><a href="${reverse('asset_index', kwargs=dict(org=ctx_loc.org, course=ctx_loc.course, name=ctx_loc.name))}">Files &amp; Uploads</a></li>
</ul>
</div>
......@@ -84,8 +84,8 @@
<div class="wrapper wrapper-nav-sub">
<div class="nav-sub">
<ul>
<li class="nav-item"><a href="#">My Courses</a></li>
<li class="nav-item"><a href="#">Help</a></li>
<li class="nav-item"><a href="${reverse('course_index', kwargs=dict(org=ctx_loc.org, course=ctx_loc.course, name=ctx_loc.name))}">My Courses</a></li>
<li class="nav-item"><a href="http://help.edge.edx.org/" rel="external">Help</a></li>
<li class="nav-item"><a class="action action-logout" href="${reverse('logout')}">Logout</a></li>
</ul>
</div>
......@@ -101,7 +101,7 @@
<a href="#">How Studio Works</a>
</li>
<li class="nav-item nav-not-signedin-help">
<a href="#">Studio Help</a>
<a href="http://help.edge.edx.org/" rel="external">Studio Help</a>
</li>
<li class="nav-item nav-not-signedin-signup">
<a class="action action-signup" href="${reverse('signup')}">Sign Up</a>
......
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