mirror of
https://github.com/nasa/openmct.git
synced 2024-12-20 13:43:09 +00:00
[Frontend] Merge work in open279 into open199
open #199 open #279 Integrated inspector changes from open279 into new edit mode work from open199; _layout.scss had a bit of difficult conflict resolution but seems good at this point...
This commit is contained in:
Charles Hacskaylo
commit
5dd15e3b20
@ -16,6 +16,7 @@
|
||||
"platform/execution",
|
||||
"platform/telemetry",
|
||||
"platform/features/clock",
|
||||
"platform/features/conductor",
|
||||
"platform/features/imagery",
|
||||
"platform/features/layout",
|
||||
"platform/features/pages",
|
||||
|
||||
@ -43,6 +43,16 @@
|
||||
vertical-align: bottom;
|
||||
}
|
||||
}
|
||||
|
||||
.split-layout {
|
||||
.split-pane-component.pane {
|
||||
&.bottom {
|
||||
height: 30%;
|
||||
min-height: 20%;
|
||||
max-height: 80%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
ul {
|
||||
@include box-sizing(border-box);
|
||||
@ -109,4 +119,10 @@
|
||||
width: 4px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.holder-elements {
|
||||
.current-elements {
|
||||
position: relative;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -67,7 +67,6 @@
|
||||
right: $bodyMargin;
|
||||
bottom: $bodyMargin + $ueFooterH;
|
||||
.tool-bar {
|
||||
border-bottom: 1px solid $colorInteriorBorder;
|
||||
bottom: auto;
|
||||
height: $tbH;
|
||||
line-height: $btnToolbarH;
|
||||
@ -193,7 +192,7 @@
|
||||
|
||||
.split-layout {
|
||||
// Specific elements margins
|
||||
.holder.holder-treeview-elements {
|
||||
.holder.holder-create-and-search {
|
||||
top: $bodyMargin;
|
||||
right: 0;
|
||||
bottom: $bodyMargin;
|
||||
@ -209,12 +208,18 @@
|
||||
top: $bodyMargin;
|
||||
bottom: $bodyMargin;
|
||||
}
|
||||
.holder-inspector-elements {
|
||||
.holder-inspector {
|
||||
top: $bodyMargin;
|
||||
bottom: $bodyMargin;
|
||||
left: $bodyMargin;
|
||||
right: $bodyMargin;
|
||||
}
|
||||
.holder-elements {
|
||||
top: 0;
|
||||
bottom: $bodyMargin;
|
||||
left: $bodyMargin;
|
||||
right: $bodyMargin;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -281,7 +286,6 @@
|
||||
/***************************************************** OBJECT BROWSE BAR */
|
||||
.object-browse-bar {
|
||||
// Converting to use flexbox layout
|
||||
//@include absPosDefault(0, visible); // Must use visible to avoid hiding view switcher menu
|
||||
@include box-sizing(border-box);
|
||||
height: $ueTopBarH;
|
||||
line-height: $ueTopBarH;
|
||||
@ -302,7 +306,7 @@
|
||||
// Sets the left tree menu when the tree is hidden.
|
||||
.tree-holder,
|
||||
.splitter-treeview,
|
||||
.holder-treeview-elements {
|
||||
.holder-create-and-search {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
@ -315,7 +319,7 @@
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.holder-treeview-elements {
|
||||
.holder-create-and-search {
|
||||
@include trans-prop-nice(opacity, $dur: 250ms, $delay: 200ms);
|
||||
}
|
||||
}
|
||||
@ -332,9 +336,6 @@
|
||||
|
||||
.pane-inspect-hidden {
|
||||
.l-object-and-inspector {
|
||||
.t-inspect {
|
||||
z-index: 1 !important; // Move down so that primary pane elements are clickable
|
||||
}
|
||||
.l-inspect,
|
||||
.splitter-inspect {
|
||||
opacity: 0;
|
||||
|
||||
@ -19,45 +19,64 @@
|
||||
this source code distribution or the Licensing information page available
|
||||
at runtime from the About dialog for additional information.
|
||||
-->
|
||||
<div ng-init="editMode = true;"></div>
|
||||
<span class="l-inspect" ng-controller="ObjectInspectorController as controller">
|
||||
<div class="abs holder holder-inspector-elements l-flex-col">
|
||||
<div class="pane-header flex-elem">Inspection</div>
|
||||
<ul class="flex-elem grows vscroll">
|
||||
<li>
|
||||
<em>Properties</em>
|
||||
<div class="inspector-properties"
|
||||
ng-repeat="data in metadata"
|
||||
ng-class="{ first:$index === 0 }">
|
||||
<div class="label">{{ data.name }}</div>
|
||||
<div class="value">{{ data.value }}</div>
|
||||
<div ng-controller="PaneController as modelPaneEdit">
|
||||
<mct-split-pane class='abs contents split-layout' anchor='bottom'>
|
||||
<div class="split-pane-component pane top">
|
||||
<div class="abs holder holder-inspector l-flex-col">
|
||||
<div class="pane-header flex-elem">Inspection</div>
|
||||
<ul class="flex-elem grows vscroll">
|
||||
<li>
|
||||
<em>Properties</em>
|
||||
<div class="inspector-properties"
|
||||
ng-repeat="data in metadata"
|
||||
ng-class="{ first:$index === 0 }">
|
||||
<div class="label">{{ data.name }}</div>
|
||||
<div class="value">{{ data.value }}</div>
|
||||
</div>
|
||||
</li>
|
||||
<li ng-if="contextutalParents.length > 0">
|
||||
<em title="The location of this linked object.">Location</em>
|
||||
<span class="inspector-location"
|
||||
ng-repeat="parent in contextutalParents"
|
||||
ng-class="{ last:($index + 1) === contextualParents.length }">
|
||||
<mct-representation key="'label'"
|
||||
mct-object="parent"
|
||||
ng-model="ngModel"
|
||||
ng-click="ngModel.selectedObject = parent"
|
||||
class="location-item">
|
||||
</mct-representation>
|
||||
</span>
|
||||
</li>
|
||||
<li ng-if="primaryParents.length > 0">
|
||||
<em title="The location of the original object that this was linked from.">Original Location</em>
|
||||
<span class="inspector-location"
|
||||
ng-repeat="parent in primaryParents"
|
||||
ng-class="{ last:($index + 1) === primaryParents.length }">
|
||||
<mct-representation key="'label'"
|
||||
mct-object="parent"
|
||||
ng-model="ngModel"
|
||||
ng-click="ngModel.selectedObject = parent"
|
||||
class="location-item">
|
||||
</mct-representation>
|
||||
</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div><!--/ holder-inspector -->
|
||||
</div><!--/ split-pane-component -->
|
||||
<mct-splitter class="splitter-inspect mobile-hide" ng-show="editMode"></mct-splitter>
|
||||
<div class="split-pane-component pane bottom" ng-show="editMode">
|
||||
<div class="abs holder holder-elements l-flex-col">
|
||||
<em class="flex-elem">Elements</em>
|
||||
<div class="filter flex-elem"><input type="text"></div>
|
||||
<mct-representation
|
||||
key="'edit-elements'"
|
||||
mct-object="domainObject"
|
||||
class="flex-elem current-elements grows vscroll">
|
||||
</mct-representation>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
<li ng-if="contextutalParents.length > 0">
|
||||
<em title="The location of this linked object.">Location</em>
|
||||
<span class="inspector-location"
|
||||
ng-repeat="parent in contextutalParents"
|
||||
ng-class="{ last:($index + 1) === contextualParents.length }">
|
||||
<mct-representation key="'label'"
|
||||
mct-object="parent"
|
||||
ng-model="ngModel"
|
||||
ng-click="ngModel.selectedObject = parent"
|
||||
class="location-item">
|
||||
</mct-representation>
|
||||
</span>
|
||||
</li>
|
||||
<li ng-if="primaryParents.length > 0">
|
||||
<em title="The location of the original object that this was linked from.">Original Location</em>
|
||||
<span class="inspector-location"
|
||||
ng-repeat="parent in primaryParents"
|
||||
ng-class="{ last:($index + 1) === primaryParents.length }">
|
||||
<mct-representation key="'label'"
|
||||
mct-object="parent"
|
||||
ng-model="ngModel"
|
||||
ng-click="ngModel.selectedObject = parent"
|
||||
class="location-item">
|
||||
</mct-representation>
|
||||
</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</mct-split-pane>
|
||||
</div><!--/ PaneController -->
|
||||
</span>
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@ -171,7 +171,7 @@ $scrollbarTrackShdw: rgba(#000, 0.7) 0 1px 5px;
|
||||
// Splitter
|
||||
$splitterD: 25px; // splitterD and HandleD should both be odd, or even
|
||||
$splitterHandleD: 1px;
|
||||
$colorSplitterBg: pullForward($colorBodyBg, 5%);
|
||||
$colorSplitterBg: rgba(#fff, 0.1); //pullForward($colorBodyBg, 5%);
|
||||
$splitterShdw: rgba(black, 0.4) 0 0 3px;
|
||||
$splitterEndCr: none;
|
||||
$colorSplitterHover: pullForward($colorBodyBg, 15%);
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
Loading…
Reference in New Issue
Block a user