Files
edx-platform/static/sass/courseware/_courseware.scss

321 lines
6.1 KiB
SCSS

html {
height: 100%;
max-height: 100%;
}
body.courseware {
height: 100%;
max-height: 100%;
}
div.course-wrapper {
@extend .table-wrapper;
ul, ol {
list-style: none;
}
section.course-content {
@extend .content;
overflow: hidden;
@include border-top-right-radius(4px);
@include border-bottom-right-radius(4px);
h1 {
margin: 0 0 lh();
}
p {
margin-bottom: lh();
&:empty {
display: none;
margin-bottom: 0;
}
}
ul {
li {
margin-bottom: lh(.5);
}
}
.problem-set {
position: relative;
@extend .clearfix;
h2 {
margin-top: 0;
margin-bottom: 15px;
width: flex-grid(2, 9);
padding-right: flex-gutter(9);
border-right: 1px dashed #ddd;
@include box-sizing(border-box);
display: table-cell;
vertical-align: top;
@media screen and (max-width:1120px) {
display: block;
width: auto;
border-right: 0;
}
@media print {
display: block;
width: auto;
border-right: 0;
}
}
section.problem {
display: table-cell;
width: flex-grid(7, 9);
padding-left: flex-gutter(9);
@media screen and (max-width:1120px) {
display: block;
width: auto;
padding: 0;
}
@media print {
display: block;
width: auto;
padding: 0;
canvas, img {
page-break-inside: avoid;
}
}
span {
&.unanswered, &.ui-icon-bullet {
@include inline-block();
background: url('../images/unanswered-icon.png') center center no-repeat;
height: 14px;
position: relative;
top: 4px;
width: 14px;
}
&.correct, &.ui-icon-check {
@include inline-block();
background: url('../images/correct-icon.png') center center no-repeat;
height: 20px;
position: relative;
top: 6px;
width: 25px;
}
&.incorrect, &.ui-icon-close {
@include inline-block();
background: url('../images/incorrect-icon.png') center center no-repeat;
height: 20px;
width: 20px;
position: relative;
top: 6px;
}
}
}
div {
> span {
display: block;
margin-bottom: lh(.5);
}
}
input[type="text"] {
display: inline-block;
}
center {
display: block;
margin: lh() 0;
border: 1px solid #ccc;
padding: lh();
}
section.action {
margin-top: lh();
}
}
section.problems-wrapper, div#seq_content {
@extend .problem-set;
}
section.problems-wrapper {
display: table;
width: 100%;
@media screen and (max-width:1120px) {
display: block;
width: auto;
}
}
div#seq_content {
h1 {
background: none;
margin-bottom: lh();
padding-bottom: 0;
border-bottom: none;
}
}
ol.vert-mod {
> li {
@extend .clearfix;
@extend .problem-set;
border-bottom: 1px solid #ddd;
margin-bottom: 15px;
padding: 0 0 15px;
header {
@extend h1.top-header;
margin-bottom: -16px;
h1 {
margin: 0;
}
h2 {
float: right;
margin-right: 0;
margin-top: 8px;
text-align: right;
padding-right: 0;
}
}
&:last-child {
border-bottom: none;
margin-bottom: 0;
padding-bottom: 0;
}
ul {
list-style: disc outside none;
padding-left: 1em;
}
nav.sequence-bottom {
ul {
list-style: none;
padding: 0;
}
}
}
}
section.tutorials {
h2 {
margin-bottom: lh();
}
ul {
margin: 0;
@include clearfix();
li {
width: flex-grid(3, 9);
float: left;
margin-right: flex-gutter(9);
margin-bottom: lh();
&:nth-child(3n) {
margin-right: 0;
}
&:nth-child(3n+1) {
clear: both;
}
a {
font-weight: bold;
}
}
}
}
div.staff_info {
@include clearfix();
white-space: pre-wrap;
border-top: 1px solid #ccc;
padding-top: lh();
margin-top: lh();
line-height: lh();
font-family: Consolas, "Lucida Console", Monaco, "Courier New", Courier, monospace;
}
div.ui-slider {
border: 1px solid #aaa;
background: #ddd;
@include box-shadow(inset 0 1px 0 #eee);
@include border-radius(0);
a.ui-slider-handle {
@include box-shadow(inset 0 1px 0 lighten($mit-red, 10%));
background: $mit-red url(../images/slider-bars.png) center center no-repeat;
border: 1px solid darken($mit-red, 20%);
cursor: pointer;
&:hover, &:focus {
background-color: lighten($mit-red, 10%);
outline: none;
}
}
}
div.ui-tabs {
border: 0;
@include border-radius(0);
margin: 0;
padding: 0;
.ui-tabs-nav {
background: none;
border: 0;
margin-bottom: lh(.5);
}
.ui-tabs-panel {
@include border-radius(0);
padding: 0;
}
}
}
&.closed {
section.course-index {
width: flex-grid(.6);
header#open_close_accordion {
padding: 0;
a {
background-image: url('../images/slide-right-icon.png');
}
h2 {
visibility: hidden;
width: 10px;
padding: 0;
}
}
div#accordion {
visibility: hidden;
width: 10px;
padding: 0;
}
}
section.course-content {
width: flex-grid(11.5) + flex-gutter();
}
}
}