[Frontend] Significant change to look and behavior of mini-tabs

open #90
IN-PROGRESS
mini-tab location in markup in browse.html changed;
Single menu icon for collapsed treeview;
Close 'x' boxes instead of arrow icons;
TO-DO: verify mobile is Ok;
This commit is contained in:
Charles Hacskaylo
2015-10-30 15:25:12 -07:00
parent 675c5be3da
commit b5b6546710
8 changed files with 486 additions and 383 deletions

View File

@@ -208,6 +208,38 @@ $pad: $interiorMargin * $baseRatio;
}
}
.mini-tab-icon {
// Meant to be used as pane hide/show control elements in concert with mct-splitter
//@extend .ui-symbol;
@include desktop {
$d: $uePaneMiniTabW;
//@include trans-prop-nice(transform, 150ms);
color: pullForward($colorBodyBg, 15%);
cursor: pointer;
display: block;
font-family: symbolsfont;
font-size: $d;
position: absolute;
height: $d; width: $d;
line-height: $d;
&:before,
&:after {
position: absolute;
display: inherit;
}
&:before {
content: '\78'; // X icon
}
&:hover {
color: $colorKey;
@include transform(scale(1.2));
}
}
}
.l-btn-set {
// Buttons that have a very tight conceptual grouping - no internal space between them.
// Structure: .btn-set > mct-representation class=first|last > .s-btn