diff --git a/cms/static/sass/elements/_modules.scss b/cms/static/sass/elements/_modules.scss index 2ea12140ef..725caf5e47 100644 --- a/cms/static/sass/elements/_modules.scss +++ b/cms/static/sass/elements/_modules.scss @@ -22,10 +22,16 @@ padding: ($baseline*.75) ($baseline*.75) $baseline ($baseline*.75); .title { - @extend %t-title7; - margin-bottom: ($baseline/2); + @extend %t-title8; + margin-bottom: ($baseline/4); font-weight: 600; - color: $gray-d1; + color: $gray-l2; + text-transform: uppercase; + } + + .meta { + @extend %t-copy-sub2; + color: $gray-l1; } } } @@ -40,7 +46,6 @@ } } - // green bar and title bg version %bar-module-green { @extend %bar-module; @@ -51,7 +56,6 @@ } } - // yellow bar and title bg version %bar-module-yellow { @extend %bar-module; @@ -62,8 +66,6 @@ } } - - // red bar and title bg version %bar-module-red { @extend %bar-module; @@ -74,6 +76,16 @@ } } +// black bar and title bg version +%bar-module-black { + @extend %bar-module; + border-top: 5px solid $black; + + .bar-mod-title { + background-color: $gray-l4; + } +} + // Add new component menu with big green buttons // outermost wrapper for add a new component menu .add-xblock-component { diff --git a/cms/static/sass/views/_container.scss b/cms/static/sass/views/_container.scss index e054ee6d03..efc6d2e27e 100644 --- a/cms/static/sass/views/_container.scss +++ b/cms/static/sass/views/_container.scss @@ -117,7 +117,7 @@ } &.staff-only { - @extend %bar-module; + @extend %bar-module-black; } .bar-mod-content { @@ -125,15 +125,7 @@ padding: ($baseline/2) ($baseline*.75) ($baseline*.75) ($baseline*.75); .title { - @extend %t-title8; margin-bottom: ($baseline/10); - text-transform: uppercase; - color: $gray-l3; - } - - .meta { - @extend %t-copy-sub2; - color: $gray-l1; } } @@ -156,8 +148,14 @@ .wrapper-visibility { .copy { + margin-bottom: ($baseline/10); font-weight: 600; } + + .action-inline [class^="icon-"] { + margin: 0 ($baseline/4); + + } } .wrapper-pub-actions { @@ -218,7 +216,6 @@ .unit-id-value { @extend %t-copy-sub1; display: inline-block; - margin: ($baseline/4) 0; } .tip { @@ -235,7 +232,7 @@ display: none; } - // need to explicitly set this since the html sturcture is different than the others + // need to explicitly set this since the html structure is different than the others .section-name:hover { background: $blue-l5; color: $blue; diff --git a/cms/templates/ux/reference/container.html b/cms/templates/ux/reference/container.html index 898759039b..831b6855f4 100644 --- a/cms/templates/ux/reference/container.html +++ b/cms/templates/ux/reference/container.html @@ -1,7 +1,12 @@ <%inherit file="../../base.html" /> + <%! -from django.core.urlresolvers import reverse + import logging + from util.date_utils import get_default_time_display + from django.utils.translation import ugettext as _ + from contentstore.utils import reverse_usage_url %> + <%block name="title">Container <%block name="bodyclass">is-signedin course uploads view-container @@ -11,22 +16,38 @@ from django.core.urlresolvers import reverse <%block name="content">
+
-
-

- - Parent of Unit Page - Unit Page Super Long Title Name Goes Here Yeah Whats Up Parent - Container Name +
+
+ + + Section parent + + Subsection parent -

+
+

Unit Example

+
+
@@ -432,6 +453,236 @@ from django.core.urlresolvers import reverse