Cacher is the code snippet organizer for pro developers

https://codepen.io/sivan/pen/alKwf

.input-row
	input(type="text" data-placeholder="Ваше имя" class="input")

// animate placeholder
	$('.input').each(function(){
		var current = $(this);
		if(current.data('placeholder')){
		var dataString = "<span class='input-placeholder-val'>"+current.data('placeholder')+"</span>";
			current.after(dataString);
			if ($(this).val()){
				$(this).attr('data-empty', !this.value);
			}
		}
	});
	$('.input').on('input', function (e) {
		$(e.currentTarget).attr('data-empty', !e.currentTarget.value);
	});
	$('.input-placeholder-val').click(function(){
		$(this).parent().find('.input').focus(); //найти Input и повесить focus
	});
// animate placeholder === end

//animate input
.input-placeholder-val
	position: absolute
	left 20px
	top 20px
	tr(all)
	color $typePrimary

.input:focus+span,
.input[data-empty="false"] + span
	top 10px
	font-size: 10px
	color $typeSecondary!important
//animate input-end