diff --git a/cms/djangoapps/contentstore/views.py b/cms/djangoapps/contentstore/views.py
index 3223bfda29..e259a465c3 100644
--- a/cms/djangoapps/contentstore/views.py
+++ b/cms/djangoapps/contentstore/views.py
@@ -102,27 +102,15 @@ def course_index(request, org, course, name):
if not has_access(request.user, location):
raise Http404 # TODO (vshnayder): better error
- # TODO (cpennington): These need to be read in from the active user
- _course = modulestore().get_item(location)
- weeks = _course.get_children()
-
- #upload_asset_callback_url = "/{org}/{course}/course/{name}/upload_asset".format(
- # org = org,
- # course = course,
- # name = name
- # )
-
upload_asset_callback_url = reverse('upload_asset', kwargs = {
'org' : org,
'course' : course,
'coursename' : name
})
- logging.debug(upload_asset_callback_url)
- return render_to_response('course_index.html', {
- 'weeks': weeks,
- 'upload_asset_callback_url': upload_asset_callback_url
- })
+ return render_to_response('overview.html', {
+ 'upload_asset_callback_url': upload_asset_callback_url
+ })
@login_required
diff --git a/cms/static/img/breadcrumb-arrow.png b/cms/static/img/breadcrumb-arrow.png
new file mode 100644
index 0000000000..5dca714363
Binary files /dev/null and b/cms/static/img/breadcrumb-arrow.png differ
diff --git a/cms/static/img/date-circle.png b/cms/static/img/date-circle.png
new file mode 100644
index 0000000000..10b654735d
Binary files /dev/null and b/cms/static/img/date-circle.png differ
diff --git a/cms/static/img/delete-icon-white.png b/cms/static/img/delete-icon-white.png
new file mode 100644
index 0000000000..3a1efd1f97
Binary files /dev/null and b/cms/static/img/delete-icon-white.png differ
diff --git a/cms/static/img/delete-icon.png b/cms/static/img/delete-icon.png
new file mode 100644
index 0000000000..1855a2943d
Binary files /dev/null and b/cms/static/img/delete-icon.png differ
diff --git a/cms/static/img/discussion-module.png b/cms/static/img/discussion-module.png
new file mode 100644
index 0000000000..1eed318e57
Binary files /dev/null and b/cms/static/img/discussion-module.png differ
diff --git a/cms/static/img/drag-handles.png b/cms/static/img/drag-handles.png
new file mode 100644
index 0000000000..391a64dbe0
Binary files /dev/null and b/cms/static/img/drag-handles.png differ
diff --git a/cms/static/img/edit-icon-white.png b/cms/static/img/edit-icon-white.png
new file mode 100644
index 0000000000..0469d56c89
Binary files /dev/null and b/cms/static/img/edit-icon-white.png differ
diff --git a/cms/static/img/edit-icon.png b/cms/static/img/edit-icon.png
new file mode 100644
index 0000000000..2da9551010
Binary files /dev/null and b/cms/static/img/edit-icon.png differ
diff --git a/cms/static/img/expand-collapse-icons.png b/cms/static/img/expand-collapse-icons.png
new file mode 100644
index 0000000000..a4a1518ec9
Binary files /dev/null and b/cms/static/img/expand-collapse-icons.png differ
diff --git a/cms/static/img/large-discussion-icon.png b/cms/static/img/large-discussion-icon.png
new file mode 100644
index 0000000000..2f0bfea98f
Binary files /dev/null and b/cms/static/img/large-discussion-icon.png differ
diff --git a/cms/static/img/large-freeform-icon.png b/cms/static/img/large-freeform-icon.png
new file mode 100644
index 0000000000..b1d195a7ca
Binary files /dev/null and b/cms/static/img/large-freeform-icon.png differ
diff --git a/cms/static/img/large-problem-icon.png b/cms/static/img/large-problem-icon.png
new file mode 100644
index 0000000000..b962d42b14
Binary files /dev/null and b/cms/static/img/large-problem-icon.png differ
diff --git a/cms/static/img/large-slide-icon.png b/cms/static/img/large-slide-icon.png
new file mode 100644
index 0000000000..04241fa2f7
Binary files /dev/null and b/cms/static/img/large-slide-icon.png differ
diff --git a/cms/static/img/large-textbook-icon.png b/cms/static/img/large-textbook-icon.png
new file mode 100644
index 0000000000..1ac2db86d2
Binary files /dev/null and b/cms/static/img/large-textbook-icon.png differ
diff --git a/cms/static/img/large-video-icon.png b/cms/static/img/large-video-icon.png
new file mode 100644
index 0000000000..392851324c
Binary files /dev/null and b/cms/static/img/large-video-icon.png differ
diff --git a/cms/static/img/list-icon.png b/cms/static/img/list-icon.png
new file mode 100644
index 0000000000..ab46179cec
Binary files /dev/null and b/cms/static/img/list-icon.png differ
diff --git a/cms/static/img/plus-icon.png b/cms/static/img/plus-icon.png
new file mode 100644
index 0000000000..3ffa4f2f69
Binary files /dev/null and b/cms/static/img/plus-icon.png differ
diff --git a/cms/static/img/search-icon.png b/cms/static/img/search-icon.png
new file mode 100644
index 0000000000..7368f803d5
Binary files /dev/null and b/cms/static/img/search-icon.png differ
diff --git a/cms/static/img/sequence-icon.png b/cms/static/img/sequence-icon.png
new file mode 100644
index 0000000000..f95065b5eb
Binary files /dev/null and b/cms/static/img/sequence-icon.png differ
diff --git a/cms/static/img/slides-icon.png b/cms/static/img/slides-icon.png
new file mode 100644
index 0000000000..e1dae5185b
Binary files /dev/null and b/cms/static/img/slides-icon.png differ
diff --git a/cms/static/img/textbook-icon.png b/cms/static/img/textbook-icon.png
new file mode 100644
index 0000000000..11e4abb363
Binary files /dev/null and b/cms/static/img/textbook-icon.png differ
diff --git a/cms/static/img/video-icon.png b/cms/static/img/video-icon.png
new file mode 100644
index 0000000000..5f8c930d16
Binary files /dev/null and b/cms/static/img/video-icon.png differ
diff --git a/cms/static/img/video-module.png b/cms/static/img/video-module.png
new file mode 100644
index 0000000000..2a0c340d47
Binary files /dev/null and b/cms/static/img/video-module.png differ
diff --git a/cms/static/sass/_base.scss b/cms/static/sass/_base.scss
index 937e3895ac..373683fd76 100644
--- a/cms/static/sass/_base.scss
+++ b/cms/static/sass/_base.scss
@@ -5,6 +5,8 @@ $body-font-family: "Open Sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida
$sans-serif: "Open Sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
$body-font-size: 14px;
$body-line-height: 20px;
+$blue: #5597dd;
+
$light-blue: #f0f7fd;
$dark-blue: #50545c;
@@ -28,128 +30,1007 @@ $error-red: rgb(253, 87, 87);
text-shadow: none;
}
-// Base html styles
-html {
- height: 100%;
+
+// -------------------------------------
+//
+// Universal
+//
+// -------------------------------------
+
+body {
+ min-width: 980px;
+ background: #f3f4f5;
+ font-family: 'Open Sans', sans-serif;
+ font-size: 16px;
+ line-height: 1.6;
+ color: #3c3c3c;
}
a {
- text-decoration: none;
- color: #888;
- @include transition;
+ text-decoration: none;
+ color: $blue;
+ -webkit-transition: color .15s;
- &:hover {
- color: #ccc;
- }
+ &:hover {
+ color: #cb9c40;
+ }
}
-input {
- font-family: $body-font-family;
+h1 {
+ font-size: 28px;
+ margin: 36px 6px;
}
-button, input[type="submit"], .button {
- background-color: $orange;
- border: 1px solid darken($orange, 15%);
- @include border-radius(4px);
- @include box-shadow(inset 0 0 0 1px adjust-hue($orange, 20%), 0 1px 0 #fff);
- color: #fff;
- font-weight: bold;
- @include linear-gradient(adjust-hue($orange, 8%), $orange);
- padding: 6px 20px;
- text-shadow: 0 1px 0 darken($orange, 10%);
- -webkit-font-smoothing: antialiased;
-
- &:hover, &:focus {
- @include box-shadow(inset 0 0 6px 1px adjust-hue($orange, 30%));
- }
+.main-wrapper {
+ position: relative;
+ margin: 0 40px;
}
-#{$all-text-inputs}, textarea {
- border: 1px solid $dark-blue;
- @include box-shadow(inset 0 3px 6px $light-blue);
- color: lighten($dark-blue, 30%);
- font: $body-font-size $body-font-family;
- outline: none;
- padding: 4px 6px;
-
- &:hover {
- background: lighten($yellow, 13%);
- color: $dark-blue;
- }
-
- &:focus {
- @include box-shadow(inset 0 3px 6px $light-blue, 0 0 3px lighten($bright-blue, 10%));
- color: $dark-blue;
- background: lighten($yellow, 13%);
- }
+.inner-wrapper {
+ position: relative;
+ max-width: 1280px;
+ margin: auto;
}
-textarea {
- @include box-sizing(border-box);
- display: block;
- line-height: lh();
- padding: 15px;
- width: 100%;
+.window {
+ background: #fff;
+ border: 1px solid #8891a1;
+ border-radius: 3px;
+ box-shadow: 0 1px 2px rgba(0, 0, 0, .1);
}
-// Extends
-.new-module {
- position: relative;
-
- a {
- padding: 6px;
- display: block;
- }
-
- ul.new-dropdown {
- list-style: none;
- position: absolute;
-
- li {
- display: none;
- padding: 6px;
- }
-
- }
-
- &:hover {
- ul.new-dropdown {
- display: block;
- }
- }
+.sidebar {
+ float: right;
+ width: 28%;
}
-.draggable {
- background: url('../img/drag-handle.png') no-repeat center;
- text-indent: -9999px;
- display: block;
- cursor: move;
- height: 100%;
- padding: 0;
- @include position(absolute, 0px 0px 0 0);
- width: 30px;
- z-index: 99;
+footer {
+ clear: both;
+ height: 100px;
}
-.editable {
- &:hover {
- background: lighten($yellow, 10%);
- }
-
- button {
- padding: 4px 10px;
- }
+@mixin clearfix {
+ &:after {
+ content: '';
+ display: block;
+ height: 0;
+ visibility: hidden;
+ clear: both;
+ }
}
-.wip {
- outline: 1px solid #f00 !important;
- position: relative;
- &:after {
- content: "WIP";
- font-size: 8px;
- padding: 2px;
- background: #f00;
- color: #fff;
- @include position(absolute, 0px 0px 0 0);
- }
+input[type="text"] {
+ padding: 6px 8px 8px;
+ box-sizing: border-box;
+ border: 1px solid #b0b6c2;
+ border-radius: 2px;
+ background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0), rgba(255, 255, 255, .3)) #edf1f5;
+ box-shadow: 0 1px 2px rgba(0, 0, 0, .1) inset;
+ font-family: 'Open Sans', sans-serif;
+ font-size: 11px;
+ color: #3c3c3c;
+ outline: 0;
+
+ &::-webkit-input-placeholder {
+ color: #979faf;
+ }
}
+
+input.search {
+ padding: 6px 15px 8px 30px;
+ box-sizing: border-box;
+ border: 1px solid #b0b6c2;
+ border-radius: 20px;
+ background: url(../img/search-icon.png) no-repeat 8px 7px #edf1f5;
+ font-family: 'Open Sans', sans-serif;
+ color: #3c3c3c;
+ outline: 0;
+
+ &::-webkit-input-placeholder {
+ color: #979faf;
+ }
+}
+
+label {
+ font-size: 12px;
+}
+
+@mixin blue-button {
+ display: inline-block;
+ padding: 4px 20px 6px;
+ border: 1px solid #437fbf;
+ border-radius: 3px;
+ background: -webkit-linear-gradient(top, rgba(255, 255, 255, .3), rgba(255, 255, 255, 0)) $blue;
+ box-shadow: 0 1px 0 rgba(255, 255, 255, .3) inset;
+ font-size: 14px;
+ font-weight: 700;
+ color: #fff;
+}
+
+@mixin white-button {
+ display: inline-block;
+ padding: 4px 20px 6px;
+ border: 1px solid #8891a1;
+ border-radius: 3px;
+ background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0) 60%) #dfe5eb;
+ box-shadow: 0 1px 0 rgba(255, 255, 255, .3) inset;
+ font-size: 14px;
+ font-weight: 700;
+ color: #8891a1;
+}
+
+@mixin orange-button {
+ display: inline-block;
+ padding: 4px 20px 6px;
+ border: 1px solid #3c3c3c;
+ border-radius: 3px;
+ background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.4), rgba(255, 255, 255, 0) 60%) #edbd3c;
+ box-shadow: 0 1px 0 rgba(255, 255, 255, .3) inset;
+ font-size: 14px;
+ font-weight: 700;
+ color: #3c3c3c;
+}
+
+
+
+
+
+// -------------------------------------
+//
+// Courseware
+//
+// -------------------------------------
+
+input.courseware-unit-search-input {
+ position: absolute;
+ right: 0;
+ top: 5px;
+ width: 260px;
+ background-color: #fff;
+}
+
+.courseware-overview {
+ .new-courseware-section-button {
+ display: block;
+ padding: 12px 0;
+ border-radius: 3px;
+ border: 1px solid #8891a1;
+ background: -webkit-linear-gradient(top, rgba(255, 255, 255, .3), rgba(255, 255, 255, 0)) #d1dae3;
+ font-size: 14px;
+ font-weight: 700;
+ text-align: center;
+ color: #6d788b;
+ box-shadow: 0 1px 2px rgba(0, 0, 0, .1);
+ }
+}
+
+.courseware-section {
+ position: relative;
+ background: #fff;
+ border: 1px solid #8891a1;
+ border-radius: 3px;
+ margin: 10px 0;
+ padding-bottom: 12px;
+ box-shadow: 0 1px 2px rgba(0, 0, 0, .1);
+
+ &:first-child {
+ margin-top: 0;
+ }
+
+ &.collapsed {
+ padding-bottom: 0;
+
+ header {
+ height: 47px;
+ }
+
+ h4 {
+ display: none;
+ }
+ }
+
+ &.collapsed > ol,
+ .collapsed > ol {
+ display: none;
+ }
+
+ .publish-date {
+ position: absolute;
+ left: -60px;
+ top: 0;
+ width: 40px;
+ height: 40px;
+ background: url(../img/date-circle.png) no-repeat;
+ font-size: 12px;
+ text-align: center;
+
+ .month,
+ .day {
+ position: absolute;
+ display: block;
+ width: 40px;
+ line-height: 0;
+ }
+
+ .month {
+ top: 10px;
+ font-size: 9px;
+ font-weight: 700;
+ color: #f3f4f5;
+ }
+
+ .day {
+ top: 25px;
+ font-size: 16px;
+ font-weight: 700;
+ color: #b0b6c2;
+ }
+ }
+
+ header {
+ height: 67px;
+
+ .item-actions {
+ margin-top: 11px;
+ margin-right: 12px;
+
+ .edit-button,
+ .delete-button {
+ margin-top: -3px;
+ }
+ }
+
+ .expand-collapse-icon {
+ float: left;
+ margin: 16px 6px 16px 16px;
+ }
+
+ .drag-handle {
+ margin-left: 19px;
+ }
+ }
+
+ h3 {
+ font-size: 16px;
+ font-weight: 700;
+ color: $blue;
+ }
+
+ h4 {
+ font-size: 12px;
+ color: #878e9d;
+
+ strong {
+ font-weight: 700;
+ }
+ }
+
+ > ol {
+ margin: 0 12px;
+ border: 1px solid #ced2db;
+ }
+
+ ol {
+ .section-item {
+ display: block;
+ padding: 6px 8px 8px 16px;
+ background: #edf1f5;
+ font-size: 13px;
+
+ &:hover {
+ background: #fffcf1;
+
+ .item-actions {
+ display: block;
+ }
+ }
+
+ &.new-unit-item {
+ font-weight: 700;
+ color: #6d788b;
+
+ &:hover {
+ background: #d1dae3;
+ }
+ }
+
+ .draft-item {
+ color: #a4aab7;
+ }
+
+ .item-actions {
+ display: none;
+ }
+ }
+
+ a {
+ color: #2c2e33;
+ }
+ }
+
+ ol ol {
+ .section-item {
+ padding-left: 56px;
+ }
+ }
+
+ ol ol ol {
+ .section-item {
+ padding-left: 96px;
+ }
+ }
+}
+
+.item-actions {
+ float: right;
+
+ .edit-button,
+ .delete-button {
+ float: left;
+ margin-right: 6px;
+ color: #a4aab7;
+ }
+}
+
+.item-details {
+ float: left;
+ padding: 10px 0;
+}
+
+
+.unit-library {
+ float: right;
+ width: 28%;
+ padding-bottom: 12px;
+ border: 1px solid #8891a1;
+ border-radius: 3px;
+ background: #fff;
+ box-shadow: 0 1px 2px rgba(0, 0, 0, .1);
+
+ h2 {
+ font-weight: 700;
+ margin: 14px;
+ }
+
+ .list-search {
+ margin: 0 12px 8px;
+ }
+
+ .list-search-input {
+ width: 100%;
+ padding: 6px 15px 8px 30px;
+ box-sizing: border-box;
+ border: 1px solid #b0b6c2;
+ border-radius: 20px;
+ background: url(../img/search-icon.png) no-repeat 8px 7px #edf1f5;
+ font-family: 'Open Sans', sans-serif;
+ color: #3c3c3c;
+ outline: 0;
+
+ &::-webkit-input-placeholder {
+ color: #979faf;
+ }
+ }
+
+ .list-wrapper {
+ height: 500px;
+ margin: 0 12px;
+ border: 1px solid #ced2db;
+ overflow-y: scroll;
+ }
+
+ ul {
+ .section-item {
+ display: block;
+ padding: 6px 8px 8px 10px;
+ background: #edf1f5;
+ font-size: 13px;
+
+ &:hover {
+ background: #fffcf1;
+
+ .item-actions {
+ display: block;
+ }
+ }
+
+ &.new-unit-item {
+ font-weight: 700;
+ color: #6d788b;
+
+ &:hover {
+ background: #d1dae3;
+ }
+ }
+
+ .item-actions {
+ display: none;
+ }
+ }
+
+ a {
+ color: #2c2e33;
+ }
+ }
+}
+
+
+
+
+
+// -------------------------------------
+//
+// Unit Editor
+//
+// -------------------------------------
+
+.unit .main-wrapper {
+ margin: 40px;
+}
+
+.unit-body {
+ float: left;
+ width: 70%;
+
+ .breadcrumbs {
+ border-radius: 3px 3px 0 0;
+ border-bottom: 1px solid #cbd1db;
+ background: -webkit-linear-gradient(top, rgba(255, 255, 255, .3), rgba(255, 255, 255, 0) 70%) #edf1f5;
+ box-shadow: 0 1px 0 rgba(255, 255, 255, .7) inset;
+ @include clearfix;
+
+ li {
+ float: left;
+ }
+
+ a,
+ .current-page {
+ display: block;
+ padding: 15px 35px 15px 30px;
+ font-size: 14px;
+ background: url(../img/breadcrumb-arrow.png) no-repeat right center;
+ }
+ }
+
+ h2 {
+ margin: 30px 40px;
+ color: #646464;
+ font-size: 19px;
+ font-weight: 300;
+ letter-spacing: 1px;
+ text-transform: uppercase;
+ }
+
+ .components {
+ > li {
+ position: relative;
+ z-index: 10;
+ margin: 20px 40px;
+ border: 1px solid #d1ddec;
+ border-radius: 3px;
+ background: #fff;
+ -webkit-transition: border-color .15s;
+
+ &:hover {
+ border-color: #6696d7;
+
+ .drag-handle,
+ .component-actions {
+ opacity: 1;
+ }
+ }
+
+ &.editing {
+ border-color: #6696d7;
+
+ &:hover {
+ .drag-handle,
+ .component-actions {
+ opacity: 0;
+ }
+ }
+ }
+
+ .rendered-component {
+ padding: 20px;
+ }
+
+ .component-actions {
+ position: absolute;
+ top: 4px;
+ right: 4px;
+ opacity: 0;
+ -webkit-transition: opacity .15s;
+ }
+
+ .edit-button,
+ .delete-button {
+ float: left;
+ padding: 3px 10px 4px;
+ margin-left: 3px;
+ border: 1px solid #fff;
+ border-radius: 3px;
+ background: $blue;
+ font-size: 12px;
+ color: #fff;
+ -webkit-transition: all .15s;
+
+ &:hover {
+ background-color: $blue;
+ color: #fff;
+ }
+
+ .edit-icon,
+ .delete-icon {
+ margin-right: 4px;
+ }
+ }
+
+ .drag-handle {
+ position: absolute;
+ display: block;
+ top: -1px;
+ right: -16px;
+ z-index: -1;
+ width: 15px;
+ height: 100%;
+ border-radius: 0 3px 3px 0;
+ border: 1px solid $blue;
+ background: url(../img/drag-handles.png) center no-repeat $blue;
+ cursor: move;
+ opacity: 0;
+ -webkit-transition: opacity .15s;
+ }
+
+ &.new-component-item {
+ padding: 0;
+ border: 1px solid #8891a1;
+ border-radius: 3px;
+ background: -webkit-linear-gradient(top, rgba(255, 255, 255, .3), rgba(255, 255, 255, 0)) #d1dae3;
+ box-shadow: 0 1px 0 rgba(255, 255, 255, .2) inset;
+ -webkit-transition: background-color .15s, border-color .15s;
+
+ &.adding {
+ background-color: $blue;
+ border-color: #437fbf;
+ }
+
+ .new-component-button {
+ display: block;
+ padding: 20px;
+ text-align: center;
+ color: #6d788b;
+ }
+
+ h5 {
+ margin-bottom: 8px;
+ color: #fff;
+ font-weight: 700;
+ }
+
+ .rendered-component {
+ display: none;
+ background: #fff;
+ border-radius: 3px 3px 0 0;
+ }
+
+ .new-component-type {
+ @include clearfix;
+
+ a {
+ position: relative;
+ float: left;
+ width: 100px;
+ height: 100px;
+ margin-right: 10px;
+ border-radius: 8px;
+ font-size: 13px;
+ line-height: 14px;
+ color: #fff;
+ text-align: center;
+ box-shadow: 0 1px 1px rgba(0, 0, 0, .4), 0 1px 0 rgba(255, 255, 255, .4) inset;
+ -webkit-transition: background-color .15s;
+
+ &:hover {
+ background-color: rgba(255, 255, 255, .2);
+ }
+
+ .name {
+ position: absolute;
+ bottom: 5px;
+ left: 0;
+ width: 100%;
+ padding: 10px;
+ box-sizing: border-box;
+ }
+ }
+ }
+
+ .new-component-step-1,
+ .new-component-step-2 {
+ display: none;
+ padding: 20px;
+ }
+ }
+ }
+
+ .video-unit img,
+ .discussion-unit img {
+ width: 100%;
+ }
+ }
+
+ .component-editor,
+ .new-component-step-2 {
+ display: none;
+ padding: 20px;
+ background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, .1)) $blue;
+
+ h5 {
+ margin-bottom: 8px;
+ color: #fff;
+ font-weight: 700;
+ }
+
+ textarea {
+ width: 100%;
+ min-height: 80px;
+ padding: 10px;
+ box-sizing: border-box;
+ border: 1px solid #3c3c3c;
+ font-family: Monaco, monospace;
+ }
+
+ .save-button {
+ @include orange-button;
+ margin-right: 8px;
+ }
+
+ .cancel-button {
+ @include blue-button;
+ border-color: #30649c;
+ }
+ }
+}
+
+.unit-properties,
+.unit-history {
+ margin-bottom: 20px;
+
+ .window-contents {
+ padding: 20px;
+ }
+
+ h4 {
+ padding: 6px 14px;
+ border-bottom: 1px solid #cbd1db;
+ border-radius: 3px 3px 0 0;
+ background: -webkit-linear-gradient(top, rgba(255, 255, 255, .3), rgba(255, 255, 255, 0) 70%) #edf1f5;
+ box-shadow: 0 1px 0 rgba(255, 255, 255, .7) inset;
+ font-size: 14px;
+ font-weight: 600;
+ }
+
+ .row {
+ margin-bottom: 15px;
+ }
+
+ input[type="text"] {
+ display: block;
+ width: 100%;
+ }
+
+ .visibility-options .option {
+ margin-right: 10px;
+ padding: 3px 13px 6px;
+ border-radius: 3px;
+ background: #edf1f5;
+
+ &.checked {
+ background: #d1dae3;
+ }
+
+ input[type="radio"] {
+ margin-right: 7px;
+ }
+ }
+
+ .save-button {
+ @include blue-button;
+ margin-top: 10px;
+ }
+
+ .publish-button {
+ @include orange-button;
+ margin-top: 10px;
+ border-color: #bda046;
+ }
+}
+
+.unit-properties {
+ .window-contents {
+ padding: 10px 20px;
+ }
+}
+
+.unit-history {
+ &.collapsed {
+ h4 {
+ border-bottom: none;
+ border-radius: 3px;
+ }
+
+ .window-contents {
+ display: none;
+ }
+ }
+
+ ol {
+ border: 1px solid #ced2db;
+
+ li {
+ display: block;
+ padding: 6px 8px 8px 10px;
+ background: #edf1f5;
+ font-size: 12px;
+
+ &:hover {
+ background: #fffcf1;
+
+ .item-actions {
+ display: block;
+ }
+ }
+
+ &.checked {
+ background: #d1dae3;
+ }
+
+ .item-actions {
+ display: none;
+ }
+
+ input[type="radio"] {
+ margin-right: 7px;
+ }
+ }
+ }
+}
+
+
+
+
+
+// -------------------------------------
+//
+// Icons / Tags
+//
+// -------------------------------------
+
+.expand-collapse-icon {
+ position: relative;
+ display: inline-block;
+ width: 9px;
+ height: 11px;
+ margin-right: 10px;
+ background: url(../img/expand-collapse-icons.png) no-repeat;
+
+ &.expand {
+ top: 1px;
+ background-position: 0 0;
+ }
+
+ &.collapse {
+ top: -1px;
+ background-position: 0 -11px;
+ }
+}
+
+.sequence-icon {
+ display: inline-block;
+ width: 15px;
+ height: 9px;
+ margin-right: 5px;
+ background: url(../img/sequence-icon.png) no-repeat;
+}
+
+.video-icon {
+ display: inline-block;
+ width: 14px;
+ height: 12px;
+ margin-right: 5px;
+ background: url(../img/video-icon.png) no-repeat;
+}
+
+.list-icon {
+ display: inline-block;
+ width: 14px;
+ height: 10px;
+ margin-right: 5px;
+ background: url(../img/list-icon.png) no-repeat;
+}
+
+.edit-icon {
+ display: inline-block;
+ width: 12px;
+ height: 12px;
+ margin-right: 2px;
+ background: url(../img/edit-icon.png) no-repeat;
+
+ &.white {
+ background: url(../img/edit-icon-white.png) no-repeat;
+ }
+}
+
+.delete-icon {
+ display: inline-block;
+ width: 10px;
+ height: 11px;
+ margin-right: 2px;
+ background: url(../img/delete-icon.png) no-repeat;
+
+ &.white {
+ background: url(../img/delete-icon-white.png) no-repeat;
+ }
+}
+
+.drag-handle {
+ display: inline-block;
+ float: right;
+ width: 7px;
+ height: 22px;
+ margin-left: 10px;
+ background: url(../img/drag-handles.png) no-repeat;
+ cursor: move;
+}
+
+.draft-tag,
+.publish-flag {
+ margin-left: 3px;
+ font-size: 9px;
+ font-weight: 600;
+ text-transform: uppercase;
+ color: #a4aab7;
+}
+
+.plus-icon {
+ display: inline-block;
+ width: 11px;
+ height: 11px;
+ margin-right: 8px;
+ background: url(../img/plus-icon.png) no-repeat;
+}
+
+.textbook-icon {
+ display: inline-block;
+ width: 32px;
+ height: 32px;
+ margin-right: 8px;
+ vertical-align: middle;
+ background: url(../img/textbook-icon.png) no-repeat;
+}
+
+.slides-icon {
+ display: inline-block;
+ width: 32px;
+ height: 32px;
+ margin-right: 8px;
+ vertical-align: middle;
+ background: url(../img/slides-icon.png) no-repeat;
+}
+
+.large-slide-icon {
+ display: inline-block;
+ width: 100px;
+ height: 60px;
+ margin-right: 5px;
+ background: url(../img/large-slide-icon.png) center no-repeat;
+}
+
+.large-textbook-icon {
+ display: inline-block;
+ width: 100px;
+ height: 60px;
+ margin-right: 5px;
+ background: url(../img/large-textbook-icon.png) center no-repeat;
+}
+
+.large-discussion-icon {
+ display: inline-block;
+ width: 100px;
+ height: 60px;
+ margin-right: 5px;
+ background: url(../img/large-discussion-icon.png) center no-repeat;
+}
+
+.large-freeform-icon {
+ display: inline-block;
+ width: 100px;
+ height: 60px;
+ margin-right: 5px;
+ background: url(../img/large-freeform-icon.png) center no-repeat;
+}
+
+.large-problem-icon {
+ display: inline-block;
+ width: 100px;
+ height: 60px;
+ margin-right: 5px;
+ background: url(../img/large-problem-icon.png) center no-repeat;
+}
+
+.large-video-icon {
+ display: inline-block;
+ width: 100px;
+ height: 60px;
+ margin-right: 5px;
+ background: url(../img/large-video-icon.png) center no-repeat;
+}
+
+
+
+
+// -------------------------------------
+//
+// Modal
+//
+// -------------------------------------
+
+.modal-cover {
+ display: none;
+ position: fixed;
+ top: 0;
+ left: 0;
+ z-index: 1000;
+ width: 100%;
+ height: 100%;
+ background: rgba(0, 0, 0, .8);
+}
+
+.history-modal {
+ display: none;
+ position: fixed;
+ top: 60px;
+ left: 50%;
+ z-index: 1001;
+ width: 930px;
+ height: 540px;
+ margin-left: -465px;
+ background: #fff;
+
+ .modal-body {
+ height: 400px;
+ padding: 40px;
+ overflow-y: scroll;
+ }
+
+ .modal-actions {
+ height: 60px;
+ background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0)) #d1dae3;
+ }
+
+ h2 {
+ margin: 0 10px 30px;
+ color: #646464;
+ font-size: 19px;
+ font-weight: 300;
+ letter-spacing: 1px;
+ text-transform: uppercase;
+ }
+
+ p {
+ margin: 20px;
+ }
+
+ .revert-button {
+ @include blue-button;
+ margin: 13px 6px 0 13px;
+ }
+
+ .close-button {
+ @include white-button;
+ margin-top: 13px;
+ }
+}
+
+
diff --git a/cms/static/sass/_reset.scss b/cms/static/sass/_reset.scss
new file mode 100644
index 0000000000..6b4b653e87
--- /dev/null
+++ b/cms/static/sass/_reset.scss
@@ -0,0 +1,57 @@
+html, body, div, span, applet, object, iframe,
+h1, h2, h3, h4, h5, h6, p, blockquote, pre,
+a, abbr, acronym, address, big, cite, code,
+del, dfn, em, img, ins, kbd, q, s, samp,
+small, strike, strong, sub, sup, tt, var,
+b, u, i, center,
+dl, dt, dd, ol, ul, li,
+fieldset, form, label, legend,
+table, caption, tbody, tfoot, thead, tr, th, td,
+article, aside, canvas, details, figcaption, figure,
+footer, header, hgroup, menu, nav, section, summary,
+time, mark, audio, video {
+ margin: 0;
+ padding: 0;
+ border: 0;
+ outline: 0;
+ font-size: 100%;
+ font: inherit;
+ vertical-align: baseline;
+}
+/* HTML5 display-role reset for older browsers */
+article, aside, details, figcaption, figure,
+footer, header, hgroup, menu, nav, section {
+ display: block;
+}
+body {
+ line-height: 1;
+}
+ol, ul {
+ list-style: none;
+}
+blockquote, q {
+ quotes: none;
+}
+blockquote:before, blockquote:after,
+q:before, q:after {
+ content: '';
+ content: none;
+}
+
+/* remember to define visible focus styles!
+:focus {
+ outline: ?????;
+} */
+
+/* remember to highlight inserts somehow! */
+ins {
+ text-decoration: none;
+}
+del {
+ text-decoration: line-through;
+}
+
+table {
+ border-collapse: collapse;
+ border-spacing: 0;
+}
\ No newline at end of file
diff --git a/cms/static/sass/base-style.scss b/cms/static/sass/base-style.scss
index 49a51a59fb..f30d8cde3a 100644
--- a/cms/static/sass/base-style.scss
+++ b/cms/static/sass/base-style.scss
@@ -2,6 +2,7 @@
@import 'vendor/normalize';
@import 'keyframes';
+@import 'reset';
@import 'base', 'layout', 'content-types';
@import 'calendar';
@import 'section', 'unit', 'index';
diff --git a/cms/templates/overview.html b/cms/templates/overview.html
new file mode 100644
index 0000000000..cdfbe81917
--- /dev/null
+++ b/cms/templates/overview.html
@@ -0,0 +1,1002 @@
+<%inherit file="base.html" />
+<%block name="title">CMS Courseware Overview
+<%include file="widgets/header.html"/>
+
+<%block name="content">
+
+
+
Courseware
+
+
+ New Section
+
+
+
+
+
Incremental Analysis
+
+
+ -
+
+ New Unit
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
Published: 9/18/2012 at 12:00am EST
+
+ -
+
+
+ -
+
+
+ -
+
+
+ -
+
+
+
+
+ -
+
+
+ -
+
+
+ -
+
+
+ -
+
+
+
+
+ -
+
+
+ -
+
+
+ -
+
+
+ -
+
+
+
+
+ -
+
+
+ -
+
+
+ -
+
+
+ -
+
+
+ -
+
+
+
+
+ -
+
+
+ -
+
+
+
+
+
+
+
+
+