ExternalVendorCode/openmct
1
0
Fork 0
mirror of https://github.com/nasa/openmct.git synced 2025-02-21 17:57:04 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

[Dev/Frontend] Cherry-picking platform changes from warp1341

Browse Source 
WTD-1341
This commit is contained in:
Charles Hacskaylo 2015-06-24 18:48:23 -07:00
parent e357df2fe5
commit 52a7bd1033
2 changed files with 66 additions and 52 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

102
platform/commonUI/general/res/sass/_fixed-position.scss
View File

@ -1,38 +1,44 @@
/***************************************************************************** /*****************************************************************************
* Open MCT Web, Copyright (c) 2014-2015, United States Government * Open MCT Web, Copyright (c) 2014-2015, United States Government
* as represented by the Administrator of the National Aeronautics and Space * as represented by the Administrator of the National Aeronautics and Space
* Administration. All rights reserved. * Administration. All rights reserved.
* *
* Open MCT Web is licensed under the Apache License, Version 2.0 (the * Open MCT Web is licensed under the Apache License, Version 2.0 (the
* "License"); you may not use this file except in compliance with the License. * "License"); you may not use this file except in compliance with the License.
* You may obtain a copy of the License at * You may obtain a copy of the License at
* http://www.apache.org/licenses/LICENSE-2.0. * http://www.apache.org/licenses/LICENSE-2.0.
* *
* Unless required by applicable law or agreed to in writing, software * Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS, WITHOUT * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
* WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
* License for the specific language governing permissions and limitations * License for the specific language governing permissions and limitations
* under the License. * under the License.
* *
* Open MCT Web includes source code licensed under additional open source * Open MCT Web includes source code licensed under additional open source
* licenses. See the Open Source Licenses file (LICENSES.md) included with * licenses. See the Open Source Licenses file (LICENSES.md) included with
* this source code distribution or the Licensing information page available * this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information. * at runtime from the About dialog for additional information.
*****************************************************************************/ *****************************************************************************/
.t-fixed-position { .t-fixed-position {
&.l-fixed-position { &.l-fixed-position {
// @include test(red); // @include test(red);
position: absolute; position: absolute;
top: 0; right: 0; bottom: 0; left: 0; top: 0;
width: auto; height: auto; right: 0;
bottom: 0;
left: 0;
width: auto;
height: auto;
.l-grid-holder { .l-grid-holder {
position: relative; position: relative;
height: 100%; width: 100%; height: 100%;
width: 100%;
.l-grid { .l-grid {
// @include test(orange); // @include test(orange);
position: absolute; position: absolute;
height: 100%; width: 100%; height: 100%;
width: 100%;
pointer-events: none; pointer-events: none;
z-index: 0; z-index: 0;
} }
@ -56,12 +62,13 @@
.l-fixed-position-image, .l-fixed-position-image,
.l-fixed-position-text { .l-fixed-position-text {
@include box-sizing(border-box); @include box-sizing(border-box);
height: 100%; width: 100%; height: 100%;
width: 100%;
} }
.l-fixed-position-box { .l-fixed-position-box {
} }
.l-fixed-position-image { .l-fixed-position-image {
background-size: cover; background-size: cover;
background-repeat: no-repeat; background-repeat: no-repeat;
@ -70,38 +77,45 @@
.l-fixed-position-text { .l-fixed-position-text {
@include txtShdwSubtle(); @include txtShdwSubtle();
border:1px solid transparent; border: 1px solid transparent;
font-size: 0.8rem; font-size: 0.8rem;
$p: 1px; //$interiorMarginSm; $p: 1px; //$interiorMarginSm;
line-height: 100%; line-height: 100%;
&.l-static-text { &.l-static-text {
// overflow: auto; // overflow: auto;
padding: $p; padding: $p;
} }
&.l-telemetry { &.l-telemetry {
.l-elem { .l-elem {
//@include absPosDefault($p); //@include absPosDefault($p);
@include absPosDefault(0); //@include absPosDefault(0);
@include box-sizing(border-box); @include box-sizing(border-box);
display: block;
padding: 2px; padding: 2px;
width: 50%; //width: 50%;
&.l-title { &.l-title {
right: auto; //right: auto;
left: $p; //left: $p;
float: none;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
width: auto;
} }
&.l-value { &.l-value {
// @include test(blue); // @include test(blue);
right: $p; // right: $p;
left: auto; // left: auto;
@include border-radius($smallCr);
$valPad: 5px;
float: right;
margin-left: $interiorMargin;
padding-left: $valPad;
padding-right: $valPad;
text-align: right; text-align: right;
&.telem-only { &.telem-only {
// @include test(red); margin-left: 0;
left: $p; width: 100%;
width: auto;
}
.l-value-bg {
@include border-radius($smallCr);
padding: 0 4px;
} }
} }
} }

16
platform/features/layout/res/templates/elements/telemetry.html
View File

@ -23,16 +23,16 @@
class="l-fixed-position-text l-telemetry" class="l-fixed-position-text l-telemetry"
ng-style="{ background: ngModel.fill(), 'border-color': ngModel.stroke(), color: ngModel.color() }" ng-style="{ background: ngModel.fill(), 'border-color': ngModel.stroke(), color: ngModel.color() }"
> >
<div <span
class="l-elem l-value obj-val-format ovf-{{ngModel.value}}"
ng-class="{ 'telem-only': !ngModel.element.titled }"
>
{{ngModel.value}}
</span>
<span
class="l-elem l-title" class="l-elem l-title"
ng-show="ngModel.element.titled" ng-show="ngModel.element.titled"
> >
{{ngModel.name}} {{ngModel.name}}
</div> </span>
<div
class="l-elem l-value"
ng-class="{ 'telem-only': !ngModel.element.titled }"
>
{{ngModel.value}}
</div>
</div> </div>