ExternalVendorCode/openmct
1
0
Fork 0
mirror of https://github.com/nasa/openmct.git synced 2024-12-21 14:07:50 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Merge pull request #1167 from nasa/open1166

Browse Source 
Review and integrate generalized control-bar styling for views
This commit is contained in:
Victor Woeltjen 2016-09-07 13:37:10 -07:00 committed by GitHub
commit 5bde1de61b
6 changed files with 46 additions and 44 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -126,6 +126,7 @@ $menuLineH: 1.5rem;
$menuLineHPx: 24px;
$btnStdH: 25px;
$btnToolbarH: $btnStdH;
$controlBarH: $btnStdH;
$btnFrameH: 16px;
/************************** PATHS */

37
platform/commonUI/general/res/sass/_views.scss
View File

@ -1,8 +1,11 @@
/* Styles for sub-dividing views generically */
.l-control-bar {
// Element that can be placed above l-view-section, holds controls, buttons, etc.
height: $controlBarH;
}
.l-view-section {
@include absPosDefault(0);
font-size: 0.8rem;
h2 {
color: #fff;
margin-bottom: $interiorMargin;
@ -15,4 +18,36 @@
.inline-block {
display: inline-block;
}
}
.has-control-bar {
.l-view-section {
top: $controlBarH + $interiorMargin;
}
}
.child-frame {
.has-control-bar {
$btnExportH: $btnFrameH;
.l-control-bar {
@include trans-prop-nice(opacity, $dur: 50ms);
opacity: 0;
}
.l-view-section {
@include trans-prop-nice(top, $dur: 150ms, $delay: 50ms);
top: 0;
}
&:hover {
.l-control-bar {
@include trans-prop-nice(opacity, 150ms, 100ms);
opacity: 1;
}
.l-view-section {
@include trans-prop-nice(top, $dur: 150ms);
top: $btnExportH + $interiorMargin;
}
}
}
}

36
platform/commonUI/general/res/sass/lists/_tabular.scss
View File

@ -160,39 +160,3 @@ table {
}
}
}
/********************************************************** SPECIFIC TABULAR VIEWS */
.tabular-holder {
&.t-exportable {
$btnExportH: 25px;
.l-view-section {
top: $btnExportH + $interiorMargin;
}
}
}
.child-frame {
.tabular-holder {
&.t-exportable {
$btnExportH: $btnFrameH;
.s-button.t-export {
@include trans-prop-nice(opacity, $dur: 50ms);
opacity: 0;
}
.l-view-section {
@include trans-prop-nice(top, $dur: 150ms, $delay: 50ms);
top: 0;
}
&:hover {
.s-button.t-export {
@include trans-prop-nice(opacity, 150ms, 100ms);
opacity: 1;
}
.l-view-section {
@include trans-prop-nice(top, $dur: 150ms);
top: $btnExportH + $interiorMargin;
}
}
}
}
}

2
platform/features/table/res/templates/historical-table.html
View File

@ -4,6 +4,6 @@
rows="rows"
enableFilter="true"
enableSort="true"
class="tabular-holder t-exportable">
class="tabular-holder has-control-bar">
</mct-table>
</div>

12
platform/features/table/res/templates/mct-table.html
View File

@ -1,8 +1,10 @@
<a class="s-button t-export icon-download labeled"
ng-click="exportAsCSV()"
title="Export This View's Data">
Export
</a>
<div class="l-control-bar">
<a class="s-button t-export icon-download labeled"
ng-click="exportAsCSV()"
title="Export This View's Data">
Export
</a>
</div>
<div class="l-view-section scrolling" style="overflow: auto;" mct-resize="resize()">
<table class="sizing-table">
<tbody>

2
platform/features/table/res/templates/rt-table.html
View File

@ -4,7 +4,7 @@
rows="rows"
enableFilter="true"
enableSort="true"
class="tabular-holder t-exportable"
class="tabular-holder has-control-bar"
auto-scroll="true">
</mct-table>
</div>