[Merge] Merge in open-master, resolve conflicts in _constants.scss
This commit is contained in:
@@ -45,6 +45,7 @@
|
||||
@import "controls/controls";
|
||||
@import "controls/lists";
|
||||
@import "controls/menus";
|
||||
@import "controls/time-controller";
|
||||
@import "forms/mixins";
|
||||
@import "forms/elems";
|
||||
@import "forms/validation";
|
||||
|
||||
@@ -436,52 +436,62 @@ label.checkbox.custom {
|
||||
}
|
||||
|
||||
/******************************************************** SLIDERS */
|
||||
|
||||
.wrapper-slider {
|
||||
position: relative;
|
||||
}
|
||||
.slider {
|
||||
$knobH: 100%; //14px;
|
||||
//$knobH: 70%; //14px;
|
||||
$knobW: 12px;
|
||||
$slotH: 50%;
|
||||
$slotH: 80%;
|
||||
$rangeO: 0.3;
|
||||
.slot {
|
||||
// @include border-radius($basicCr * .75);
|
||||
// @include border-radius($basicCr * .75);
|
||||
@include sliderTrack();
|
||||
height: $slotH;
|
||||
height: auto;
|
||||
width: auto;
|
||||
position: absolute;
|
||||
top: ($knobH - $slotH) / 2;
|
||||
//top: ($knobH - $slotH) / 2;
|
||||
top: (100% - $slotH)/2;
|
||||
right: 0;
|
||||
bottom: auto;
|
||||
bottom: (100% - $slotH)/2;
|
||||
left: 0;
|
||||
z-index: 0;
|
||||
.range {
|
||||
background: rgba($colorKey, $rangeO);
|
||||
cursor: ew-resize;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: auto;
|
||||
bottom: 0;
|
||||
left: auto;
|
||||
height: auto;
|
||||
width: auto;
|
||||
z-index: 1;
|
||||
&:hover {
|
||||
background: rgba($colorKey, $rangeO + 0.2);
|
||||
}
|
||||
}
|
||||
}
|
||||
.knob {
|
||||
@include btnSubtle();
|
||||
@include controlGrippy(rgba(black, 0.3), vertical, 1px, solid);
|
||||
@include border-radius(2px);
|
||||
cursor: ew-resize;
|
||||
position: absolute;
|
||||
height: $knobH;
|
||||
height: auto;
|
||||
width: $knobW;
|
||||
top: 0;
|
||||
auto: 0;
|
||||
bottom: auto;
|
||||
bottom: 0;
|
||||
left: auto;
|
||||
z-index: 2;
|
||||
&.knob-l { margin-left: $knobW / -2; }
|
||||
&.knob-r { margin-right: $knobW / -2; }
|
||||
&:before {
|
||||
top: 1px;
|
||||
bottom: 3px;
|
||||
left: ($knobW / 2) - 1;
|
||||
}
|
||||
|
||||
}
|
||||
.range {
|
||||
background: rgba($colorKey, 0.6);
|
||||
cursor: ew-resize;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: auto;
|
||||
bottom: 0;
|
||||
left: auto;
|
||||
height: auto;
|
||||
width: auto;
|
||||
&:hover {
|
||||
background: rgba($colorKey, 0.7);
|
||||
//left: ($knobW / 2) - 1;
|
||||
//margin-left: -1px;
|
||||
left: 45%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -0,0 +1,104 @@
|
||||
.l-time-controller {
|
||||
$inputTxtW: 90px;
|
||||
$knobW: 9px;
|
||||
$r1H: 20px;
|
||||
$r2H: 30px;
|
||||
$r3H: 10px;
|
||||
|
||||
position: relative;
|
||||
margin: $interiorMarginLg 0;
|
||||
min-width: 400px;
|
||||
|
||||
.l-time-range-inputs-holder,
|
||||
.l-time-range-slider {
|
||||
font-size: 0.8em;
|
||||
}
|
||||
|
||||
.l-time-range-inputs-holder,
|
||||
.l-time-range-slider-holder,
|
||||
.l-time-range-ticks-holder
|
||||
{
|
||||
margin-bottom: $interiorMargin;
|
||||
position: relative;
|
||||
}
|
||||
.l-time-range-slider,
|
||||
.l-time-range-ticks {
|
||||
//@include test(red, 0.1);
|
||||
@include absPosDefault(0, visible);
|
||||
}
|
||||
|
||||
.l-time-range-inputs-holder {
|
||||
height: $r1H;
|
||||
}
|
||||
|
||||
.l-time-range-slider,
|
||||
.l-time-range-ticks {
|
||||
left: $inputTxtW; right: $inputTxtW;
|
||||
|
||||
}
|
||||
|
||||
.l-time-range-slider-holder {
|
||||
height: $r2H;
|
||||
.range-holder {
|
||||
@include box-shadow(none);
|
||||
background: none;
|
||||
border: none;
|
||||
height: 75%;
|
||||
}
|
||||
}
|
||||
|
||||
.l-time-range-ticks-holder {
|
||||
height: $r3H;
|
||||
.l-time-range-ticks {
|
||||
border-top: 1px solid $colorInteriorBorder;
|
||||
.tick {
|
||||
background-color: $colorInteriorBorder;
|
||||
border:none;
|
||||
width: 1px;
|
||||
margin-left: -1px;
|
||||
&:first-child {
|
||||
margin-left: 0;
|
||||
}
|
||||
.l-time-range-tick-label {
|
||||
color: lighten($colorInteriorBorder, 20%);
|
||||
font-size: 0.7em;
|
||||
position: absolute;
|
||||
margin-left: -0.5 * $tickLblW;
|
||||
text-align: center;
|
||||
top: $r3H;
|
||||
width: $tickLblW;
|
||||
z-index: 2;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.knob {
|
||||
width: $knobW;
|
||||
.range-value {
|
||||
$w: 75px;
|
||||
//@include test();
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
margin-top: -7px; // Label is 13px high
|
||||
white-space: nowrap;
|
||||
width: $w;
|
||||
}
|
||||
&:hover .range-value {
|
||||
color: $colorKey;
|
||||
}
|
||||
&.knob-l {
|
||||
margin-left: $knobW / -2;
|
||||
.range-value {
|
||||
text-align: right;
|
||||
right: $knobW + $interiorMargin;
|
||||
}
|
||||
}
|
||||
&.knob-r {
|
||||
margin-right: $knobW / -2;
|
||||
.range-value {
|
||||
left: $knobW + $interiorMargin;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -19,13 +19,18 @@
|
||||
* this source code distribution or the Licensing information page available
|
||||
* at runtime from the About dialog for additional information.
|
||||
*****************************************************************************/
|
||||
input[type="text"] {
|
||||
input[type="text"],
|
||||
input[type="date"] {
|
||||
@include nice-input();
|
||||
&.filter {
|
||||
&.ng-dirty {
|
||||
// background: red;
|
||||
}
|
||||
}
|
||||
@include input-placeholder {
|
||||
color: darken($colorBodyFg, 10%);
|
||||
font-style: italic;
|
||||
}
|
||||
&.filter {
|
||||
&.ng-dirty {
|
||||
// background: red;
|
||||
}
|
||||
}
|
||||
&.numeric {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user