Кнопка закгузки файла + подстановка картинки
//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