ExternalVendorCode/openmct
1
0
Fork 0
mirror of https://github.com/nasa/openmct.git synced 2025-06-16 14:18:16 +00:00
Code Issues Actions 4 Packages Projects Releases Wiki Activity

[Frontend] Styling for context-available arrow

Browse Source 
WTD-1404
WTD-1422
This commit is contained in:
Charles Hacskaylo
2015-06-30 13:35:21 -07:00
parent 344aa8acc8
commit 06cf199872
4 changed files with 60 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
platform/commonUI/general/res/css/theme-espresso.css
View File

@ -2201,6 +2201,13 @@ label.checkbox.custom {
height: auto; } height: auto; }
/* line 351, ../sass/controls/_controls.scss */ /* line 351, ../sass/controls/_controls.scss */
.context-available {
color: #0099cc; }
/* line 355, ../sass/controls/_controls.scss */
.context-available:hover {
color: deepskyblue; }
/* line 360, ../sass/controls/_controls.scss */
.view-switcher { .view-switcher {
-moz-transition-property: visibility, opacity, background-color, border-color; -moz-transition-property: visibility, opacity, background-color, border-color;
-o-transition-property: visibility, opacity, background-color, border-color; -o-transition-property: visibility, opacity, background-color, border-color;
@ -2216,30 +2223,37 @@ label.checkbox.custom {
transition-timing-function: ease-in-out; } transition-timing-function: ease-in-out; }
/******************************************************** OBJECT-HEADER */ /******************************************************** OBJECT-HEADER */
/* line 356, ../sass/controls/_controls.scss */ /* line 365, ../sass/controls/_controls.scss */
.object-header { .object-header {
display: inline-block; display: inline-block;
font-size: 1em; } font-size: 1em; }
/* line 360, ../sass/controls/_controls.scss */ /* line 369, ../sass/controls/_controls.scss */
.object-header .label .title-label { .object-header .label .title-label {
color: white; } color: white; }
/* line 363, ../sass/controls/_controls.scss */ /* line 372, ../sass/controls/_controls.scss */
.object-header .label .type-icon { .object-header .label .type-icon {
font-size: 120%; font-size: 120%;
margin-right: 5px; margin-right: 5px;
vertical-align: middle; } vertical-align: middle; }
/* line 377, ../sass/controls/_controls.scss */
.object-header .label .context-available {
opacity: 0;
font-size: 0.8em; }
/* line 382, ../sass/controls/_controls.scss */
.object-header .label:hover .context-available {
opacity: 1; }
/* line 373, ../sass/controls/_controls.scss */ /* line 391, ../sass/controls/_controls.scss */
.top-bar .object-header, .top-bar .object-header,
.object-browse-bar .object-header { .object-browse-bar .object-header {
font-size: 1.1em; } font-size: 1.1em; }
/* line 375, ../sass/controls/_controls.scss */ /* line 393, ../sass/controls/_controls.scss */
.top-bar .object-header span, .top-bar .object-header span,
.object-browse-bar .object-header span { .object-browse-bar .object-header span {
display: inline-block; } display: inline-block; }
/******************************************************** SLIDERS */ /******************************************************** SLIDERS */
/* line 387, ../sass/controls/_controls.scss */ /* line 405, ../sass/controls/_controls.scss */
.slider .slot { .slider .slot {
-moz-border-radius: 2px; -moz-border-radius: 2px;
-webkit-border-radius: 2px; -webkit-border-radius: 2px;
@ -2260,7 +2274,7 @@ label.checkbox.custom {
right: 0; right: 0;
bottom: auto; bottom: auto;
left: 0; } left: 0; }
/* line 398, ../sass/controls/_controls.scss */ /* line 416, ../sass/controls/_controls.scss */
.slider .knob { .slider .knob {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzUyNTI1MiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzQ1NDU0NSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzUyNTI1MiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzQ1NDU0NSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%; background-size: 100%;
@ -2343,12 +2357,12 @@ label.checkbox.custom {
-webkit-transition-timing-function: ease-in-out; -webkit-transition-timing-function: ease-in-out;
transition-timing-function: ease-in-out; transition-timing-function: ease-in-out;
border-color: #0099cc; } border-color: #0099cc; }
/* line 409, ../sass/controls/_controls.scss */ /* line 427, ../sass/controls/_controls.scss */
.slider .knob:before { .slider .knob:before {
top: 1px; top: 1px;
bottom: 3px; bottom: 3px;
left: 5px; } left: 5px; }
/* line 416, ../sass/controls/_controls.scss */ /* line 434, ../sass/controls/_controls.scss */
.slider .range { .slider .range {
background: rgba(0, 153, 204, 0.6); background: rgba(0, 153, 204, 0.6);
cursor: ew-resize; cursor: ew-resize;
@ -2359,12 +2373,12 @@ label.checkbox.custom {
left: auto; left: auto;
height: auto; height: auto;
width: auto; } width: auto; }
/* line 426, ../sass/controls/_controls.scss */ /* line 444, ../sass/controls/_controls.scss */
.slider .range:hover { .slider .range:hover {
background: rgba(0, 153, 204, 0.7); } background: rgba(0, 153, 204, 0.7); }
/******************************************************** BROWSER ELEMENTS */ /******************************************************** BROWSER ELEMENTS */
/* line 434, ../sass/controls/_controls.scss */ /* line 452, ../sass/controls/_controls.scss */
::-webkit-scrollbar { ::-webkit-scrollbar {
-moz-border-radius: 2px; -moz-border-radius: 2px;
-webkit-border-radius: 2px; -webkit-border-radius: 2px;
@ -2381,7 +2395,7 @@ label.checkbox.custom {
height: 10px; height: 10px;
width: 10px; } width: 10px; }
/* line 440, ../sass/controls/_controls.scss */ /* line 458, ../sass/controls/_controls.scss */
::-webkit-scrollbar-thumb { ::-webkit-scrollbar-thumb {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzY2NjY2NiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzU5NTk1OSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzY2NjY2NiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzU5NTk1OSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%; background-size: 100%;
@ -2399,7 +2413,7 @@ label.checkbox.custom {
-webkit-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px; -webkit-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px;
box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px; box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px;
border-top: 1px solid gray; } border-top: 1px solid gray; }
/* line 447, ../sass/controls/_controls.scss */ /* line 465, ../sass/controls/_controls.scss */
::-webkit-scrollbar-thumb:hover { ::-webkit-scrollbar-thumb:hover {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzgwODA4MCIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzczNzM3MyIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzgwODA4MCIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzczNzM3MyIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%; background-size: 100%;
@ -2408,7 +2422,7 @@ label.checkbox.custom {
background-image: -webkit-linear-gradient(#808080, #737373 20px); background-image: -webkit-linear-gradient(#808080, #737373 20px);
background-image: linear-gradient(#808080, #737373 20px); } background-image: linear-gradient(#808080, #737373 20px); }
/* line 452, ../sass/controls/_controls.scss */ /* line 470, ../sass/controls/_controls.scss */
::-webkit-scrollbar-corner { ::-webkit-scrollbar-corner {
background: rgba(0, 0, 0, 0.4); } background: rgba(0, 0, 0, 0.4); }

28
platform/commonUI/general/res/css/tree.css
View File

@ -190,51 +190,51 @@ ul.tree {
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; } white-space: nowrap; }
/* line 87, ../sass/tree/_tree.scss */ /* line 86, ../sass/tree/_tree.scss */
ul.tree li span.tree-item.loading { ul.tree li span.tree-item.loading {
pointer-events: none; } pointer-events: none; }
/* line 89, ../sass/tree/_tree.scss */ /* line 88, ../sass/tree/_tree.scss */
ul.tree li span.tree-item.loading .label { ul.tree li span.tree-item.loading .label {
opacity: 0.5; } opacity: 0.5; }
/* line 91, ../sass/tree/_tree.scss */ /* line 90, ../sass/tree/_tree.scss */
ul.tree li span.tree-item.loading .label .title-label { ul.tree li span.tree-item.loading .label .title-label {
font-style: italic; } font-style: italic; }
/* line 95, ../sass/tree/_tree.scss */ /* line 94, ../sass/tree/_tree.scss */
ul.tree li span.tree-item.loading .wait-spinner { ul.tree li span.tree-item.loading .wait-spinner {
margin-left: 14px; } margin-left: 14px; }
/* line 100, ../sass/tree/_tree.scss */ /* line 99, ../sass/tree/_tree.scss */
ul.tree li span.tree-item.selected { ul.tree li span.tree-item.selected {
background: #005177; background: #005177;
color: #fff; } color: #fff; }
/* line 104, ../sass/tree/_tree.scss */ /* line 103, ../sass/tree/_tree.scss */
ul.tree li span.tree-item.selected .view-control { ul.tree li span.tree-item.selected .view-control {
color: #0099cc; } color: #0099cc; }
/* line 107, ../sass/tree/_tree.scss */ /* line 106, ../sass/tree/_tree.scss */
ul.tree li span.tree-item.selected .label .type-icon { ul.tree li span.tree-item.selected .label .type-icon {
color: #fff; } color: #fff; }
/* line 113, ../sass/tree/_tree.scss */ /* line 112, ../sass/tree/_tree.scss */
ul.tree li span.tree-item:not(.selected):hover { ul.tree li span.tree-item:not(.selected):hover {
background: #404040; background: #404040;
color: #cccccc; } color: #cccccc; }
/* line 116, ../sass/tree/_tree.scss */ /* line 115, ../sass/tree/_tree.scss */
ul.tree li span.tree-item:not(.selected):hover .context-trigger { ul.tree li span.tree-item:not(.selected):hover .context-trigger {
display: block; } display: block; }
/* line 119, ../sass/tree/_tree.scss */ /* line 118, ../sass/tree/_tree.scss */
ul.tree li span.tree-item:not(.selected):hover .icon { ul.tree li span.tree-item:not(.selected):hover .icon {
color: #33ccff; } color: #33ccff; }
/* line 125, ../sass/tree/_tree.scss */ /* line 124, ../sass/tree/_tree.scss */
ul.tree li span.tree-item:not(.loading) { ul.tree li span.tree-item:not(.loading) {
cursor: pointer; } cursor: pointer; }
/* line 129, ../sass/tree/_tree.scss */ /* line 128, ../sass/tree/_tree.scss */
ul.tree li span.tree-item .context-trigger { ul.tree li span.tree-item .context-trigger {
top: -1px; top: -1px;
position: absolute; position: absolute;
right: 3px; } right: 3px; }
/* line 135, ../sass/tree/_tree.scss */ /* line 134, ../sass/tree/_tree.scss */
ul.tree li span.tree-item .context-trigger .invoke-menu { ul.tree li span.tree-item .context-trigger .invoke-menu {
font-size: 0.75em; font-size: 0.75em;
height: 0.9rem; height: 0.9rem;
line-height: 0.9rem; } line-height: 0.9rem; }
/* line 144, ../sass/tree/_tree.scss */ /* line 143, ../sass/tree/_tree.scss */
ul.tree ul.tree { ul.tree ul.tree {
margin-left: 15px; } margin-left: 15px; }

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

@ -348,6 +348,15 @@ label.checkbox.custom {
} }
} }
.context-available {
$c: $colorKey;
color: $c;
//padding: 0 5px;
&:hover {
color: lighten($c, 10%);
}
}
.view-switcher { .view-switcher {
@include trans-prop-nice-fade($controlFadeMs); @include trans-prop-nice-fade($controlFadeMs);
} }
@ -365,6 +374,15 @@ label.checkbox.custom {
margin-right: $interiorMargin; margin-right: $interiorMargin;
vertical-align: middle; vertical-align: middle;
} }
.context-available {
opacity: 0;
font-size: 0.8em;
}
&:hover {
.context-available {
opacity: 1;
}
}
} }
} }

1
platform/commonUI/general/res/sass/tree/_tree.scss
View File

@ -79,7 +79,6 @@ ul.tree {
//right: $treeContextTriggerW + $interiorMargin; //right: $treeContextTriggerW + $interiorMargin;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
// height: $menuLineH;
white-space: nowrap; white-space: nowrap;
} }
} }