Cacher is the code snippet organizer for pro developers

//range slider simple
  $(".range").ionRangeSlider({
 		min:10,
 		max:100,
 		prefix: "Списать ",
 		postfix: " баллов"
 	});
// take val from input
	var start = 100 
	var end = 1000
 	$(".range").ionRangeSlider({
 		min:start,
 		max:end
 	});
 	onlyInteger(".range-control");
	var slider = $(".range").data("ionRangeSlider");
	$('.range-start').val(100);
	$('.range-end').val(1000);
	$('.range-control').keyup(function() {
		start = $('.range-start').val();
		end = $('.range-end').val();
		slider.update({
   			 min: start,
   			 max: end,
			});
		console.log(start);
	});


	$(".calc-slider").ionRangeSlider({
 		min: 1,
    max: 100,
 		grid: false,
 		onChange: function (data) {
			$('.calc-range__info__val span').text(data.from); //get-data
    }
 	});

.range__wrap
	margin-bottom 50px
	margin-top -20px
	.irs-bar-edge
		background blue
		height 15px
		border-radius 10px 0px 0px 10px
		width 25px
	.irs-bar
		height 15px
		background blue
	.irs-line-left
		height 15px
		border-radius 10px 0px 0px 10px
		background #e6ecf6 
	.irs-line-right
		height 15px
		background #e6ecf6 
		border-radius 0px 10px 10px 0px
	.irs-line-mid
		background #e6ecf6 
		height 15px
	.irs-line
		height 15px
	.single
		background url('../img/range-btn.png')
	.irs-slider
		width 45px
		height 30px
	.irs-min, .irs-max,.irs-single
		top 45px
		background transparent
		color black
.range__wrap--green
	.irs-bar-edge
		background green
	.irs-bar
		background green
.range-set
	flex(between)
	input
		+below(768px)
			width 80px
		padding 0
		margin-bottom 10px
		border 1px solid grey--light
		padding 3px
		font-size 16px
		width 110px

// http://ionden.com/a/plugins/ion.rangeSlider/
//bower install ionrangeslider@2.3.0 --save-dev
//link(rel="stylesheet", href="bower/ion.rangeSlider/css/ion.rangeSlider.css")
//link(rel="stylesheet", href="bower/ion.rangeSlider/css/ion.rangeSlider.skinNice.css")
//script(src="bower/ion.rangeSlider/js/ion.rangeSlider.js")

//simple
input(type="range" class="range-start range-control")

//take info from input
.range-set
		.range-set__el
			input(type="text" class="range-start range-control")
			select.select--style
				option руб
				option дол
				option евр
		.range-set__el
			select.select--style.range-set__el--mobile
				option руб
				option дол
				option евр
			input(type="text" class="range-end range-control")
	.range__wrap
		input(type="text" class="range " name="example_name" value="" )