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

[Frontend] Added s-status-pending spinner to tree-item

Browse Source 
open #431
Refinements of tree item sizes and spacing;
Polished spinner-related classes;
Moved l-icon-link icon into -glyph element;
This commit is contained in:
Charles Hacskaylo
2015-12-16 16:06:31 -08:00
parent b59fc43038
commit 930b13f9a0
6 changed files with 85 additions and 61 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
platform/commonUI/general/res/sass/_constants.scss
View File

@@ -71,7 +71,7 @@ $itemPadLR: 5px;
$treeVCW: 10px;
$treeTypeIconH: 1.4em; // was 16px
$treeTypeIconHPx: 16px;
$treeTypeIconW: 20px;
$treeTypeIconW: 18px;
$treeContextTriggerW: 20px;
// Tabular
$tabularHeaderH: 22px; //18px

20
platform/commonUI/general/res/sass/_icons.scss
View File

@@ -89,15 +89,17 @@
line-height: normal; // This is Ok for the symbolsfont
position: relative;
&.l-icon-link {
&:before {
color: $colorIconLink;
content: "\f4";
height: auto; width: auto;
position: absolute;
left: 0; top: 0; right: 0; bottom: 10%;
@include transform-origin(bottom, left);
@include transform(scale(0.3));
z-index: 2;
.t-item-icon-glyph {
&:before {
color: $colorIconLink;
content: "\f4";
height: auto; width: auto;
position: absolute;
left: 0; top: 0; right: 0; bottom: 10%;
@include transform-origin(bottom, left);
@include transform(scale(0.3));
z-index: 2;
}
}
}
}

2
platform/commonUI/general/res/sass/mobile/_tree.scss
View File

@@ -51,7 +51,7 @@
}
.t-object-label {
line-height: inherit;
.t-item-icon.l-icon-link:before {
.t-item-icon.l-icon-link .t-item-icon-glyph:before {
bottom: 20%; // Shift up due to height of mobile menu items
}
}

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

@@ -77,7 +77,8 @@ ul.tree {
@include txtShdwSubtle($shdwItemTreeIcon);
font-size: $treeTypeIconH;
color: $colorItemTreeIcon;
width: $treeTypeIconH;
margin-right: $interiorMargin;
width: $treeTypeIconW;
}
.title-label,
.t-title-label {
@@ -128,17 +129,24 @@ ul.tree {
.tree-item {
mct-representation {
//.t-object-label {
// left: $interiorMargin + $treeVCW;
//}
&.s-status-pending {
.t-object-label {
&:before {
@include spinner(0.25em, $colorItemTreeIcon);
content: "";
}
.t-item-icon .t-item-icon-glyph {
display: none;
.t-item-icon {
&:before {
$spinBW: 4px;
$spinD: $treeTypeIconW - ($spinBW * 2);
@include spinner($spinBW, $colorItemTreeIcon);
content: "";
display: block;
position: absolute;
left: 50%;
top: 50%;
width: $spinD;
height: $spinD;
}
.t-item-icon-glyph {
display: none;
}
}
}
}