Cacher is the code snippet organizer for pro developers

//error msg
.msg.bg--stateErrorBG.type--stateError.js-upload-msg.hidden.mb-24 Файл не может быть больше, чем 5 мб

.upload-wrap
	.upload-list
	label.upload
		.btn.btn--md.btn--mark
			+icon("plus","icon")
		.upload__text Прикрепить файл
		input(type="file").upload-btn

// upload
.upload-wrap
	f()
	align-items center
	fw()
.upload
	+below(640px)
		width: 100%
		margin-bottom: 10px
	f()
	cp()
	tr(all)
.upload__text
	color $mark
	font-weight: 500
	flex(mid)
	margin-left: 16px
.upload-list
	width: 100%
.upload-list__el
	background-size: cover
	background-repeat: no-repeat
	position: relative
	overflow: hidden
	margin-bottom: 12px
	f()
	align-items center
	grid-gap 6px
	padding: 6px 12px
	background: $graySnow
	width: 100%
	whtie-space nowrap
	text-overflow ellipsis
	br(10px)
	tr()
	cp()
	font-weight: 700
	span
		overflow: hidden
		white-space nowrap
		text-overflow ellipsis
	.icon
		size 12px
		min-width 16px
	&:hover
		background: darken($graySnow,10)
.upload-btn
	position: absolute
	left -9999px
// upload === end

//upload-btn
$(".upload-btn").change(function () { //Если выбрал файл
	if (this.files && this.files[0].size < 655360) {
		var uploadList = $(this).closest('.upload-wrap').find('.upload-list');
		uploadList.empty()
		uploadList.append('<div class="upload-list__el" onclick="this.parentNode.removeChild(this);"><svg class="icon"><use xlink:href="#close"></use></svg><span></span></div>');
		var currentUpload = $('.upload-list .upload-list__el:last').find('span'); //выбираем куда
		currentUpload.text(this.files[0].name);
		$('.js-upload-msg').addClass('hidden');
	} else{
		$('.js-upload-msg').removeClass('hidden');
	}
});
//upload-btn === end