From 6ad8a9aced81eadbc116553fd2e29ef3358ca146 Mon Sep 17 00:00:00 2001 From: Tom Giannattasio Date: Wed, 28 Nov 2012 15:10:46 -0500 Subject: [PATCH] most of the styling and function changes made --- cms/static/img/plus-icon-white.png | Bin 0 -> 951 bytes cms/static/sass/_base.scss | 15 +++ cms/static/sass/_courseware.scss | 7 +- cms/static/sass/_graphics.scss | 4 + cms/static/sass/_lms.scss | 2 +- cms/static/sass/_static-pages.scss | 59 ++++++++++ cms/static/sass/_unit.scss | 167 ++++++++++++++--------------- cms/static/sass/_users.scss | 5 - cms/templates/edit-tabs.html | 5 +- cms/templates/overview.html | 2 +- cms/templates/unit.html | 2 +- 11 files changed, 167 insertions(+), 101 deletions(-) create mode 100644 cms/static/img/plus-icon-white.png diff --git a/cms/static/img/plus-icon-white.png b/cms/static/img/plus-icon-white.png new file mode 100644 index 0000000000000000000000000000000000000000..d2c5263f93e7b322e56ec0928080b93f11ea2dfb GIT binary patch literal 951 zcmaJ=O^ee&7>+Esvde;}1$R9RSy^4M`D{}X8f%+m-GC{zE!bo8F>OOPnV3vX+M_pr zfF4BfsvzFQgEzs8c-}uDdKT76x9NJYh9ood@;uM`InUdz2RmDPTNFj@m?wINtlRl_ z?JD`dd!HVXBkj|vmyOr;mP3fbpomIez5o~ZOiP<^WnG!#QnVZ@Tl@jQ?uhA&qniN6a3ju%*t zyi$oTD-}r*s$luh#9QnQm5zSA^hHi8J;pdvST;>lCKVYJk62!oO*pIM}LXa!k4w_<>CXrsG5JW54Fjf&&Xk7{1v2525bHmYs zVOfe9CfE*LXzD6WG#KCa6s_9Ss)kq*G_J|>h9HYg*)SwsESGuG0j}Wc$eji-#0A&8 z@5 li { + margin: 20px 0; + } + + .component { + border: none; + + &:hover { + border: none; + + .drag-handle { + background: url(../img/drag-handles.png) center no-repeat $lightGrey; + } + } + + .drag-handle { + top: 0; + right: 0; + z-index: 11; + width: 35px; + border: none; + background: url(../img/drag-handles.png) center no-repeat $lightGrey; + + &:hover { + background: url(../img/drag-handles.png) center no-repeat $lightGrey; + } + } + + .component-actions { + top: 26px; + right: 44px; + } + + .edit-button, + .delete-button { + // @include grey-button; + border: none; + background: none; + color: $darkGrey; + } + } + + .component.editing { + .xmodule_display { + display: none; + } + } + + .xmodule_display { + padding: 20px 20px 22px; + font-size: 24px; + font-weight: 300; + background: $lightGrey; + } + .static-page-item { position: relative; margin: 10px 0; diff --git a/cms/static/sass/_unit.scss b/cms/static/sass/_unit.scss index 220bec507d..460640a10f 100644 --- a/cms/static/sass/_unit.scss +++ b/cms/static/sass/_unit.scss @@ -54,94 +54,11 @@ position: relative; z-index: 10; margin: 20px 40px; - border: 1px solid #d1ddec; - border-radius: 3px; - background: #fff; - @include transition(none); - - &:hover { - border-color: #6696d7; - - .drag-handle, - .component-actions a { - background-color: $blue; - } - - .drag-handle { - border-color: $blue; - } - } - - &.editing { - border-color: #6696d7; - - .drag-handle, - .component-actions { - display: none; - } - } - - &.component-placeholder { - border-color: #6696d7; - } - - .xmodule_display { - padding: 40px 20px 20px; - } - - .component-actions { - position: absolute; - top: 4px; - right: 4px; - @include transition(opacity .15s); - } - - .edit-button, - .delete-button { - float: left; - padding: 3px 10px 4px; - margin-left: 3px; - border: 1px solid #fff; - border-radius: 3px; - background: #d1ddec; - font-size: 12px; - color: #fff; - @include 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 #d1ddec; - background: url(../img/white-drag-handles.png) center no-repeat #d1ddec; - cursor: move; - @include transition(all .15s); - } &.new-component-item { padding: 0; - border: 1px solid #8891a1; - border-radius: 3px; - @include linear-gradient(top, rgba(255, 255, 255, .3), rgba(255, 255, 255, 0)); - background-color: #d1dae3; - @include box-shadow(0 1px 0 rgba(255, 255, 255, .2) inset); - @include transition(background-color .15s, border-color .15s); + border: none; + border-radius: 0; &.adding { background-color: $blue; @@ -223,8 +140,86 @@ } } + .component { + border: 1px solid #d1ddec; + border-radius: 3px; + background: #fff; + @include transition(none); + + &:hover { + border-color: #6696d7; + + .drag-handle, + .component-actions a { + background-color: $blue; + } + + .drag-handle { + border-color: $blue; + } + } + + &.editing { + border-color: #6696d7; + + .drag-handle, + .component-actions { + display: none; + } + } + + &.component-placeholder { + border-color: #6696d7; + } + + .component-actions { + position: absolute; + top: 4px; + right: 4px; + @include transition(opacity .15s); + } + + .edit-button, + .delete-button { + float: left; + padding: 3px 10px 4px; + margin-left: 3px; + border: 1px solid #fff; + border-radius: 3px; + background: #d1ddec; + font-size: 12px; + color: #fff; + @include 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 #d1ddec; + background: url(../img/white-drag-handles.png) center no-repeat #d1ddec; + cursor: move; + @include transition(all .15s); + } + } + .xmodule_display { - padding: 10px 20px; + padding: 40px 20px 20px; } .component-editor { diff --git a/cms/static/sass/_users.scss b/cms/static/sass/_users.scss index 7c60ee5c3b..bca9b4f2fb 100644 --- a/cms/static/sass/_users.scss +++ b/cms/static/sass/_users.scss @@ -2,11 +2,6 @@ .user-overview { @extend .window; padding: 30px 40px; - - .details { - margin-bottom: 20px; - font-size: 14px; - } } .new-user-button { diff --git a/cms/templates/edit-tabs.html b/cms/templates/edit-tabs.html index 0c89800c21..41dee15a7a 100644 --- a/cms/templates/edit-tabs.html +++ b/cms/templates/edit-tabs.html @@ -21,6 +21,9 @@

Static Tabs

+
+

Here you can add and manage additional pages for your course. These pages will be added to the primary navigation menu alongside Courseware, Course Info, Discussion, etc.

+
    % for id in components: @@ -28,7 +31,7 @@ % endfor
  1. - + New Tab
    2. diff --git a/cms/templates/overview.html b/cms/templates/overview.html index cc0d7e8e32..4a59b7c723 100644 --- a/cms/templates/overview.html +++ b/cms/templates/overview.html @@ -75,7 +75,7 @@

    Courseware

    - New Section + New Section % for section in sections:
    diff --git a/cms/templates/unit.html b/cms/templates/unit.html index a94557b760..f2601c7c7e 100644 --- a/cms/templates/unit.html +++ b/cms/templates/unit.html @@ -33,7 +33,7 @@
  2. % endfor
  3. - + New Component