ExternalVendorCode/openmct
1
0
Fork 0
mirror of https://github.com/nasa/openmct.git synced 2025-01-26 22:29:34 +00:00
Code Issues Actions 4 Packages Projects Releases Wiki Activity

[Frontend] Fixed colors

Browse Source 
Fixes #1047
WIP: fixed colors  and style defs related to clickable
icons
This commit is contained in:
Charles Hacskaylo 2016-07-21 17:07:49 -07:00
parent c2db6f8805
commit d43bff1445
6 changed files with 14 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
platform/commonUI/general/res/sass/controls/_controls.scss
View File

@ -74,16 +74,14 @@
.s-clickable-icon {
// Clickable icon elements that have hover
// .s-toggles means the element is capable of having .active applied to it
@extend .ui-symbol;
color: $colorClickIcon;
&.active {
color: $colorClickIconActive;
//&:hover {
// color: rgba($colorClickIconActive, 0.7);
//}
}
&:hover {
color: $colorClickIconHov;
&:hover { color: $colorClickIconHov; }
&.s-toggles {
color: rgba($colorClickIcon, 0.5) !important;
&.active { color: $colorClickIconActive !important; }
&:hover { color: rgba($colorClickIconHov, 0.5) !important; }
}
}

4
platform/commonUI/themes/espresso/res/sass/_constants.scss
View File

@ -29,9 +29,9 @@ $colorBtnMajorBg: $colorKey;
$colorBtnMajorBgHov: pullForward($colorBtnMajorBg, $hoverRatioPercent);
$colorBtnMajorFg: $colorKeyFg;
$colorBtnMajorFgHov: pullForward($colorBtnMajorFg, $hoverRatioPercent);
$colorClickIcon: pullForward($colorBodyBg, 10%);
$colorClickIcon: $colorBodyFg;
$colorClickIconActive: $colorKey;
$colorClickIconHov: rgba($colorClickIconActive, 0.4);
$colorClickIconHov: $colorClickIconActive;
$colorInvokeMenu: #fff;
$contrastInvokeMenuPercent: 20%;
$shdwBtns: rgba(black, 0.2) 0 1px 2px;

4
platform/commonUI/themes/snow/res/sass/_constants.scss
View File

@ -29,9 +29,9 @@ $colorBtnMajorBg: $colorKey;
$colorBtnMajorBgHov: #007fbc;
$colorBtnMajorFg: $colorKeyFg;
$colorBtnMajorFgHov: pushBack($colorBtnMajorFg, $hoverRatioPercent);
$colorClickIcon: pullForward($colorBodyBg, 10%);
$colorClickIcon: $colorBodyFg;
$colorClickIconActive: $colorKey;
$colorClickIconHov: rgba($colorClickIconActive, 0.4);
$colorClickIconHov: $colorClickIconActive;
$colorInvokeMenu: #000;
$contrastInvokeMenuPercent: 40%;
$shdwBtns: none;

2
platform/features/clock/res/templates/timer.html
View File

@ -23,7 +23,7 @@
<div class="l-elem-wrapper l-flex-row">
<a ng-click="timer.clickButton()"
title="{{timer.buttonText()}}"
class="flex-elem control {{timer.buttonCssClass()}}"></a>
class="flex-elem control s-clickable-icon {{timer.buttonCssClass()}}"></a>
<span class="flex-elem l-value {{timer.signClass()}}">
<span class="value"
ng-class="{ active:timer.text() }">{{timer.text() || "--:--:--"}}

5
platform/features/timeline/res/sass/_timelines.scss
View File

@ -302,12 +302,9 @@
.l-swimlanes-holder .l-cols {
.l-col-icon,
.l-col-icon a {
.l-col-icon a:not(.s-toggles) {
color: $colorKey;
}
.t-toggle .inactive {
color: $colorBtnBg;
}
}
.l-pane-l {

4
platform/features/timeline/res/templates/tabular-swimlane-cols-tree.html
View File

@ -28,10 +28,10 @@
'drop-after': ngModel.highlightBottom()
}">
<div class="l-cols">
<span class="l-col l-col-icon l-plot-resource t-toggle"
<span class="l-col l-col-icon l-plot-resource"
ng-click="ngModel.toggleGraph(); parameters.commit()"
title="Click to enable or disable inclusion in Resource Graphing">
<span class="icon-plot-resource s-clickable-icon"
<span class="icon-plot-resource s-clickable-icon s-toggles"
ng-class="{ active: ngModel.graph() }">
</span>
</span>