avances en plantillas

This commit is contained in:
JACS 2026-05-01 18:15:40 -05:00
parent 0f84beacf1
commit da0530d79b
2062 changed files with 598814 additions and 22 deletions

View file

@ -0,0 +1,21 @@
MIT License
Copyright (c) 2019 Léon Gersen
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.

View file

@ -0,0 +1,42 @@
# noUiSlider
noUiSlider is a lightweight JavaScript range slider.
- **Accessible** with `aria` and keyboard support
- GPU animated: no reflows, so fast; even on older devices
- All modern browsers and IE > 9 are supported
- **No dependencies**
- Fully **responsive**
- **Multi-touch support** on Android, iOS and Windows devices
- Tons of [examples](https://refreshless.com/nouislider/examples) and answered [Stack Overflow questions](https://stackoverflow.com/questions/tagged/nouislider)
License
-------
noUiSlider is licensed [MIT](https://choosealicense.com/licenses/mit/).
It can be used **for free** and **without any attribution**, in any personal or commercial project.
[Documentation](https://refreshless.com/nouislider/)
-------
An extensive documentation, including **examples**, **options** and **configuration details**, is available here:
[noUiSlider documentation](https://refreshless.com/nouislider/).
Contributing
------------
See [Contributing](CONTRIBUTING.md).
Sponsorship
-----------
noUiSlider is a stable project that still receives a lot of feature requests. A lot of these are interesting, but require a good amount of effort to implement, test and document. Sponsorship of this project will allow me to spend some more of my time on these feature requests.
Please consider sponsoring the project by clicking the "❤ Sponsor" button above. Thanks!
Tooling
-------
Cross-browser testing kindly provided by BrowserStack.
[![Tested with BrowserStack](documentation/assets/browserstack-logo-380x90.png)](http://browserstack.com/)

View file

@ -0,0 +1,304 @@
/* Functional styling;
* These styles are required for noUiSlider to function.
* You don't need to change these rules to apply your design.
*/
.noUi-target,
.noUi-target * {
-webkit-touch-callout: none;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-webkit-user-select: none;
-ms-touch-action: none;
touch-action: none;
-ms-user-select: none;
-moz-user-select: none;
user-select: none;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.noUi-target {
position: relative;
}
.noUi-base,
.noUi-connects {
width: 100%;
height: 100%;
position: relative;
z-index: 1;
}
/* Wrapper for all connect elements.
*/
.noUi-connects {
overflow: hidden;
z-index: 0;
}
.noUi-connect,
.noUi-origin {
will-change: transform;
position: absolute;
z-index: 1;
top: 0;
right: 0;
height: 100%;
width: 100%;
-ms-transform-origin: 0 0;
-webkit-transform-origin: 0 0;
-webkit-transform-style: preserve-3d;
transform-origin: 0 0;
transform-style: flat;
}
/* Offset direction
*/
.noUi-txt-dir-rtl.noUi-horizontal .noUi-origin {
left: 0;
right: auto;
}
/* Give origins 0 height/width so they don't interfere with clicking the
* connect elements.
*/
.noUi-vertical .noUi-origin {
top: -100%;
width: 0;
}
.noUi-horizontal .noUi-origin {
height: 0;
}
.noUi-handle {
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
position: absolute;
}
.noUi-touch-area {
height: 100%;
width: 100%;
}
.noUi-state-tap .noUi-connect,
.noUi-state-tap .noUi-origin {
-webkit-transition: transform 0.3s;
transition: transform 0.3s;
}
.noUi-state-drag * {
cursor: inherit !important;
}
/* Slider size and handle placement;
*/
.noUi-horizontal {
height: 18px;
}
.noUi-horizontal .noUi-handle {
width: 34px;
height: 28px;
right: -17px;
top: -6px;
}
.noUi-vertical {
width: 18px;
}
.noUi-vertical .noUi-handle {
width: 28px;
height: 34px;
right: -6px;
bottom: -17px;
}
.noUi-txt-dir-rtl.noUi-horizontal .noUi-handle {
left: -17px;
right: auto;
}
/* Styling;
* Giving the connect element a border radius causes issues with using transform: scale
*/
.noUi-target {
background: #FAFAFA;
border-radius: 4px;
border: 1px solid #D3D3D3;
box-shadow: inset 0 1px 1px #F0F0F0, 0 3px 6px -5px #BBB;
}
.noUi-connects {
border-radius: 3px;
}
.noUi-connect {
background: #3FB8AF;
}
/* Handles and cursors;
*/
.noUi-draggable {
cursor: ew-resize;
}
.noUi-vertical .noUi-draggable {
cursor: ns-resize;
}
.noUi-handle {
border: 1px solid #D9D9D9;
border-radius: 3px;
background: #FFF;
cursor: default;
box-shadow: inset 0 0 1px #FFF, inset 0 1px 7px #EBEBEB, 0 3px 6px -3px #BBB;
}
.noUi-active {
box-shadow: inset 0 0 1px #FFF, inset 0 1px 7px #DDD, 0 3px 6px -3px #BBB;
}
/* Handle stripes;
*/
.noUi-handle:before,
.noUi-handle:after {
content: "";
display: block;
position: absolute;
height: 14px;
width: 1px;
background: #E8E7E6;
left: 14px;
top: 6px;
}
.noUi-handle:after {
left: 17px;
}
.noUi-vertical .noUi-handle:before,
.noUi-vertical .noUi-handle:after {
width: 14px;
height: 1px;
left: 6px;
top: 14px;
}
.noUi-vertical .noUi-handle:after {
top: 17px;
}
/* Disabled state;
*/
[disabled] .noUi-connect {
background: #B8B8B8;
}
[disabled].noUi-target,
[disabled].noUi-handle,
[disabled] .noUi-handle {
cursor: not-allowed;
}
/* Base;
*
*/
.noUi-pips,
.noUi-pips * {
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.noUi-pips {
position: absolute;
color: #999;
}
/* Values;
*
*/
.noUi-value {
position: absolute;
white-space: nowrap;
text-align: center;
}
.noUi-value-sub {
color: #ccc;
font-size: 10px;
}
/* Markings;
*
*/
.noUi-marker {
position: absolute;
background: #CCC;
}
.noUi-marker-sub {
background: #AAA;
}
.noUi-marker-large {
background: #AAA;
}
/* Horizontal layout;
*
*/
.noUi-pips-horizontal {
padding: 10px 0;
height: 80px;
top: 100%;
left: 0;
width: 100%;
}
.noUi-value-horizontal {
-webkit-transform: translate(-50%, 50%);
transform: translate(-50%, 50%);
}
.noUi-rtl .noUi-value-horizontal {
-webkit-transform: translate(50%, 50%);
transform: translate(50%, 50%);
}
.noUi-marker-horizontal.noUi-marker {
margin-left: -1px;
width: 2px;
height: 5px;
}
.noUi-marker-horizontal.noUi-marker-sub {
height: 10px;
}
.noUi-marker-horizontal.noUi-marker-large {
height: 15px;
}
/* Vertical layout;
*
*/
.noUi-pips-vertical {
padding: 0 10px;
height: 100%;
top: 0;
left: 100%;
}
.noUi-value-vertical {
-webkit-transform: translate(0, -50%);
transform: translate(0, -50%);
padding-left: 25px;
}
.noUi-rtl .noUi-value-vertical {
-webkit-transform: translate(0, 50%);
transform: translate(0, 50%);
}
.noUi-marker-vertical.noUi-marker {
width: 5px;
height: 2px;
margin-top: -1px;
}
.noUi-marker-vertical.noUi-marker-sub {
width: 10px;
}
.noUi-marker-vertical.noUi-marker-large {
width: 15px;
}
.noUi-tooltip {
display: block;
position: absolute;
border: 1px solid #D9D9D9;
border-radius: 3px;
background: #fff;
color: #000;
padding: 5px;
text-align: center;
white-space: nowrap;
}
.noUi-horizontal .noUi-tooltip {
-webkit-transform: translate(-50%, 0);
transform: translate(-50%, 0);
left: 50%;
bottom: 120%;
}
.noUi-vertical .noUi-tooltip {
-webkit-transform: translate(0, -50%);
transform: translate(0, -50%);
top: 50%;
right: 120%;
}
.noUi-horizontal .noUi-origin > .noUi-tooltip {
-webkit-transform: translate(50%, 0);
transform: translate(50%, 0);
left: auto;
bottom: 10px;
}
.noUi-vertical .noUi-origin > .noUi-tooltip {
-webkit-transform: translate(0, -18px);
transform: translate(0, -18px);
top: auto;
right: 28px;
}

View file

@ -0,0 +1,198 @@
interface CssClasses {
target: string;
base: string;
origin: string;
handle: string;
handleLower: string;
handleUpper: string;
touchArea: string;
horizontal: string;
vertical: string;
background: string;
connect: string;
connects: string;
ltr: string;
rtl: string;
textDirectionLtr: string;
textDirectionRtl: string;
draggable: string;
drag: string;
tap: string;
active: string;
tooltip: string;
pips: string;
pipsHorizontal: string;
pipsVertical: string;
marker: string;
markerHorizontal: string;
markerVertical: string;
markerNormal: string;
markerLarge: string;
markerSub: string;
value: string;
valueHorizontal: string;
valueVertical: string;
valueNormal: string;
valueLarge: string;
valueSub: string;
}
export interface PartialFormatter {
to: (value: number) => string | number;
from?: (value: string) => number | false;
}
export interface Formatter extends PartialFormatter {
from: (value: string) => number | false;
}
export declare enum PipsMode {
Range = "range",
Steps = "steps",
Positions = "positions",
Count = "count",
Values = "values"
}
export declare enum PipsType {
None = -1,
NoValue = 0,
LargeValue = 1,
SmallValue = 2
}
declare type WrappedSubRange = [number] | [number, number];
declare type SubRange = number | WrappedSubRange;
interface Range {
min: SubRange;
max: SubRange;
[key: `${number}%`]: SubRange;
}
interface BasePips {
mode: PipsMode;
density?: number;
filter?: PipsFilter;
format?: PartialFormatter;
}
interface PositionsPips extends BasePips {
mode: PipsMode.Positions;
values: number[];
stepped?: boolean;
}
interface ValuesPips extends BasePips {
mode: PipsMode.Values;
values: number[];
stepped?: boolean;
}
interface CountPips extends BasePips {
mode: PipsMode.Count;
values: number;
stepped?: boolean;
}
interface StepsPips extends BasePips {
mode: PipsMode.Steps;
}
interface RangePips extends BasePips {
mode: PipsMode.Range;
}
declare type Pips = PositionsPips | ValuesPips | CountPips | StepsPips | RangePips;
declare type ValueArgument = number | string | null;
declare type StartValues = ValueArgument | ValueArgument[];
declare type HandleAttributes = {
[key: string]: string;
};
interface UpdatableOptions {
range?: Range;
start?: StartValues;
margin?: number;
limit?: number;
padding?: number | number[];
snap?: boolean;
step?: number;
pips?: Pips;
format?: Formatter;
tooltips?: boolean | PartialFormatter | (boolean | PartialFormatter)[];
animate?: boolean;
connect?: "lower" | "upper" | boolean | boolean[];
}
export interface Options extends UpdatableOptions {
range: Range;
orientation?: "vertical" | "horizontal";
direction?: "ltr" | "rtl";
behaviour?: string;
keyboardSupport?: boolean;
keyboardPageMultiplier?: number;
keyboardMultiplier?: number;
keyboardDefaultStep?: number;
documentElement?: HTMLElement;
cssPrefix?: string;
cssClasses?: CssClasses;
ariaFormat?: PartialFormatter;
animationDuration?: number;
handleAttributes?: HandleAttributes[];
}
export interface API {
destroy: () => void;
steps: () => NextStepsForHandle[];
on: (eventName: string, callback: EventCallback) => void;
off: (eventName: string) => void;
get: (unencoded?: boolean) => GetResult;
set: (input: ValueArgument | ValueArgument[], fireSetEvent?: boolean, exactInput?: boolean) => void;
setHandle: (handleNumber: number, value: ValueArgument, fireSetEvent?: boolean, exactInput?: boolean) => void;
reset: (fireSetEvent?: boolean) => void;
disable: (handleNumber?: number) => void;
enable: (handleNumber?: number) => void;
options: Options;
updateOptions: (optionsToUpdate: UpdatableOptions, fireSetEvent: boolean) => void;
target: HTMLElement;
removePips: () => void;
removeTooltips: () => void;
getPositions: () => number[];
getTooltips: () => (HTMLElement | false)[] | null;
getOrigins: () => HTMLElement[];
pips: (grid: Pips) => HTMLElement;
}
interface TargetElement extends HTMLElement {
noUiSlider?: API;
}
interface NearByStep {
startValue: number;
step: number | false;
highestStep: number;
}
interface NearBySteps {
stepBefore: NearByStep;
thisStep: NearByStep;
stepAfter: NearByStep;
}
declare type GetResult = number | string | (string | number)[];
declare type NextStepsForHandle = [number | false | null, number | false | null];
declare type PipsFilter = (value: number, type: PipsType) => PipsType;
declare type EventCallback = (this: API, values: (number | string)[], handleNumber: number, unencoded: number[], tap: boolean, locations: number[], slider: API) => void;
declare class Spectrum {
xPct: number[];
xVal: number[];
xSteps: (number | false)[];
xNumSteps: (number | false)[];
protected xHighestCompleteStep: number[];
protected snap: boolean;
constructor(entry: Range, snap: boolean, singleStep: number);
getDistance(value: number): number[];
getAbsoluteDistance(value: number, distances: number[] | null, direction: boolean): number;
toStepping(value: number): number;
fromStepping(value: number): number;
getStep(value: number): number;
getDefaultStep(value: number, isDown: boolean, size: number): number;
getNearbySteps(value: number): NearBySteps;
countStepDecimals(): number;
hasNoSize(): boolean;
convert(value: number): number;
private handleEntryPoint;
private handleStepPoint;
}
declare const cssClasses: CssClasses;
declare function initialize(target: TargetElement, originalOptions: Options): API;
export { TargetElement as target };
export { initialize as create };
export { cssClasses };
declare const _default: {
__spectrum: typeof Spectrum;
cssClasses: CssClasses;
create: typeof initialize;
};
export default _default;

File diff suppressed because it is too large Load diff

View file

@ -0,0 +1 @@
.noUi-target,.noUi-target *{-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;-ms-touch-action:none;touch-action:none;-ms-user-select:none;-moz-user-select:none;user-select:none;-moz-box-sizing:border-box;box-sizing:border-box}.noUi-target{position:relative}.noUi-base,.noUi-connects{width:100%;height:100%;position:relative;z-index:1}.noUi-connects{overflow:hidden;z-index:0}.noUi-connect,.noUi-origin{will-change:transform;position:absolute;z-index:1;top:0;right:0;height:100%;width:100%;-ms-transform-origin:0 0;-webkit-transform-origin:0 0;-webkit-transform-style:preserve-3d;transform-origin:0 0;transform-style:flat}.noUi-txt-dir-rtl.noUi-horizontal .noUi-origin{left:0;right:auto}.noUi-vertical .noUi-origin{top:-100%;width:0}.noUi-horizontal .noUi-origin{height:0}.noUi-handle{-webkit-backface-visibility:hidden;backface-visibility:hidden;position:absolute}.noUi-touch-area{height:100%;width:100%}.noUi-state-tap .noUi-connect,.noUi-state-tap .noUi-origin{-webkit-transition:transform .3s;transition:transform .3s}.noUi-state-drag *{cursor:inherit!important}.noUi-horizontal{height:18px}.noUi-horizontal .noUi-handle{width:34px;height:28px;right:-17px;top:-6px}.noUi-vertical{width:18px}.noUi-vertical .noUi-handle{width:28px;height:34px;right:-6px;bottom:-17px}.noUi-txt-dir-rtl.noUi-horizontal .noUi-handle{left:-17px;right:auto}.noUi-target{background:#FAFAFA;border-radius:4px;border:1px solid #D3D3D3;box-shadow:inset 0 1px 1px #F0F0F0,0 3px 6px -5px #BBB}.noUi-connects{border-radius:3px}.noUi-connect{background:#3FB8AF}.noUi-draggable{cursor:ew-resize}.noUi-vertical .noUi-draggable{cursor:ns-resize}.noUi-handle{border:1px solid #D9D9D9;border-radius:3px;background:#FFF;cursor:default;box-shadow:inset 0 0 1px #FFF,inset 0 1px 7px #EBEBEB,0 3px 6px -3px #BBB}.noUi-active{box-shadow:inset 0 0 1px #FFF,inset 0 1px 7px #DDD,0 3px 6px -3px #BBB}.noUi-handle:after,.noUi-handle:before{content:"";display:block;position:absolute;height:14px;width:1px;background:#E8E7E6;left:14px;top:6px}.noUi-handle:after{left:17px}.noUi-vertical .noUi-handle:after,.noUi-vertical .noUi-handle:before{width:14px;height:1px;left:6px;top:14px}.noUi-vertical .noUi-handle:after{top:17px}[disabled] .noUi-connect{background:#B8B8B8}[disabled] .noUi-handle,[disabled].noUi-handle,[disabled].noUi-target{cursor:not-allowed}.noUi-pips,.noUi-pips *{-moz-box-sizing:border-box;box-sizing:border-box}.noUi-pips{position:absolute;color:#999}.noUi-value{position:absolute;white-space:nowrap;text-align:center}.noUi-value-sub{color:#ccc;font-size:10px}.noUi-marker{position:absolute;background:#CCC}.noUi-marker-sub{background:#AAA}.noUi-marker-large{background:#AAA}.noUi-pips-horizontal{padding:10px 0;height:80px;top:100%;left:0;width:100%}.noUi-value-horizontal{-webkit-transform:translate(-50%,50%);transform:translate(-50%,50%)}.noUi-rtl .noUi-value-horizontal{-webkit-transform:translate(50%,50%);transform:translate(50%,50%)}.noUi-marker-horizontal.noUi-marker{margin-left:-1px;width:2px;height:5px}.noUi-marker-horizontal.noUi-marker-sub{height:10px}.noUi-marker-horizontal.noUi-marker-large{height:15px}.noUi-pips-vertical{padding:0 10px;height:100%;top:0;left:100%}.noUi-value-vertical{-webkit-transform:translate(0,-50%);transform:translate(0,-50%);padding-left:25px}.noUi-rtl .noUi-value-vertical{-webkit-transform:translate(0,50%);transform:translate(0,50%)}.noUi-marker-vertical.noUi-marker{width:5px;height:2px;margin-top:-1px}.noUi-marker-vertical.noUi-marker-sub{width:10px}.noUi-marker-vertical.noUi-marker-large{width:15px}.noUi-tooltip{display:block;position:absolute;border:1px solid #D9D9D9;border-radius:3px;background:#fff;color:#000;padding:5px;text-align:center;white-space:nowrap}.noUi-horizontal .noUi-tooltip{-webkit-transform:translate(-50%,0);transform:translate(-50%,0);left:50%;bottom:120%}.noUi-vertical .noUi-tooltip{-webkit-transform:translate(0,-50%);transform:translate(0,-50%);top:50%;right:120%}.noUi-horizontal .noUi-origin>.noUi-tooltip{-webkit-transform:translate(50%,0);transform:translate(50%,0);left:auto;bottom:10px}.noUi-vertical .noUi-origin>.noUi-tooltip{-webkit-transform:translate(0,-18px);transform:translate(0,-18px);top:auto;right:28px}

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because it is too large Load diff

View file

@ -0,0 +1,46 @@
{
"name": "nouislider",
"version": "15.8.1",
"main": "dist/nouislider.js",
"module": "dist/nouislider.mjs",
"style": "dist/nouislider.min.css",
"types": "dist/nouislider.d.ts",
"license": "MIT",
"scripts": {
"build": "npm run build:mjs && npm run build:js && npm run build:styles",
"build:js": "npm run build:js:write && npm run build:js:compress && npm run build:js:compress:mjs",
"build:js:write": "rollup -c rollup.config.js",
"build:js:compress": "uglifyjs dist/nouislider.js --compress --mangle --output dist/nouislider.min.js",
"build:js:compress:mjs": "uglifyjs dist/nouislider.mjs --compress --mangle --output dist/nouislider.min.mjs",
"build:types": "tsc --emitDeclarationOnly",
"build:mjs": "tsc --module ES6 && mv dist/nouislider.js dist/nouislider.mjs",
"build:styles": "npm run build:styles:write && npm run build:styles:compress",
"build:styles:write": "lessc src/nouislider.less dist/nouislider.css",
"build:styles:compress": "lessc src/nouislider.less dist/nouislider.min.css --clean-css",
"prepublishOnly": "npm run build",
"format": "prettier src/nouislider.ts --write --config .prettierrc",
"lint": "eslint src/nouislider.ts",
"docs": "cd ../ && php -S localhost:${PORT:-8080} nouislider/documentation/_run/router.php"
},
"devDependencies": {
"@typescript-eslint/eslint-plugin": "^5.10",
"@typescript-eslint/parser": "^5.10",
"eslint": "^8.7",
"less": "^4.1",
"less-plugin-clean-css": "^1.5",
"prettier": "^2.5",
"rollup": "^2.65.0",
"rollup-plugin-typescript2": "^0.31",
"typescript": "^4.5",
"uglify-js": "^3.14"
},
"repository": {
"type": "git",
"url": "git://github.com/leongersen/noUiSlider.git"
},
"files": [
"src",
"dist"
],
"dependencies": {}
}

View file

@ -0,0 +1,3 @@
@import "nouislider.core.less";
@import "nouislider.pips.less";
@import "nouislider.tooltips.less";

View file

@ -0,0 +1,187 @@
/* Functional styling;
* These styles are required for noUiSlider to function.
* You don't need to change these rules to apply your design.
*/
.@{noUi-css-prefix}-target,
.@{noUi-css-prefix}-target * {
-webkit-touch-callout: none;
-webkit-tap-highlight-color: rgba(0,0,0,0);
-webkit-user-select: none;
-ms-touch-action: none;
touch-action: none;
-ms-user-select: none;
-moz-user-select: none;
user-select: none;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.@{noUi-css-prefix}-target {
position: relative;
}
.@{noUi-css-prefix}-base,
.@{noUi-css-prefix}-connects {
width: 100%;
height: 100%;
position: relative;
z-index: 1;
}
/* Wrapper for all connect elements.
*/
.@{noUi-css-prefix}-connects {
overflow: hidden;
z-index: 0;
}
.@{noUi-css-prefix}-connect,
.@{noUi-css-prefix}-origin {
will-change: transform;
position: absolute;
z-index: 1;
top: 0;
right: 0;
height: 100%;
width: 100%;
-ms-transform-origin: 0 0;
-webkit-transform-origin: 0 0;
-webkit-transform-style: preserve-3d;
transform-origin: 0 0;
transform-style: flat;
}
/* Offset direction
*/
.@{noUi-css-prefix}-txt-dir-rtl.@{noUi-css-prefix}-horizontal .@{noUi-css-prefix}-origin {
left: 0;
right: auto;
}
/* Give origins 0 height/width so they don't interfere with clicking the
* connect elements.
*/
.@{noUi-css-prefix}-vertical .@{noUi-css-prefix}-origin {
top: -100%;
width: 0;
}
.@{noUi-css-prefix}-horizontal .@{noUi-css-prefix}-origin {
height: 0;
}
.@{noUi-css-prefix}-handle {
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
position: absolute;
}
.@{noUi-css-prefix}-touch-area {
height: 100%;
width: 100%;
}
.@{noUi-css-prefix}-state-tap .@{noUi-css-prefix}-connect,
.@{noUi-css-prefix}-state-tap .@{noUi-css-prefix}-origin {
-webkit-transition: transform 0.3s;
transition: transform 0.3s;
}
.@{noUi-css-prefix}-state-drag * {
cursor: inherit !important;
}
/* Slider size and handle placement;
*/
.@{noUi-css-prefix}-horizontal {
height: 18px;
}
.@{noUi-css-prefix}-horizontal .@{noUi-css-prefix}-handle {
width: 34px;
height: 28px;
right: -17px;
top: -6px;
}
.@{noUi-css-prefix}-vertical {
width: 18px;
}
.@{noUi-css-prefix}-vertical .@{noUi-css-prefix}-handle {
width: 28px;
height: 34px;
right: -6px;
bottom: -17px;
}
.@{noUi-css-prefix}-txt-dir-rtl.@{noUi-css-prefix}-horizontal .@{noUi-css-prefix}-handle {
left: -17px;
right: auto;
}
/* Styling;
* Giving the connect element a border radius causes issues with using transform: scale
*/
.@{noUi-css-prefix}-target {
background: #FAFAFA;
border-radius: 4px;
border: 1px solid #D3D3D3;
box-shadow: inset 0 1px 1px #F0F0F0, 0 3px 6px -5px #BBB;
}
.@{noUi-css-prefix}-connects {
border-radius: 3px;
}
.@{noUi-css-prefix}-connect {
background: #3FB8AF;
}
/* Handles and cursors;
*/
.@{noUi-css-prefix}-draggable {
cursor: ew-resize;
}
.@{noUi-css-prefix}-vertical .@{noUi-css-prefix}-draggable {
cursor: ns-resize;
}
.@{noUi-css-prefix}-handle {
border: 1px solid #D9D9D9;
border-radius: 3px;
background: #FFF;
cursor: default;
box-shadow: inset 0 0 1px #FFF,
inset 0 1px 7px #EBEBEB,
0 3px 6px -3px #BBB;
}
.@{noUi-css-prefix}-active {
box-shadow: inset 0 0 1px #FFF,
inset 0 1px 7px #DDD,
0 3px 6px -3px #BBB;
}
/* Handle stripes;
*/
.@{noUi-css-prefix}-handle:before,
.@{noUi-css-prefix}-handle:after {
content: "";
display: block;
position: absolute;
height: 14px;
width: 1px;
background: #E8E7E6;
left: 14px;
top: 6px;
}
.@{noUi-css-prefix}-handle:after {
left: 17px;
}
.@{noUi-css-prefix}-vertical .@{noUi-css-prefix}-handle:before,
.@{noUi-css-prefix}-vertical .@{noUi-css-prefix}-handle:after {
width: 14px;
height: 1px;
left: 6px;
top: 14px;
}
.@{noUi-css-prefix}-vertical .@{noUi-css-prefix}-handle:after {
top: 17px;
}
/* Disabled state;
*/
[disabled] .@{noUi-css-prefix}-connect {
background: #B8B8B8;
}
[disabled].@{noUi-css-prefix}-target,
[disabled].@{noUi-css-prefix}-handle,
[disabled] .@{noUi-css-prefix}-handle {
cursor: not-allowed;
}

View file

@ -0,0 +1,2 @@
@noUi-css-prefix: noUi;
@import "nouislider.base.less";

View file

@ -0,0 +1,104 @@
/* Base;
*
*/
.@{noUi-css-prefix}-pips,
.@{noUi-css-prefix}-pips * {
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.@{noUi-css-prefix}-pips {
position: absolute;
color: #999;
}
/* Values;
*
*/
.@{noUi-css-prefix}-value {
position: absolute;
white-space: nowrap;
text-align: center;
}
.@{noUi-css-prefix}-value-sub {
color: #ccc;
font-size: 10px;
}
/* Markings;
*
*/
.@{noUi-css-prefix}-marker {
position: absolute;
background: #CCC;
}
.@{noUi-css-prefix}-marker-sub {
background: #AAA;
}
.@{noUi-css-prefix}-marker-large {
background: #AAA;
}
/* Horizontal layout;
*
*/
.@{noUi-css-prefix}-pips-horizontal {
padding: 10px 0;
height: 80px;
top: 100%;
left: 0;
width: 100%;
}
.@{noUi-css-prefix}-value-horizontal {
-webkit-transform: translate(-50%, 50%);
transform: translate(-50%, 50%);
.@{noUi-css-prefix}-rtl & {
-webkit-transform: translate(50%, 50%);
transform: translate(50%, 50%);
}
}
.@{noUi-css-prefix}-marker-horizontal.@{noUi-css-prefix}-marker {
margin-left: -1px;
width: 2px;
height: 5px;
}
.@{noUi-css-prefix}-marker-horizontal.@{noUi-css-prefix}-marker-sub {
height: 10px;
}
.@{noUi-css-prefix}-marker-horizontal.@{noUi-css-prefix}-marker-large {
height: 15px;
}
/* Vertical layout;
*
*/
.@{noUi-css-prefix}-pips-vertical {
padding: 0 10px;
height: 100%;
top: 0;
left: 100%;
}
.@{noUi-css-prefix}-value-vertical {
-webkit-transform: translate(0, -50%);
transform: translate(0, -50%);
padding-left: 25px;
.@{noUi-css-prefix}-rtl & {
-webkit-transform: translate(0, 50%);
transform: translate(0, 50%);
}
}
.@{noUi-css-prefix}-marker-vertical.@{noUi-css-prefix}-marker {
width: 5px;
height: 2px;
margin-top: -1px;
}
.@{noUi-css-prefix}-marker-vertical.@{noUi-css-prefix}-marker-sub {
width: 10px;
}
.@{noUi-css-prefix}-marker-vertical.@{noUi-css-prefix}-marker-large {
width: 15px;
}

View file

@ -0,0 +1,35 @@
.@{noUi-css-prefix}-tooltip {
display: block;
position: absolute;
border: 1px solid #D9D9D9;
border-radius: 3px;
background: #fff;
color: #000;
padding: 5px;
text-align: center;
white-space: nowrap;
}
.@{noUi-css-prefix}-horizontal .@{noUi-css-prefix}-tooltip {
-webkit-transform: translate(-50%, 0);
transform: translate(-50%, 0);
left: 50%;
bottom: 120%;
}
.@{noUi-css-prefix}-vertical .@{noUi-css-prefix}-tooltip {
-webkit-transform: translate(0, -50%);
transform: translate(0, -50%);
top: 50%;
right: 120%;
}
.@{noUi-css-prefix}-horizontal .@{noUi-css-prefix}-origin > .@{noUi-css-prefix}-tooltip {
-webkit-transform: translate(50%, 0);
transform: translate(50%, 0);
left: auto;
bottom: 10px;
}
.@{noUi-css-prefix}-vertical .@{noUi-css-prefix}-origin > .@{noUi-css-prefix}-tooltip {
-webkit-transform: translate(0, -18px);
transform: translate(0, -18px);
top: auto;
right: 28px;
}

File diff suppressed because it is too large Load diff