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

[Frontend] Tweaks to splitter-related SASS

Browse Source 
open #90
New splitterHandleInset function;
Removed padding from Inspector pane;
This commit is contained in:
Charles Hacskaylo
2015-10-29 10:09:47 -07:00
parent 11ca39b94c
commit 59b24d91bb
9 changed files with 136 additions and 130 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -51,7 +51,7 @@ body, html {
color: $colorBodyFg;
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 100%;
//font-weight: 500;
font-weight: 200;
height: 100%;
width: 100%;
overflow: hidden;

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

@@ -77,7 +77,7 @@
line-height: 180%;
.location-item {
cursor: pointer;
display: inline;
display: inline-block;
position: relative;
padding: 2px 4px;
&:hover {

8
platform/commonUI/general/res/sass/_mixins.scss
View File

@@ -258,6 +258,12 @@
@return percentage($d);
}
@function splitterHandleInset($splitterD: 21px, $splitterHandleD: 1px) {
// Space to either side of the handle
@return ($splitterD - $splitterHandleD) * 0.5;
}
/*********************************************** CONTROLS, FORM ELEMENTS */
@mixin containerBase($bg: $colorBodyBg, $fg: $colorBodyFg) {
@@ -403,4 +409,4 @@
@mixin s-stale($a: 0.5) {
color: rgba($colorTelemFresh, $a) !important;
font-style: italic;
}
}

5
platform/commonUI/general/res/sass/helpers/_splitter.scss
View File

@@ -61,6 +61,7 @@
}
.split-layout {
$inset: splitterHandleInset($splitterD,$splitterHandleD);
&.horizontal {
// Slides vertically up and down, splitting the element horizontally
overflow: hidden; // Suppress overall scroll; each internal pane handles its own overflow
@@ -80,7 +81,7 @@
right: 0;
height: $splitterD;
&:after {
top: $splitterHandleInset; bottom: $splitterHandleInset;
top: $inset; bottom: $inset;
}
}
}
@@ -103,7 +104,7 @@
bottom: 0;
width: $splitterD;
&:after {
left: $splitterHandleInset; right: $splitterHandleInset;
left: $inset; right: $inset;
}
}
}

4
platform/commonUI/general/res/sass/user-environ/_layout.scss
View File

@@ -215,7 +215,7 @@
&.t-inspect.right {
min-width: 200px;
max-width: 600px;
padding-left: $ueCollapsedPaneEdgeM; // Allow room for mini-tab element
//padding-left: $ueCollapsedPaneEdgeM; // Allow room for mini-tab element
width: $ueBrowseRightPaneInspectW;
}
}
@@ -274,7 +274,7 @@
.mini-tab.toggle-pane {
//@include test(blue, 0.3);
$paneExpandedOffset: $splitterD + $uePaneMiniTabW - $splitterHandleInset;
$paneExpandedOffset: $splitterD + $uePaneMiniTabW - splitterHandleInset($splitterD, $splitterHandleD);
$paneCollapsedOffset: $bodyMargin + $ueCollapsedPaneEdgeM;
z-index: 5;
@include desktop {