Commit 9d6d98b3 by Brian Talbot Committed by cahrens

Studio: further outline UI revisions + PR feedback

* syncing up status-release hover states for outline units
* adjusting in-context editor UI for longer outline titles
* corrects outline incontext editor display regression
* cleaning up unit/container sidebar styling
* removing redundant margin on Outline UI subsections
* selecting text when a user focuses into an incontext-editor input - STUD-2032
parent 4ee8256c
......@@ -81,7 +81,7 @@ define(["js/views/baseview", "js/views/utils/xblock_utils"],
event.preventDefault();
event.stopPropagation();
this.$el.addClass('is-editing');
input.focus();
input.focus().select();
},
hideInput: function() {
......
......@@ -479,7 +479,6 @@ $outline-indent-width: $baseline;
.outline-subsection {
@extend %outline-item;
@extend %outline-subsection;
margin-bottom: ($baseline/2);
border: 1px solid $gray-l4;
border-left: ($baseline/4) solid $color-draft;
border-top-left-radius: 0;
......@@ -529,11 +528,6 @@ $outline-indent-width: $baseline;
border: 1px solid $gray-l4;
padding: ($baseline/4) ($baseline/2);
// STATE: hover/active
&:hover, &:active {
box-shadow: 0 1px 1px $shadow-l2;
}
// header - title
.unit-title {
@extend %t-title7;
......@@ -543,5 +537,15 @@ $outline-indent-width: $baseline;
.unit-status {
@extend %outline-item-status;
}
// STATE: hover/active
&:hover, &:active {
box-shadow: 0 1px 1px $shadow-l2;
// status - release
.unit-status .status-release {
opacity: 1.0;
}
}
}
......@@ -117,12 +117,16 @@
@extend %bar-module-blue;
}
// CASE: content is draft
&.draft ,
&.is-draft {
// CASE: content has warnings
&.has-warnings {
@extend %bar-module-yellow;
}
// CASE: content has erors
&.has-errors {
@extend %bar-module-red;
}
// CASE: content is staff only
&.staff-only,
&.is-staff-only {
......@@ -217,6 +221,7 @@
// location widget
.unit-location {
@extend %bar-module;
border-top: none;
.wrapper-unit-id {
......
......@@ -11,6 +11,15 @@
// TODO: abstract out
.is-editable {
.incontext-editor-value, .incontext-editor-action-wrapper {
vertical-align: top;
}
.incontext-editor-value {
max-width: 80%;
margin-right: ($baseline/10);
}
.incontext-editor-open-action {
@include transition(opacity $tmg-f1 ease-in-out 0);
opacity: 0.0;
......
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