From ee42902ee6e5f3a19c6697ac7dea121e53504409 Mon Sep 17 00:00:00 2001
From: Frances Botsford <frances@edx.org>
Date: Wed, 2 Apr 2014 13:41:19 -0400
Subject: [PATCH] removed edit-dialog and uploads css, changed component edit icon to pencil, small css fixes
---
cms/static/sass/elements/_edit_dialog.scss | 129 ---------------------------------------------------------------------------------------------------------------------------------
cms/static/sass/elements/_forms.scss | 1 +
cms/static/sass/elements/_modal-window.scss | 3 ++-
cms/static/sass/elements/_uploads.scss | 215 -----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
cms/static/sass/style-app.scss | 2 --
cms/static/sass/views/_container.scss | 6 +++---
cms/static/sass/views/_outline.scss | 10 ++++++++--
cms/static/sass/views/_unit.scss | 3 ---
cms/templates/component.html | 2 +-
cms/templates/studio_xblock_wrapper.html | 2 +-
10 files changed, 16 insertions(+), 357 deletions(-)
delete mode 100644 cms/static/sass/elements/_edit_dialog.scss
delete mode 100644 cms/static/sass/elements/_uploads.scss
diff --git a/cms/static/sass/elements/_edit_dialog.scss b/cms/static/sass/elements/_edit_dialog.scss
deleted file mode 100644
index 490a74b..0000000
--- a/cms/static/sass/elements/_edit_dialog.scss
+++ /dev/null
@@ -1,129 +0,0 @@
-// studio - elements - editing dialog
-// ========================
-
-body.course.feature-edit-dialog {
-
- // dialog
- .wrapper-dialog {
- @extend %ui-depth5;
- @include transition(all $tmg-f2 ease-in-out);
- position: fixed;
- top: 0;
- background: $black-t2;
- width: 100%;
- height: 100%;
- text-align: center;
-
- &:before {
- content: '';
- display: inline-block;
- height: 100%;
- vertical-align: middle;
- margin-right: -0.25em; /* Adjusts for spacing */
- }
-
- .dialog {
- @include box-sizing(border-box);
- display: inline-block;
- vertical-align: middle;
- width: $baseline*23;
- box-shadow: 0px 0px 7px $shadow-d1;
- border-radius: ($baseline/5);
- background-color: $gray-l4;
- padding: 7px;
- text-align: left;
-
- .title {
- @extend %t-title5;
- margin-bottom: ($baseline/2);
- font-weight: 600;
- color: $black;
- }
-
- .message {
- @extend %t-copy-sub2;
- color: $gray;
- }
-
- .error {
- color: $white;
- }
-
- form {
- padding: 0;
-
- .form-content {
- box-shadow: 0 0 3px $shadow-d1;
- padding: ($baseline*1.5);
- background-color: $white;
- }
-
- .field {
- margin-bottom: ($baseline/2);
- }
-
- label {
- @include font-size(14);
- display: block;
- font-weight: bold;
- }
-
- input[type="text"] {
- @extend %t-copy-sub2;
- }
-
- .actions {
- padding: ($baseline*0.75) $baseline ($baseline/2) $baseline;
-
- .action-item {
- @extend %t-action4;
- display: inline-block;
- margin-right: ($baseline*0.75);
-
- &:last-child {
- margin-right: 0;
- }
- }
-
- .action-primary {
- @include blue-button();
- @include font-size(12); // needed due to bad button mixins for now
- border-color: $blue-d1;
- color: $white;
- }
-
- a {
- color: $blue;
-
- &:hover {
- color: $blue-s2;
- }
- }
- }
- }
- }
- }
-
- // dialog set-up
- .wrapper-dialog {
- visibility: hidden;
- pointer-events: none;
-
- .dialog {
- opacity: 0;
- }
- }
-
- // dialog showing/hiding
- &.dialog-is-shown {
-
- .wrapper-dialog.is-shown {
- visibility: visible;
- pointer-events: auto;
-
- .dialog {
- opacity: 1.0;
- }
- }
- }
-}
diff --git a/cms/static/sass/elements/_forms.scss b/cms/static/sass/elements/_forms.scss
index 4214d94..d1b228b 100644
--- a/cms/static/sass/elements/_forms.scss
+++ b/cms/static/sass/elements/_forms.scss
@@ -60,6 +60,7 @@ textarea.text {
form {
input[type=file] {
+ @include font-size(14);
line-height: 1;
}
diff --git a/cms/static/sass/elements/_modal-window.scss b/cms/static/sass/elements/_modal-window.scss
index 0d223a4..679b9ef 100644
--- a/cms/static/sass/elements/_modal-window.scss
+++ b/cms/static/sass/elements/_modal-window.scss
@@ -104,7 +104,7 @@
}
- // small modals - editors and dialogs
+ // small modals - quick editors and dialogs
.modal-sm {
width: 30%;
min-width: ($baseline*15);
@@ -184,6 +184,7 @@
// component editor
.modal-window {
+
.wrapper-comp-settings {
.list-input {
diff --git a/cms/static/sass/elements/_uploads.scss b/cms/static/sass/elements/_uploads.scss
deleted file mode 100644
index ddb942d..0000000
--- a/cms/static/sass/elements/_uploads.scss
+++ /dev/null
@@ -1,215 +0,0 @@
-// studio - elements - uploads
-// ========================
-
-body.course.feature-upload {
-
- // dialog
- .wrapper-dialog {
- @extend %ui-depth5;
- @include transition(all 0.05s ease-in-out);
- position: fixed;
- top: 0;
- background: $black-t2;
- width: 100%;
- height: 100%;
- text-align: center;
-
- &:before {
- content: '';
- display: inline-block;
- height: 100%;
- vertical-align: middle;
- margin-right: -0.25em; /* Adjusts for spacing */
- }
-
- .dialog {
- @include box-sizing(border-box);
- box-shadow: 0px 0px 7px $shadow-d1;
- border-radius: ($baseline/5);
- background-color: $gray-l4;
- display: inline-block;
- vertical-align: middle;
- width: $baseline*23;
- padding: 7px;
- text-align: left;
-
- .title {
- @extend %t-title5;
- margin-bottom: ($baseline/2);
- font-weight: 600;
- color: $black;
- }
-
- .message {
- @extend %t-copy-sub2;
- color: $gray;
- }
-
- .error {
- color: $white;
- }
-
- form {
- padding: 0;
-
- .form-content {
- box-shadow: 0 0 3px $shadow-d1;
- padding: ($baseline*1.5);
- background-color: $white;
- }
-
- input[type="file"] {
- @extend %t-copy-sub2;
- }
-
- .status-upload {
- height: 30px;
- margin-top: $baseline;
-
- .wrapper-progress {
- box-shadow: inset 0 0 3px $shadow-d1;
- display: block;
- border-radius: ($baseline*0.75);
- background-color: $gray-l5;
- padding: 1px 8px 2px 8px;
- height: 25px;
-
- progress {
- display: inline-block;
- vertical-align: middle;
- width: 100%;
- border: none;
- border-radius: ($baseline*0.75);
- background-color: $gray-l5;
-
- &::-webkit-progress-bar {
- background-color: transparent;
- border-radius: ($baseline*0.75);
- }
-
- &::-webkit-progress-value {
- background-color: $pink;
- border-radius: ($baseline*0.75);
- }
-
- &::-moz-progress-bar {
- background-color: $pink;
- border-radius: ($baseline*0.75);
- }
-
- }
-
- }
-
- .message-status {
- @include border-top-radius(2px);
- @include box-sizing(border-box);
- @include font-size(14);
- display: none;
- border-bottom: 2px solid $yellow;
- margin: 0 0 20px 0;
- padding: 10px 20px;
- font-weight: 500;
- background: $paleYellow;
-
- .text {
- display: inline-block;
- }
-
- &.error {
- border-color: $red-d2;
- background: $red-l1;
- color: $white;
- }
-
- &.confirm {
- border-color: $green-d2;
- background: $green-l1;
- color: $white;
- }
-
- &.is-shown {
- display: block;
- }
- }
- }
-
- .message-status.error {
- border-color: $red-d2;
- background: $red-l1;
- color: $white;
- }
-
- .actions {
- padding: ($baseline*0.75) $baseline ($baseline/2) $baseline;
-
-
-
- .action-item {
- @extend %t-action4;
- display: inline-block;
- margin-right: ($baseline*0.75);
-
- &:last-child {
- margin-right: 0;
- }
- }
-
- .action-primary {
- @include blue-button();
- @include font-size(12); // needed due to bad button mixins for now
- border-color: $blue-d1;
- color: $white;
- }
-
- a {
- color: $blue;
-
- &:hover {
- color: $blue-s2;
- }
- }
-
- }
-
- }
-
- }
-
- }
-
- // ====================
-
- // js enabled
- .js {
-
- // dialog set-up
- .wrapper-dialog {
- visibility: hidden;
- pointer-events: none;
-
- .dialog {
- opacity: 0;
- }
- }
-
- // dialog showing/hiding
- &.dialog-is-shown {
-
- .wrapper-dialog {
- -webkit-filter: blur(2px) grayscale(25%);
- filter: blur(2px) grayscale(25%);
- }
-
- .wrapper-dialog.is-shown {
- visibility: visible;
- pointer-events: auto;
-
- .dialog {
- opacity: 1.0;
- }
- }
- }
-
- }
-}
diff --git a/cms/static/sass/style-app.scss b/cms/static/sass/style-app.scss
index a916bfd..e6cd765 100644
--- a/cms/static/sass/style-app.scss
+++ b/cms/static/sass/style-app.scss
@@ -37,6 +37,4 @@
@import 'elements/system-help'; // help UI
@import 'elements/modal'; // interstitial UI, dialogs, modal windows
@import 'elements/vendor'; // overrides to vendor-provided styling
-@import 'elements/uploads';
-@import 'elements/edit_dialog';
@import 'elements/modal-window';
diff --git a/cms/static/sass/views/_container.scss b/cms/static/sass/views/_container.scss
index 147e419..1275bca 100644
--- a/cms/static/sass/views/_container.scss
+++ b/cms/static/sass/views/_container.scss
@@ -111,13 +111,13 @@ body.view-container .content-primary {
// CASE: nesting level xblock rendering
&.level-nesting {
+ @include transition(all $tmg-f2 linear 0s);
border: none;
padding-bottom: $baseline;
box-shadow: none;
&:hover {
- @include transition(all $tmg-f2 linear 0s);
- background-color: $gray-l7;
+ background-color: $gray-l6;
box-shadow: 0 0 1px $shadow-d2 inset;
}
@@ -142,10 +142,10 @@ body.view-container .content-primary {
// CASE: element level xblock rendering
&.level-element {
+ @include transition(all $tmg-f2 linear 0s);
box-shadow: none;
&:hover {
- @include transition(all $tmg-f2 linear 0s);
border-color: $blue;
}
diff --git a/cms/static/sass/views/_outline.scss b/cms/static/sass/views/_outline.scss
index d718843..35bad8e 100644
--- a/cms/static/sass/views/_outline.scss
+++ b/cms/static/sass/views/_outline.scss
@@ -517,9 +517,10 @@
.field {
float: left;
- margin-right: ($baseline/2);
+ margin: 0 ($baseline/2) ($baseline/2);
- label, input {
+ label,
+ input {
display: block;
text-align: left;
}
@@ -527,6 +528,11 @@
label {
@extend %t-copy-sub1;
margin-bottom: ($baseline/4);
+ font-weight: 600;
+ }
+
+ input[type="text"] {
+ @extend %t-copy-sub1;
}
}
}
diff --git a/cms/static/sass/views/_unit.scss b/cms/static/sass/views/_unit.scss
index fdef130..6d6c6e3 100644
--- a/cms/static/sass/views/_unit.scss
+++ b/cms/static/sass/views/_unit.scss
@@ -1342,7 +1342,6 @@ body.unit .xblock-type-container {
box-shadow: none;
&:hover {
- @include transition(all $tmg-f2 linear 0s);
border-color: $blue;
.container-drag {
@@ -1352,10 +1351,8 @@ body.unit .xblock-type-container {
}
.xblock-header {
- margin-bottom: 0;
border-bottom: 0;
border-radius: ($baseline/5);
- padding: ($baseline/2);
.xblock-details {
font-size: .9em;
diff --git a/cms/templates/component.html b/cms/templates/component.html
index 7d06be0..ce09eb4 100644
--- a/cms/templates/component.html
+++ b/cms/templates/component.html
@@ -34,7 +34,7 @@
<ul class="component-actions">
<li class="action-item action-edit">
<a href="#" class="edit-button action-button">
- <i class="icon-edit"></i>
+ <i class="icon-pencil"></i>
<span class="action-button-text">${_("Edit")}</span>
</a>
</li>
diff --git a/cms/templates/studio_xblock_wrapper.html b/cms/templates/studio_xblock_wrapper.html
index d74142d..c2e447a 100644
--- a/cms/templates/studio_xblock_wrapper.html
+++ b/cms/templates/studio_xblock_wrapper.html
@@ -15,7 +15,7 @@
% if not xblock_context['read_only']:
<li class="action-item action-edit">
<a href="#" class="edit-button action-button">
- <i class="icon-edit"></i>
+ <i class="icon-pencil"></i>
<span class="action-button-text">${_("Edit")}</span>
</a>
</li>
--
libgit2 0.26.0