DashRock
Mark Jhonsan
My Profile
Setting
Logout
MAIN NAVIGATION
Dashboard
Dashboard v1
Dashboard v2
Dashboard v3
UI Elements
Typography
Buttons
Cards
Checkboxes & Radios
Tabs & Accordions
Modals
BS Elements
Pagination
List Groups
Alerts
Progress Bars
Notifications
Sweet Alerts
Color Palette
Lightbox gallery
Components
Grid Layouts
Nesteble
Tree View
Switcher Buttons
Range Sliders
Vertical Timeline
Horizontal Timeline
Pricing Tables
Image Carousels
Widgets
New
Authentication
SignIn 1
SignIn 2
SignUp 1
SignUp 2
Reset Password 1
Reset Password 2
DARK AUTHENTICATION
Dark SignIn 1
Dark SignIn 2
Dark SignUp 1
Dark SignUp 2
Dark Reset Password 1
Dark Reset Password 2
Charts
Morris Charts
Chart JS
C3 Chart
Flot Chart
Peity Charts
Sparkline Charts
Other Charts
Forms
Basic Inputs
Input Groups
Form Layouts
Color Forms
Gradient Forms
Form Advanced
Form Validation
Form Wizard
Form Editor
Form Uploads
Calendar
New
Tables
Simple Tables
Header Tables
Color Tables
Striped Color Tables
Data Tables
UI Icons
Material Design
Font Awesome
Themify Icons
Line Icons
Flag Icons
Mailbox
12
Inbox
Compose
Read Mail
Maps
Google Maps
Vector Maps
Extra Pages
Invoice
User Profile
Lockscreen
Blank Page
Coming Soon
403 Error
404 Error
500 Error
Multilevel
Level One
Level One
Level Two
Level Two
Level Three
Level Three
Level One
LABELS
Disk Space
Server Load
Information
You have 4 new messages
4
Jhon Deo
Lorem ipsum dolor sit amet...
Today, 4:10 PM
Sara Jen
Lorem ipsum dolor sit amet...
Yesterday, 8:30 AM
Dannish Josh
Lorem ipsum dolor sit amet...
5/11/2018, 2:50 PM
Katrina Mccoy
Lorem ipsum dolor sit amet.
1/11/2018, 2:50 PM
See All Messages
10
You have 10 Notifications
10
New Registered Users
Lorem ipsum dolor sit amet...
New Received Orders
Lorem ipsum dolor sit amet...
New Updates
Lorem ipsum dolor sit amet...
See All Notifications
English
French
Chinese
German
Katrina Mccoy
katrina92@example.com
Inbox
Account
Setting
Logout
Range Slider
DashRock
Components
Range Slider
Setting
Action
Another action
Something else here
Separated link
Range Slider
Start without params
10
100
0
0
10
Set min value, max value and start point
100
1 000
0
0
550
Set type to double and specify range, also showing grid and adding prefix "$"
$0
$1 000
$200
$800
$200 — $800
0
250
500
750
1 000
Set up range with negative values
-1 000
1 000
-500
500
-500 — 500
-1 000
-500
0
500
1 000
Using step 250
-1 000
1 000
-500
500
-500 — 500
-1 000
-500
0
500
1 000
Set up range with fractional values, using fractional step
-12.8
12.8
-3.2
3.2
-3.2 — 3.2
-12.8
-6.4
0
6.4
12.8
Set up you own numbers
0
1 000 000
10
100 000
10 — 100 000
0
10
100
1 000
10 000
100 000
1 000 000
Using any strings as your values
zero
ten
0
0
five
zero
one
two
three
four
five
six
seven
eight
nine
ten
One more example with strings
January
December
0
0
April
January
February
March
April
May
June
July
August
September
October
November
December
No prettify. Big numbers are ugly and unreadable
1000
1000000
0
0
100000
1000
250750
500500
750250
1000000
Prettify enabled. Much better!
1 000
1 000 000
0
0
200 000
1 000
250 750
500 500
750 250
1 000 000
Don't like space as separator? Use anything you like!
1.000
1.000.000
0
0
300.000
1.000
250.750
500.500
750.250
1.000.000
You don't like default prettify function? Use your own!
814
860275
0
0
277978
131
36976
293301
208833
391872
Using prefixes
$0
$10 000
$1 000
$10 000
$1 000 — $10 000
0
2 500
5 000
7 500
10 000
Using postfixes
-90°
90°
0
0
0°
-90
-45
0
45
90
Whant to show that max number is not the biggest one?
Age 18
Age 70+
0
0
Age 30
18
31
44
57
70
Taking care about how from and to values connect? Use decorate_both option:
Weight: 100 million pounds
Weight: 200 million pounds
Weight: 145 million pounds
Weight: 155 million pounds
Weight: 145 million pounds — Weight: 155 million pounds
Remove double decoration
Weight: 100 million pounds
Weight: 200 million pounds
Weight: 145 million pounds
Weight: 155 million pounds
Weight: 145 — 155 million pounds
Use your own separator symbol with values_separator option. Like →
Weight: 100 million pounds
Weight: 200 million pounds
Weight: 148 million pounds
Weight: 152 million pounds
Weight: 148 million pounds → Weight: 152 million pounds
Or " to ":
Range: 100 light years
Range: 200 light years
Range: 148 light years
Range: 152 light years
Range: 148 to 152 light years
You can disable all the sliders visual details, if you wish. Like this:
0
1
0
0
0
Or hide any part you wish
0
1
0
0
0
1 000
1 250
1 500
1 750
2 000
And some more
1 000
2 000
0
0
0
And some more
0
1
1 200
1 800
1 200 — 1 800