Commit 5b81d6b8 by Tom Giannattasio Committed by Brian Talbot

cleaned up subsection and unit page

parent 052b6f69
...@@ -74,5 +74,4 @@ class CMS.Views.ModuleEdit extends Backbone.View ...@@ -74,5 +74,4 @@ class CMS.Views.ModuleEdit extends Backbone.View
event.preventDefault() event.preventDefault()
@$el.addClass('editing') @$el.addClass('editing')
@$component_editor().slideDown(150) @$component_editor().slideDown(150)
# $modalCover.show()
@loadEdit() @loadEdit()
...@@ -6,7 +6,7 @@ ...@@ -6,7 +6,7 @@
body { body {
min-width: 980px; min-width: 980px;
background: #eaecf3; background: rgb(240, 241, 245);
font-size: 16px; font-size: 16px;
line-height: 1.6; line-height: 1.6;
color: $baseFontColor; color: $baseFontColor;
...@@ -57,12 +57,6 @@ h1 { ...@@ -57,12 +57,6 @@ h1 {
} }
} }
.window {
background: #fff;
border-radius: 3px;
@include box-shadow(0 1px 1px rgba(0,0,0,0.2), 0 0 0 1px rgba(0, 0, 0, 0.1));
}
.sidebar { .sidebar {
float: right; float: right;
width: 28%; width: 28%;
...@@ -86,7 +80,7 @@ input[type="email"], ...@@ -86,7 +80,7 @@ input[type="email"],
input[type="password"] { input[type="password"] {
padding: 6px 8px 8px; padding: 6px 8px 8px;
@include box-sizing(border-box); @include box-sizing(border-box);
border: 1px solid #b0b6c2; border: 1px solid $mediumGrey;
border-radius: 2px; border-radius: 2px;
@include linear-gradient(top, rgba(255, 255, 255, 0), rgba(255, 255, 255, .3)); @include linear-gradient(top, rgba(255, 255, 255, 0), rgba(255, 255, 255, .3));
background-color: #edf1f5; background-color: #edf1f5;
...@@ -140,7 +134,7 @@ code { ...@@ -140,7 +134,7 @@ code {
min-height: 80px; min-height: 80px;
padding: 10px; padding: 10px;
@include box-sizing(border-box); @include box-sizing(border-box);
border: 1px solid #b0b6c2; border: 1px solid $mediumGrey;
@include linear-gradient(top, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.3)); @include linear-gradient(top, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.3));
background-color: #edf1f5; background-color: #edf1f5;
@include box-shadow(0 1px 2px rgba(0, 0, 0, 0.1) inset); @include box-shadow(0 1px 2px rgba(0, 0, 0, 0.1) inset);
...@@ -190,6 +184,10 @@ code { ...@@ -190,6 +184,10 @@ code {
.window { .window {
margin-bottom: 20px; margin-bottom: 20px;
border: 1px solid $mediumGrey;
border-radius: 3px;
background: #fff;
@include box-shadow(0 1px 1px rgba(0, 0, 0, 0.1));
.window-contents { .window-contents {
padding: 20px; padding: 20px;
...@@ -197,13 +195,13 @@ code { ...@@ -197,13 +195,13 @@ code {
h4 { h4 {
padding: 6px 14px; padding: 6px 14px;
border-bottom: 1px solid #cbd1db; border-bottom: 1px solid $mediumGrey;
border-radius: 3px 3px 0 0; border-radius: 3px 3px 0 0;
@include linear-gradient(top, rgba(255, 255, 255, .3), rgba(255, 255, 255, 0) 70%); @include linear-gradient(top, rgba(255, 255, 255, .4), rgba(255, 255, 255, 0));
background-color: #edf1f5; background-color: $lightBluishGrey;
@include box-shadow(0 1px 0 rgba(255, 255, 255, .7) inset); @include box-shadow(0 1px 0 rgba(255, 255, 255, 0.2) inset);
font-size: 14px; font-size: 14px;
font-weight: 600; text-shadow: 0 1px 0 rgba(255, 255, 255, 0.3);
} }
label { label {
......
...@@ -48,18 +48,19 @@ ...@@ -48,18 +48,19 @@
} }
@mixin white-button { @mixin white-button {
@include button; @include button;
border: 1px solid $darkGrey; border: 1px solid $mediumGrey;
border-radius: 3px; border-radius: 3px;
@include linear-gradient(top, rgba(255, 255, 255, 0.6), rgba(255, 255, 255, 0)); @include linear-gradient(top, rgba(255, 255, 255, 0.6), rgba(255, 255, 255, 0));
background-color: #dfe5eb; background-color: #dfe5eb;
@include box-shadow(0 1px 0 rgba(255, 255, 255, .3) inset); @include box-shadow(0 1px 0 rgba(255, 255, 255, .3) inset);
color: #778192; color: rgb(92, 103, 122);
text-shadow: 0 1px 0 rgba(255, 255, 255, .5);
&:hover {
background-color: #f2f6f9; &:hover {
color: #778192; background-color: rgb(222, 236, 247);
} color: rgb(92, 103, 122);
}
} }
@mixin orange-button { @mixin orange-button {
...@@ -88,6 +89,7 @@ ...@@ -88,6 +89,7 @@
&:hover { &:hover {
background-color: #d9e3ee; background-color: #d9e3ee;
color: #6d788b;
} }
} }
...@@ -130,7 +132,7 @@ ...@@ -130,7 +132,7 @@
@mixin edit-box { @mixin edit-box {
padding: 15px 20px; padding: 15px 20px;
border-radius: 3px; border-radius: 3px;
background-color: $lightBluishGrey; background-color: $lightBluishGrey2;
color: #3c3c3c; color: #3c3c3c;
@include box-shadow(0 1px 0 rgba(255, 255, 255, .2) inset); @include box-shadow(0 1px 0 rgba(255, 255, 255, .2) inset);
...@@ -171,8 +173,8 @@ ...@@ -171,8 +173,8 @@
} }
@mixin tree-view { @mixin tree-view {
border: 1px solid #ced2db; border: 1px solid $mediumGrey;
background: #edf1f5; background: $lightGrey;
.branch { .branch {
margin-bottom: 10px; margin-bottom: 10px;
...@@ -232,7 +234,11 @@ ...@@ -232,7 +234,11 @@
} }
a { a {
color: #2c2e33; color: $baseFontColor;
&.new-unit-item {
color: #6d788b;
}
} }
ol { ol {
......
...@@ -8,9 +8,10 @@ input.courseware-unit-search-input { ...@@ -8,9 +8,10 @@ input.courseware-unit-search-input {
position: relative; position: relative;
background: #fff; background: #fff;
border-radius: 3px; border-radius: 3px;
margin: 15px 0; border: 1px solid $mediumGrey;
margin-top: 15px;
padding-bottom: 12px; padding-bottom: 12px;
@include box-shadow(0 1px 1px rgba(0, 0, 0, .2)); @include box-shadow(0 1px 1px rgba(0, 0, 0, 0.1));
&:first-child { &:first-child {
margin-top: 0; margin-top: 0;
......
...@@ -54,7 +54,7 @@ ...@@ -54,7 +54,7 @@
background: url(../img/drag-handles.png) center no-repeat #fff; background: url(../img/drag-handles.png) center no-repeat #fff;
&:hover { &:hover {
background: url(../img/drag-handles.png) center no-repeat $lightGrey; background: url(../img/drag-handles.png) center no-repeat #fff;
} }
} }
......
...@@ -142,7 +142,7 @@ ...@@ -142,7 +142,7 @@
} }
.component { .component {
border: 1px solid #d1ddec; border: 1px solid $lightBluishGrey2;
border-radius: 3px; border-radius: 3px;
background: #fff; background: #fff;
@include transition(none); @include transition(none);
...@@ -157,6 +157,7 @@ ...@@ -157,6 +157,7 @@
} }
&.editing { &.editing {
border: 1px solid $lightBluishGrey2;
.drag-handle, .drag-handle,
.component-actions { .component-actions {
...@@ -172,11 +173,6 @@ ...@@ -172,11 +173,6 @@
position: absolute; position: absolute;
top: 7px; top: 7px;
right: 9px; right: 9px;
@include transition(opacity .15s);
a {
color: $darkGrey;
}
} }
.drag-handle { .drag-handle {
...@@ -188,10 +184,10 @@ ...@@ -188,10 +184,10 @@
width: 15px; width: 15px;
height: 100%; height: 100%;
border-radius: 0 3px 3px 0; border-radius: 0 3px 3px 0;
border: 1px solid #d1ddec; border: 1px solid $lightBluishGrey2;
background: url(../img/white-drag-handles.png) center no-repeat #d1ddec; background: url(../img/white-drag-handles.png) center no-repeat $lightBluishGrey2;
cursor: move; cursor: move;
@include transition(all .15s); @include transition(none);
} }
} }
...@@ -203,6 +199,7 @@ ...@@ -203,6 +199,7 @@
@include edit-box; @include edit-box;
display: none; display: none;
padding: 20px; padding: 20px;
border-radius: 2px 2px 0 0;
@include box-shadow(none); @include box-shadow(none);
.metadata_edit { .metadata_edit {
......
...@@ -20,7 +20,7 @@ $orange: #edbd3c; ...@@ -20,7 +20,7 @@ $orange: #edbd3c;
$red: #b20610; $red: #b20610;
$green: #108614; $green: #108614;
$lightGrey: #edf1f5; $lightGrey: #edf1f5;
$mediumGrey: #ced2db; $mediumGrey: #b0b6c2;
$darkGrey: #8891a1; $darkGrey: #8891a1;
$extraDarkGrey: #3d4043; $extraDarkGrey: #3d4043;
$paleYellow: #fffcf1; $paleYellow: #fffcf1;
...@@ -28,4 +28,5 @@ $green: rgb(37, 184, 90); ...@@ -28,4 +28,5 @@ $green: rgb(37, 184, 90);
$brightGreen: rgb(22, 202, 87); $brightGreen: rgb(22, 202, 87);
$disabledGreen: rgb(124, 206, 153); $disabledGreen: rgb(124, 206, 153);
$darkGreen: rgb(52, 133, 76); $darkGreen: rgb(52, 133, 76);
$lightBluishGrey: rgb(197, 207, 223); $lightBluishGrey: rgb(197, 207, 223);
\ No newline at end of file $lightBluishGrey2: rgb(213, 220, 228);
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