Files
edx-platform/lms/static/sass/course/layout/_courseware_header.scss
uzairr 8b54c13fbc Fix inconsistency in the active tab colors
The course header sass source is generating styles that eventually
are in conflict with some of the tabs.To avoid it, new style
properties are added that resolves it.

LEARNER-748
2017-09-13 19:32:26 +00:00

167 lines
3.4 KiB
SCSS

.wrapper-course-material {
@include clearfix();
@include box-sizing(border-box);
@extend %ui-print-excluded;
border-bottom: none;
margin: 0 auto 0;
padding: 0;
width: 100%;
.course-material{
@extend %inner-wrapper;
}
.course-tabs {
@include border-top-radius(4px);
@include clearfix();
padding: ($baseline*0.75) 0 ($baseline*0.75) 0;
li {
display: inline-block;
list-style: none;
&.prominent {
@include margin-right(16px);
background: rgba(255, 255, 255, 0.5);
border-radius: 3px;
}
&.prominent + li {
@include padding-left($baseline*0.75);
@include border-left(1px solid $gray-d3);
}
a,
a:visited {
@include padding(($baseline/2), ($baseline*0.75), 13px, ($baseline*0.75));
@extend %t-title7;
@extend %t-regular;
color: $gray-d1;
display: block;
text-align: center;
text-decoration: none;
border-bottom: 4px solid transparent;
&:hover,
&:focus,
&.active {
color: $uxpl-blue-hover-active;
border-bottom-color: $uxpl-blue-hover-active;
background-color: transparent;
}
}
}
}
}
.course-content {
margin-top: ($baseline*1.5);
.courseware {
min-height: 300px;
}
}
.header-global.slim {
box-shadow: 0 1px 2px $shadow-l1;
height: auto;
padding: ($baseline/4) 0 ($baseline/2) 0;
border-bottom: 1px solid $header-border-color;
background: $header-bg;
line-height: 1.4;
.wrapper-header {
padding-top: ($baseline/4);
}
.nav-account-management {
padding: 0;
}
.guest .secondary {
@include margin-right(0);
}
.guest .secondary a {
display: none;
&#login {
display: block;
@include background-image(linear-gradient(-90deg, lighten($link-color, 8%), lighten($link-color, 5%) 50%, $link-color 50%, darken($link-color, 10%) 100%));
border: 1px solid transparent;
border-color: $uxpl-blue-base;
border-radius: 3px;
@include box-sizing(border-box);
box-shadow: 0 1px 0 0 rgba(255,255,255, 0.6);
color: $white;
display: inline-block;
font-family: $sans-serif;
font-size: 14px;
font-weight: bold;
display: inline-block;
letter-spacing: 0;
line-height: 1em;
margin: 4px;
padding: 6px 12px 8px;
text-decoration: none;
text-transform: none;
text-shadow: 0 -1px rgba(0, 0, 0, 0.6);
vertical-align: middle;
&:hover, &:active, &:focus {
@include background-image(linear-gradient(-90deg, $uxpl-blue-base, $uxpl-blue-base 50%, $uxpl-blue-base 50%, $uxpl-blue-base 100%));
}
}
}
nav {
padding-top: ($baseline/4);
}
.logo {
margin: 0 ($baseline/2) 0 0;
img {
height: 30px;
vertical-align: middle;
}
}
.nav-main,
.nav-global {
display: none;
}
.course-header {
@include float(left);
@include margin(10px, 10px, 0px, 10px);
display: inline-block;
width: 65%;
font-weight: font-weight(normal);
font-size: font-size(base);
line-height: 1.5;
.provider {
font: inherit;
font-weight: bold;
}
}
a#signup {
position: relative;
margin-top: 3px;
padding: 6px 12px 8px;
text-transform: none;
font-size: 14px;
font-weight: bold;
letter-spacing: 0;
}
@media print {
background: transparent !important;
}
}