alihan/openmct
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

[Frontend] Final final sanding on label flex-box conversion

Browse Source 
open #431
Tweaks for labels in Inspector;
This commit is contained in:
Charles Hacskaylo
2015-12-16 17:38:02 -08:00
parent ed7e16d341
commit 3c4fb8c43d
4 changed files with 47 additions and 45 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
platform/commonUI/general/res/sass/_object-label.scss
View File

@@ -33,9 +33,6 @@
.t-item-icon { .t-item-icon {
margin-right: $interiorMargin; margin-right: $interiorMargin;
} }
.t-title-label {
@include ellipsize();
}
} }
mct-representation { mct-representation {

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

@@ -79,6 +79,9 @@ ul.tree {
color: $colorItemTreeIcon; color: $colorItemTreeIcon;
width: $treeTypeIconW; width: $treeTypeIconW;
} }
.t-title-label {
@include ellipsize();
}
} }
&.selected { &.selected {

43
platform/commonUI/themes/espresso/res/css/theme-espresso.css
View File

@@ -5718,47 +5718,53 @@ ul.tree {
font-size: 1.4em; font-size: 1.4em;
color: #0099cc; color: #0099cc;
width: 18px; } width: 18px; }
/* line 84, ../../../../general/res/sass/tree/_tree.scss */ /* line 82, ../../../../general/res/sass/tree/_tree.scss */
.tree-item .t-object-label .t-title-label,
.search-result-item .t-object-label .t-title-label {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap; }
/* line 87, ../../../../general/res/sass/tree/_tree.scss */
.tree-item.selected, .tree-item.selected,
.search-result-item.selected { .search-result-item.selected {
background: #006080; background: #006080;
color: #cccccc; } color: #cccccc; }
/* line 87, ../../../../general/res/sass/tree/_tree.scss */ /* line 90, ../../../../general/res/sass/tree/_tree.scss */
.tree-item.selected .view-control, .tree-item.selected .view-control,
.search-result-item.selected .view-control { .search-result-item.selected .view-control {
color: rgba(255, 255, 255, 0.3); } color: rgba(255, 255, 255, 0.3); }
/* line 90, ../../../../general/res/sass/tree/_tree.scss */ /* line 93, ../../../../general/res/sass/tree/_tree.scss */
.tree-item.selected .t-object-label .t-item-icon, .tree-item.selected .t-object-label .t-item-icon,
.search-result-item.selected .t-object-label .t-item-icon { .search-result-item.selected .t-object-label .t-item-icon {
color: #cccccc; } color: #cccccc; }
@media only screen and (min-device-width: 1025px) and (-webkit-min-device-pixel-ratio: 1) { @media only screen and (min-device-width: 1025px) and (-webkit-min-device-pixel-ratio: 1) {
/* line 97, ../../../../general/res/sass/tree/_tree.scss */ /* line 100, ../../../../general/res/sass/tree/_tree.scss */
.tree-item:not(.selected):hover, .tree-item:not(.selected):hover,
.search-result-item:not(.selected):hover { .search-result-item:not(.selected):hover {
background: rgba(153, 153, 153, 0.1); background: rgba(153, 153, 153, 0.1);
color: #cccccc; } color: #cccccc; }
/* line 100, ../../../../general/res/sass/tree/_tree.scss */ /* line 103, ../../../../general/res/sass/tree/_tree.scss */
.tree-item:not(.selected):hover .t-item-icon, .tree-item:not(.selected):hover .t-item-icon,
.search-result-item:not(.selected):hover .t-item-icon { .search-result-item:not(.selected):hover .t-item-icon {
color: #33ccff; } } color: #33ccff; } }
/* line 107, ../../../../general/res/sass/tree/_tree.scss */ /* line 110, ../../../../general/res/sass/tree/_tree.scss */
.tree-item:not(.loading), .tree-item:not(.loading),
.search-result-item:not(.loading) { .search-result-item:not(.loading) {
cursor: pointer; } cursor: pointer; }
/* line 111, ../../../../general/res/sass/tree/_tree.scss */ /* line 114, ../../../../general/res/sass/tree/_tree.scss */
.tree-item .context-trigger, .tree-item .context-trigger,
.search-result-item .context-trigger { .search-result-item .context-trigger {
top: -1px; top: -1px;
position: absolute; position: absolute;
right: 3px; } right: 3px; }
/* line 116, ../../../../general/res/sass/tree/_tree.scss */ /* line 119, ../../../../general/res/sass/tree/_tree.scss */
.tree-item .context-trigger .invoke-menu, .tree-item .context-trigger .invoke-menu,
.search-result-item .context-trigger .invoke-menu { .search-result-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 128, ../../../../general/res/sass/tree/_tree.scss */ /* line 131, ../../../../general/res/sass/tree/_tree.scss */
mct-representation.s-status-pending .t-object-label .t-item-icon:before { mct-representation.s-status-pending .t-object-label .t-item-icon:before {
-moz-animation-name: rotateCentered; -moz-animation-name: rotateCentered;
-webkit-animation-name: rotateCentered; -webkit-animation-name: rotateCentered;
@@ -5806,15 +5812,15 @@ mct-representation.s-status-pending .t-object-label .t-item-icon:before {
-ms-transform: translateX(-50%) translateY(-50%) rotate(359deg); -ms-transform: translateX(-50%) translateY(-50%) rotate(359deg);
-webkit-transform: translateX(-50%) translateY(-50%) rotate(359deg); -webkit-transform: translateX(-50%) translateY(-50%) rotate(359deg);
transform: translateX(-50%) translateY(-50%) rotate(359deg); } } transform: translateX(-50%) translateY(-50%) rotate(359deg); } }
/* line 142, ../../../../general/res/sass/tree/_tree.scss */ /* line 145, ../../../../general/res/sass/tree/_tree.scss */
mct-representation.s-status-pending .t-object-label .t-item-icon .t-item-icon-glyph { mct-representation.s-status-pending .t-object-label .t-item-icon .t-item-icon-glyph {
display: none; } display: none; }
/* line 146, ../../../../general/res/sass/tree/_tree.scss */ /* line 149, ../../../../general/res/sass/tree/_tree.scss */
mct-representation.s-status-pending .t-object-label .t-title-label { mct-representation.s-status-pending .t-object-label .t-title-label {
font-style: italic; font-style: italic;
opacity: 0.6; } opacity: 0.6; }
/* line 153, ../../../../general/res/sass/tree/_tree.scss */ /* line 156, ../../../../general/res/sass/tree/_tree.scss */
.selected mct-representation.s-status-pending .t-object-label .t-item-icon:before { .selected mct-representation.s-status-pending .t-object-label .t-item-icon:before {
border-color: rgba(204, 204, 204, 0.25); border-color: rgba(204, 204, 204, 0.25);
border-top-color: #cccccc; } border-top-color: #cccccc; }
@@ -5853,13 +5859,8 @@ mct-representation.s-status-pending .t-object-label .t-title-label {
/* line 33, ../../../../general/res/sass/_object-label.scss */ /* line 33, ../../../../general/res/sass/_object-label.scss */
.t-object-label .t-item-icon { .t-object-label .t-item-icon {
margin-right: 5px; } margin-right: 5px; }
/* line 36, ../../../../general/res/sass/_object-label.scss */
.t-object-label .t-title-label {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap; }
/* line 45, ../../../../general/res/sass/_object-label.scss */ /* line 42, ../../../../general/res/sass/_object-label.scss */
mct-representation.s-status-pending .t-object-label .t-item-icon:before { mct-representation.s-status-pending .t-object-label .t-item-icon:before {
-moz-animation-name: rotateCentered; -moz-animation-name: rotateCentered;
-webkit-animation-name: rotateCentered; -webkit-animation-name: rotateCentered;
@@ -5911,15 +5912,15 @@ mct-representation.s-status-pending .t-object-label .t-item-icon:before {
-ms-transform: translateX(-50%) translateY(-50%) rotate(359deg); -ms-transform: translateX(-50%) translateY(-50%) rotate(359deg);
-webkit-transform: translateX(-50%) translateY(-50%) rotate(359deg); -webkit-transform: translateX(-50%) translateY(-50%) rotate(359deg);
transform: translateX(-50%) translateY(-50%) rotate(359deg); } } transform: translateX(-50%) translateY(-50%) rotate(359deg); } }
/* line 58, ../../../../general/res/sass/_object-label.scss */ /* line 55, ../../../../general/res/sass/_object-label.scss */
mct-representation.s-status-pending .t-object-label .t-item-icon .t-item-icon-glyph { mct-representation.s-status-pending .t-object-label .t-item-icon .t-item-icon-glyph {
display: none; } display: none; }
/* line 62, ../../../../general/res/sass/_object-label.scss */ /* line 59, ../../../../general/res/sass/_object-label.scss */
mct-representation.s-status-pending .t-object-label .t-title-label { mct-representation.s-status-pending .t-object-label .t-title-label {
font-style: italic; font-style: italic;
opacity: 0.6; } opacity: 0.6; }
/* line 69, ../../../../general/res/sass/_object-label.scss */ /* line 66, ../../../../general/res/sass/_object-label.scss */
.selected mct-representation.s-status-pending .t-object-label .t-item-icon:before { .selected mct-representation.s-status-pending .t-object-label .t-item-icon:before {
border-color: rgba(204, 204, 204, 0.25); border-color: rgba(204, 204, 204, 0.25);
border-top-color: #cccccc; } border-top-color: #cccccc; }

43
platform/commonUI/themes/snow/res/css/theme-snow.css
View File

@@ -5621,47 +5621,53 @@ ul.tree {
font-size: 1.4em; font-size: 1.4em;
color: #0099cc; color: #0099cc;
width: 18px; } width: 18px; }
/* line 84, ../../../../general/res/sass/tree/_tree.scss */ /* line 82, ../../../../general/res/sass/tree/_tree.scss */
.tree-item .t-object-label .t-title-label,
.search-result-item .t-object-label .t-title-label {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap; }
/* line 87, ../../../../general/res/sass/tree/_tree.scss */
.tree-item.selected, .tree-item.selected,
.search-result-item.selected { .search-result-item.selected {
background: #1ac6ff; background: #1ac6ff;
color: #fcfcfc; } color: #fcfcfc; }
/* line 87, ../../../../general/res/sass/tree/_tree.scss */ /* line 90, ../../../../general/res/sass/tree/_tree.scss */
.tree-item.selected .view-control, .tree-item.selected .view-control,
.search-result-item.selected .view-control { .search-result-item.selected .view-control {
color: #fcfcfc; } color: #fcfcfc; }
/* line 90, ../../../../general/res/sass/tree/_tree.scss */ /* line 93, ../../../../general/res/sass/tree/_tree.scss */
.tree-item.selected .t-object-label .t-item-icon, .tree-item.selected .t-object-label .t-item-icon,
.search-result-item.selected .t-object-label .t-item-icon { .search-result-item.selected .t-object-label .t-item-icon {
color: #fcfcfc; } color: #fcfcfc; }
@media only screen and (min-device-width: 1025px) and (-webkit-min-device-pixel-ratio: 1) { @media only screen and (min-device-width: 1025px) and (-webkit-min-device-pixel-ratio: 1) {
/* line 97, ../../../../general/res/sass/tree/_tree.scss */ /* line 100, ../../../../general/res/sass/tree/_tree.scss */
.tree-item:not(.selected):hover, .tree-item:not(.selected):hover,
.search-result-item:not(.selected):hover { .search-result-item:not(.selected):hover {
background: rgba(102, 102, 102, 0.1); background: rgba(102, 102, 102, 0.1);
color: #333333; } color: #333333; }
/* line 100, ../../../../general/res/sass/tree/_tree.scss */ /* line 103, ../../../../general/res/sass/tree/_tree.scss */
.tree-item:not(.selected):hover .t-item-icon, .tree-item:not(.selected):hover .t-item-icon,
.search-result-item:not(.selected):hover .t-item-icon { .search-result-item:not(.selected):hover .t-item-icon {
color: #0099cc; } } color: #0099cc; } }
/* line 107, ../../../../general/res/sass/tree/_tree.scss */ /* line 110, ../../../../general/res/sass/tree/_tree.scss */
.tree-item:not(.loading), .tree-item:not(.loading),
.search-result-item:not(.loading) { .search-result-item:not(.loading) {
cursor: pointer; } cursor: pointer; }
/* line 111, ../../../../general/res/sass/tree/_tree.scss */ /* line 114, ../../../../general/res/sass/tree/_tree.scss */
.tree-item .context-trigger, .tree-item .context-trigger,
.search-result-item .context-trigger { .search-result-item .context-trigger {
top: -1px; top: -1px;
position: absolute; position: absolute;
right: 3px; } right: 3px; }
/* line 116, ../../../../general/res/sass/tree/_tree.scss */ /* line 119, ../../../../general/res/sass/tree/_tree.scss */
.tree-item .context-trigger .invoke-menu, .tree-item .context-trigger .invoke-menu,
.search-result-item .context-trigger .invoke-menu { .search-result-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 128, ../../../../general/res/sass/tree/_tree.scss */ /* line 131, ../../../../general/res/sass/tree/_tree.scss */
mct-representation.s-status-pending .t-object-label .t-item-icon:before { mct-representation.s-status-pending .t-object-label .t-item-icon:before {
-moz-animation-name: rotateCentered; -moz-animation-name: rotateCentered;
-webkit-animation-name: rotateCentered; -webkit-animation-name: rotateCentered;
@@ -5709,15 +5715,15 @@ mct-representation.s-status-pending .t-object-label .t-item-icon:before {
-ms-transform: translateX(-50%) translateY(-50%) rotate(359deg); -ms-transform: translateX(-50%) translateY(-50%) rotate(359deg);
-webkit-transform: translateX(-50%) translateY(-50%) rotate(359deg); -webkit-transform: translateX(-50%) translateY(-50%) rotate(359deg);
transform: translateX(-50%) translateY(-50%) rotate(359deg); } } transform: translateX(-50%) translateY(-50%) rotate(359deg); } }
/* line 142, ../../../../general/res/sass/tree/_tree.scss */ /* line 145, ../../../../general/res/sass/tree/_tree.scss */
mct-representation.s-status-pending .t-object-label .t-item-icon .t-item-icon-glyph { mct-representation.s-status-pending .t-object-label .t-item-icon .t-item-icon-glyph {
display: none; } display: none; }
/* line 146, ../../../../general/res/sass/tree/_tree.scss */ /* line 149, ../../../../general/res/sass/tree/_tree.scss */
mct-representation.s-status-pending .t-object-label .t-title-label { mct-representation.s-status-pending .t-object-label .t-title-label {
font-style: italic; font-style: italic;
opacity: 0.6; } opacity: 0.6; }
/* line 153, ../../../../general/res/sass/tree/_tree.scss */ /* line 156, ../../../../general/res/sass/tree/_tree.scss */
.selected mct-representation.s-status-pending .t-object-label .t-item-icon:before { .selected mct-representation.s-status-pending .t-object-label .t-item-icon:before {
border-color: rgba(252, 252, 252, 0.25); border-color: rgba(252, 252, 252, 0.25);
border-top-color: #fcfcfc; } border-top-color: #fcfcfc; }
@@ -5756,13 +5762,8 @@ mct-representation.s-status-pending .t-object-label .t-title-label {
/* line 33, ../../../../general/res/sass/_object-label.scss */ /* line 33, ../../../../general/res/sass/_object-label.scss */
.t-object-label .t-item-icon { .t-object-label .t-item-icon {
margin-right: 5px; } margin-right: 5px; }
/* line 36, ../../../../general/res/sass/_object-label.scss */
.t-object-label .t-title-label {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap; }
/* line 45, ../../../../general/res/sass/_object-label.scss */ /* line 42, ../../../../general/res/sass/_object-label.scss */
mct-representation.s-status-pending .t-object-label .t-item-icon:before { mct-representation.s-status-pending .t-object-label .t-item-icon:before {
-moz-animation-name: rotateCentered; -moz-animation-name: rotateCentered;
-webkit-animation-name: rotateCentered; -webkit-animation-name: rotateCentered;
@@ -5814,15 +5815,15 @@ mct-representation.s-status-pending .t-object-label .t-item-icon:before {
-ms-transform: translateX(-50%) translateY(-50%) rotate(359deg); -ms-transform: translateX(-50%) translateY(-50%) rotate(359deg);
-webkit-transform: translateX(-50%) translateY(-50%) rotate(359deg); -webkit-transform: translateX(-50%) translateY(-50%) rotate(359deg);
transform: translateX(-50%) translateY(-50%) rotate(359deg); } } transform: translateX(-50%) translateY(-50%) rotate(359deg); } }
/* line 58, ../../../../general/res/sass/_object-label.scss */ /* line 55, ../../../../general/res/sass/_object-label.scss */
mct-representation.s-status-pending .t-object-label .t-item-icon .t-item-icon-glyph { mct-representation.s-status-pending .t-object-label .t-item-icon .t-item-icon-glyph {
display: none; } display: none; }
/* line 62, ../../../../general/res/sass/_object-label.scss */ /* line 59, ../../../../general/res/sass/_object-label.scss */
mct-representation.s-status-pending .t-object-label .t-title-label { mct-representation.s-status-pending .t-object-label .t-title-label {
font-style: italic; font-style: italic;
opacity: 0.6; } opacity: 0.6; }
/* line 69, ../../../../general/res/sass/_object-label.scss */ /* line 66, ../../../../general/res/sass/_object-label.scss */
.selected mct-representation.s-status-pending .t-object-label .t-item-icon:before { .selected mct-representation.s-status-pending .t-object-label .t-item-icon:before {
border-color: rgba(252, 252, 252, 0.25); border-color: rgba(252, 252, 252, 0.25);
border-top-color: #fcfcfc; } border-top-color: #fcfcfc; }