ExternalVendorCode/openmct
1
0
Fork 0
mirror of https://github.com/nasa/openmct.git synced 2025-02-20 17:33:23 +00:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

[Frontend] Mods to slider .range-value elems

Browse Source 
open #889
- Text smaller, line breaks;
- Height adjustments
- Increased with of slider area;
This commit is contained in:
Charles Hacskaylo 2016-05-09 10:16:54 -07:00
parent d6aa31e4aa
commit cae85f3e30
5 changed files with 23 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -48,7 +48,7 @@ $uePaneMiniTabW: 10px;
$uePaneMiniTabCollapsedW: 11px;
$ueEditLeftPaneW: 75%;
$treeSearchInputBarH: 25px;
$ueTimeControlH: (33px, 20px, 20px);
$ueTimeControlH: (33px, 23px, 15px);
// Panes
$ueBrowseLeftPaneTreeMinW: 150px;
$ueBrowseLeftPaneTreeMaxW: 35%;

4
platform/commonUI/general/res/sass/controls/_controls.scss
View File

@ -404,11 +404,11 @@ body.desktop .object-header {
left: auto;
}
.knob-l {
@include border-left-radius($sliderKnobW);
@include border-left-radius($sliderKnobR);
cursor: w-resize;
}
.knob-r {
@include border-right-radius($sliderKnobW);
@include border-right-radius($sliderKnobR);
cursor: e-resize;
}
.range {

27
platform/commonUI/general/res/sass/controls/_time-controller.scss
View File

@ -11,7 +11,7 @@
$knobM: ($sliderKnobW + $knobHOffset) * -1;
$rangeValPad: $interiorMargin;
$rangeValOffset: $sliderKnobW;
$timeRangeSliderLROffset: 130px + $sliderKnobW + $rangeValOffset;
$timeRangeSliderLROffset: 80px + ($sliderKnobW * 2);
$r1H: nth($ueTimeControlH,1);
$r2H: nth($ueTimeControlH,2);
$r3H: nth($ueTimeControlH,3);
@ -76,22 +76,23 @@
&:before,
&:after {
background-color: $myC;
content: "";
//content: "";
position: absolute;
}
&:before {
// Vert line
content: "";
top: 0; right: auto; bottom: -10px; left: floor($myW/2) - 1;
width: 2px;
width: 1px;
}
&:after {
/* &:after {
// Circle element
border-radius: $myW;
@include transform(translateY(-50%));
top: 50%; right: 0; bottom: auto; left: 0;
width: auto;
height: $myW;
}
}*/
}
&:hover .toi-line {
@include toiLineHovEffects;
@ -126,9 +127,9 @@
@include webkitProp(transform, translateX(-50%));
color: $colorPlotLabelFg;
display: inline-block;
font-size: 0.9em;
font-size: 0.7rem;
position: absolute;
top: 8px;
top: 5px;
white-space: nowrap;
z-index: 2;
}
@ -140,14 +141,18 @@
z-index: 2;
.range-value {
@include trans-prop-nice-fade(.25s);
//background: rgba(red, 0.4);
font-size: 0.7rem;
padding: 0 $rangeValOffset;
position: absolute;
height: $r2H;
line-height: $r2H;
white-space: nowrap;
line-height: $r2H/2;
z-index: 1;
}
&:hover .range-value {
color: $sliderColorKnobHov;
&:hover {
.range-value {
color: $sliderColorKnobHov;
}
}
&.knob-l {
margin-left: $knobM;

3
platform/commonUI/themes/espresso/res/sass/_constants.scss
View File

@ -36,7 +36,8 @@ $sliderColorKnob: rgba($sliderColorBase, 0.6);
$sliderColorKnobHov: $sliderColorBase;
$sliderColorRangeValHovBg: rgba($sliderColorBase, 0.1);
$sliderColorRangeValHovFg: $colorKeyFg;
$sliderKnobW: nth($ueTimeControlH,2)/2;
$sliderKnobW: 5px; //nth($ueTimeControlH,2)/2;
$sliderKnobR: 2px;
$timeControllerToiLineColor: #00c2ff;
$timeControllerToiLineColorHov: #fff;

3
platform/commonUI/themes/snow/res/sass/_constants.scss
View File

@ -36,7 +36,8 @@ $sliderColorKnob: rgba($sliderColorBase, 0.5);
$sliderColorKnobHov: rgba($sliderColorBase, 0.7);
$sliderColorRangeValHovBg: $sliderColorRange; //rgba($sliderColorBase, 0.1);
$sliderColorRangeValHovFg: $colorBodyFg;
$sliderKnobW: nth($ueTimeControlH,2)/2;
$sliderKnobW: 5px; //nth($ueTimeControlH,2)/2;
$sliderKnobR: 2px;
$timeControllerToiLineColor: $colorBodyFg;
$timeControllerToiLineColorHov: #0052b5;