Skip to content

Commit e35666b

Browse files
VWoeltjenVWoeltjen
authored
Merge pull request #1165 from nasa/subobjects1161
Review and integrate initial styling for selectable sub-objects
2 parents 73b4385 + 725f820 commit e35666b

File tree

8 files changed

+54
-59
lines changed

8 files changed

+54
-59
lines changed

‎platform/commonUI/general/res/sass/_fixed-position.scss

+1-19
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,6 @@
2121
*****************************************************************************/
2222
.t-fixed-position {
2323
&.l-fixed-position {
24-
// @include test(red);
2524
position: absolute;
2625
top: 0;
2726
right: 0;
@@ -35,7 +34,6 @@
3534
height: 100%;
3635
width: 100%;
3736
.l-grid {
38-
// @include test(orange);
3937
position: absolute;
4038
height: 100%;
4139
width: 100%;
@@ -49,11 +47,6 @@
4947
position: absolute;
5048
border: 1px solid transparent;
5149

52-
&.s-selected {
53-
@include boxShdwLarge();
54-
border-color: $colorKey;
55-
cursor: move;
56-
}
5750
&.s-not-selected {
5851
opacity: 0.8;
5952
}
@@ -76,36 +69,26 @@
7669
}
7770

7871
.l-fixed-position-text {
79-
//@include txtShdwSubtle();
8072
border: 1px solid transparent;
8173
font-size: 0.8rem;
82-
$p: 1px; //$interiorMarginSm;
74+
$p: 1px;
8375
line-height: 100%;
8476
&.l-static-text {
85-
// overflow: auto;
8677
padding: $p;
8778
}
8879
&.l-telemetry {
8980
.l-elem {
90-
//@include absPosDefault($p);
91-
//@include absPosDefault(0);
9281
box-sizing: border-box;
9382
display: block;
9483
padding: 2px;
95-
//width: 50%;
9684
&.l-title {
97-
//right: auto;
98-
//left: $p;
9985
float: none;
10086
overflow: hidden;
10187
text-overflow: ellipsis;
10288
white-space: nowrap;
10389
width: auto;
10490
}
10591
&.l-value {
106-
// @include test(blue);
107-
// right: $p;
108-
// left: auto;
10992
border-radius: $smallCr;
11093
$valPad: 5px;
11194
float: right;
@@ -125,7 +108,6 @@
125108

126109
.l-fixed-position-item-handle {
127110
$brd: 1px solid $colorKey;
128-
// border-radius: $controlCr;
129111
background: rgba($colorKey, 0.5);
130112
cursor: crosshair;
131113
border: $brd;

‎platform/commonUI/general/res/sass/_main.scss

+1
Original file line numberDiff line numberDiff line change
@@ -65,6 +65,7 @@
6565
@import "user-environ/frame";
6666
@import "user-environ/top-bar";
6767
@import "user-environ/tool-bar";
68+
@import "user-environ/selecting";
6869

6970
/********************************* VIEWS */
7071
@import "fixed-position";

‎platform/commonUI/general/res/sass/edit/_editor.scss

+1-1
Original file line numberDiff line numberDiff line change
@@ -97,7 +97,7 @@
9797
.frame.child-frame.panel {
9898
&:hover {
9999
@include boxShdwLarge();
100-
border-color: $colorKey;
100+
border-color: $colorSelectableSelectedPrimary;
101101
.view-switcher {
102102
opacity: 1;
103103
}

‎platform/commonUI/general/res/sass/user-environ/_selecting.scss

+39
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
/*****************************************************************************
2+
* Open MCT, Copyright (c) 2014-2016, United States Government
3+
* as represented by the Administrator of the National Aeronautics and Space
4+
* Administration. All rights reserved.
5+
*
6+
* Open MCT is licensed under the Apache License, Version 2.0 (the
7+
* "License"); you may not use this file except in compliance with the License.
8+
* You may obtain a copy of the License at
9+
* http://www.apache.org/licenses/LICENSE-2.0.
10+
*
11+
* Unless required by applicable law or agreed to in writing, software
12+
* distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
13+
* WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
14+
* License for the specific language governing permissions and limitations
15+
* under the License.
16+
*
17+
* Open MCT includes source code licensed under additional open source
18+
* licenses. See the Open Source Licenses file (LICENSES.md) included with
19+
* this source code distribution or the Licensing information page available
20+
* at runtime from the About dialog for additional information.
21+
*****************************************************************************/
22+
.s-selectable {
23+
border: 1px solid transparent;
24+
25+
&.s-hover {
26+
// Styles when hovering over a selectable object
27+
border-color: $colorSelectableHov !important;
28+
}
29+
30+
&.s-selected {
31+
// Styles for a selected object. Also used by legacy Fixed Position/Panel objects.
32+
border-color: $colorSelectableSelectedPrimary !important;
33+
}
34+
35+
&.s-moveable {
36+
@include boxShdwLarge();
37+
cursor: move;
38+
}
39+
}

‎platform/commonUI/themes/espresso/res/sass/_constants.scss

+3
Original file line numberDiff line numberDiff line change
@@ -63,6 +63,9 @@ $colorInvokeMenu: #fff;
6363
$colorObjHdrTxt: $colorBodyFg;
6464
$colorObjHdrIc: pullForward($colorObjHdrTxt, 20%);
6565
$colorTick: rgba(white, 0.2);
66+
$colorSelectableSelectedPrimary: $colorKey;
67+
$colorSelectableSelectedSecondary: pushBack($colorSelectableSelectedPrimary, 20%);
68+
$colorSelectableHov: $colorSelectableSelectedSecondary;
6669

6770
// Menu colors
6871
$colorMenuBg: pullForward($colorBodyBg, 23%);

‎platform/commonUI/themes/snow/res/sass/_constants.scss

+3
Original file line numberDiff line numberDiff line change
@@ -63,6 +63,9 @@ $colorInvokeMenu: #fff;
6363
$colorObjHdrTxt: $colorBodyFg;
6464
$colorObjHdrIc: pushBack($colorObjHdrTxt, 30%);
6565
$colorTick: rgba(black, 0.2);
66+
$colorSelectableSelectedPrimary: $colorKey;
67+
$colorSelectableSelectedSecondary: pushBack($colorSelectableSelectedPrimary, 20%);
68+
$colorSelectableHov: $colorSelectableSelectedSecondary;
6669

6770
// Menu colors
6871
$colorMenuBg: pushBack($colorBodyBg, 10%);

‎platform/features/layout/res/templates/fixed.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -44,7 +44,7 @@
4444

4545
<!-- Selection highlight, handles -->
4646
<span ng-if="controller.selected()">
47-
<div class="l-fixed-position-item s-selected"
47+
<div class="l-fixed-position-item s-selectable s-selected s-moveable"
4848
mct-drag-down="controller.moveHandle().startDrag(controller.selected())"
4949
mct-drag="controller.moveHandle().continueDrag(delta)"
5050
mct-drag-up="controller.moveHandle().endDrag()"

‎platform/features/layout/res/templates/layout.html

+5-38
Original file line numberDiff line numberDiff line change
@@ -33,61 +33,28 @@
3333
</div>
3434
<!-- Drag handles -->
3535
<span ng-show="domainObject.hasCapability('editor')">
36-
37-
<span
38-
class="edit-handle edit-move"
36+
<span class="edit-handle edit-move"
3937
mct-drag-down="controller.startDrag(childObject.getId(), [1,1], [0,0])"
4038
mct-drag="controller.continueDrag(delta)"
4139
mct-drag-up="controller.endDrag()">
4240
</span>
43-
<!--
44-
<span
45-
class="edit-handle edit-resize-w"
46-
mct-drag-down="controller.startDrag(childObject.getId(), [1,0], [-1,0])"
47-
mct-drag="controller.continueDrag(delta)"
48-
mct-drag-up="controller.endDrag()">
49-
</span>
50-
<span
51-
class="edit-handle edit-resize-e"
52-
mct-drag-down="controller.startDrag(childObject.getId(), [0,0], [1,0])"
53-
mct-drag="controller.continueDrag(delta)"
54-
mct-drag-up="controller.endDrag()">
55-
</span>
56-
57-
<span
58-
class="edit-handle edit-resize-n"
59-
mct-drag-down="controller.startDrag(childObject.getId(), [0,1], [0,-1])"
60-
mct-drag="controller.continueDrag(delta)"
61-
mct-drag-up="controller.endDrag()">
62-
</span>
63-
<span
64-
class="edit-handle edit-resize-s"
65-
mct-drag-down="controller.startDrag(childObject.getId(), [0,0], [0,1])"
66-
mct-drag="controller.continueDrag(delta)"
67-
mct-drag-up="controller.endDrag()">
68-
</span>
69-
-->
7041

71-
<span
72-
class="edit-corner edit-resize-nw"
42+
<span class="edit-corner edit-resize-nw"
7343
mct-drag-down="controller.startDrag(childObject.getId(), [1,1], [-1,-1])"
7444
mct-drag="controller.continueDrag(delta)"
7545
mct-drag-up="controller.endDrag()">
7646
</span>
77-
<span
78-
class="edit-corner edit-resize-ne"
47+
<span class="edit-corner edit-resize-ne"
7948
mct-drag-down="controller.startDrag(childObject.getId(), [0,1], [1,-1])"
8049
mct-drag="controller.continueDrag(delta)"
8150
mct-drag-up="controller.endDrag()">
8251
</span>
83-
<span
84-
class="edit-corner edit-resize-sw"
52+
<span class="edit-corner edit-resize-sw"
8553
mct-drag-down="controller.startDrag(childObject.getId(), [1,0], [-1,1])"
8654
mct-drag="controller.continueDrag(delta)"
8755
mct-drag-up="controller.endDrag()">
8856
</span>
89-
<span
90-
class="edit-corner edit-resize-se"
57+
<span class="edit-corner edit-resize-se"
9158
mct-drag-down="controller.startDrag(childObject.getId(), [0,0], [1,1])"
9259
mct-drag="controller.continueDrag(delta)"
9360
mct-drag-up="controller.endDrag()">

0 commit comments

Comments
 (0)