diff --git a/src/plugins/displayLayout/components/LayoutFrame.vue b/src/plugins/displayLayout/components/LayoutFrame.vue index d0820ee71f..2f4e5bd9de 100644 --- a/src/plugins/displayLayout/components/LayoutFrame.vue +++ b/src/plugins/displayLayout/components/LayoutFrame.vue @@ -59,13 +59,6 @@ > *:first-child { flex: 1 1 auto; } - - &:not(.no-frame) { - background: $colorBodyBg; - border: $browseFrameBorder; - padding: $interiorMargin; - } - } .c-frame-edit { @@ -162,7 +155,6 @@ .is-editing { .c-frame { - $moveBarOutDelay: 500ms; &.no-frame { border: $editFrameBorder; // Base border style for a frame element while editing. } @@ -196,13 +188,25 @@ } } - .l-layout__frame:not(.is-resizing) { + .l-layout__frame[s-selected]:not(.is-resizing) { // Show and animate the __move bar for sub-object views with complex content + > .c-so-view.has-complex-content { + > .c-so-view__local-controls { + transition: transform 250ms ease-in-out; + transition-delay: $moveBarOutDelay; + } + } + &:hover > .c-so-view.has-complex-content { // Move content down so the __move bar doesn't cover it. padding-top: $editFrameMovebarH; transition: $transIn; + > .c-so-view__local-controls { + transition: transform 50ms ease-in-out; + transform: translateY($editFrameMovebarH); + } + &.c-so-view--no-frame { // Move content down with a bit more space padding-top: $editFrameMovebarH + $interiorMarginSm; diff --git a/src/plugins/flexibleLayout/components/flexibleLayout.vue b/src/plugins/flexibleLayout/components/flexibleLayout.vue index 5a03bff497..974c37950a 100644 --- a/src/plugins/flexibleLayout/components/flexibleLayout.vue +++ b/src/plugins/flexibleLayout/components/flexibleLayout.vue @@ -106,9 +106,6 @@ .c-fl { @include abs(); display: flex; - flex-direction: column; // TEMP: only needed to support temp-toolbar element - - > * + * { margin-top: $interiorMargin; } .temp-toolbar { flex: 0 0 auto; @@ -292,11 +289,6 @@ margin-bottom: $interiorMargin; } - &__object-view { - flex: 1 1 auto; - overflow: auto; - } - &__size-indicator { $size: 35px; diff --git a/src/plugins/tabs/components/tabs.vue b/src/plugins/tabs/components/tabs.vue index 9f35b01f27..ffa011e026 100644 --- a/src/plugins/tabs/components/tabs.vue +++ b/src/plugins/tabs/components/tabs.vue @@ -25,7 +25,7 @@
+ :class="{'c-tabs-view__object-holder--hidden': !isCurrent(tab)}">
@@ -68,6 +68,14 @@ flex: 1 1 auto; display: flex; flex-direction: column; + + &--hidden { + height: 1000px; + width: 1000px; + position: absolute; + left: -9999px; + top: -9999px; + } } &__object-name { @@ -78,7 +86,10 @@ } &__object { + display: flex; + flex-flow: column nowrap; flex: 1 1 auto; + height: 0; // Chrome 73 oveflow bug fix } &__empty-message { diff --git a/src/plugins/tabs/plugin.js b/src/plugins/tabs/plugin.js index d9d5e5e316..8ab13bffce 100644 --- a/src/plugins/tabs/plugin.js +++ b/src/plugins/tabs/plugin.js @@ -31,6 +31,7 @@ define([ openmct.types.addType('tabs', { name: "Tabs View", + description: 'Add multiple objects of any type to this view, and quickly navigate between them with tabs', creatable: true, cssClass: 'icon-tabs-view', initialize(domainObject) { diff --git a/src/plugins/telemetryTable/components/table-column-header.vue b/src/plugins/telemetryTable/components/table-column-header.vue index 88bd0a4f43..55e0a60840 100644 --- a/src/plugins/telemetryTable/components/table-column-header.vue +++ b/src/plugins/telemetryTable/components/table-column-header.vue @@ -34,39 +34,13 @@ isSortable ? 'is-sortable' : '', isSortable && sortOptions.key === headerKey ? 'is-sorting' : '', isSortable && sortOptions.direction].join(' ')"> -
-