FileUpload Jasny v4.0.0
We have styled the select picker to look similar to the dropdown and the other inputs.
For more information please check Full Github Documentation.
<div class="fileinput fileinput-new text-center mr-5" data-provides="fileinput">
<div class="fileinput-new thumbnail img-raised">
<img src="/assets/img/image_placeholder.jpg" alt="...">
</div>
<div class="fileinput-preview fileinput-exists thumbnail img-raised"></div>
<div>
<span class="btn btn-raised btn-round btn-primary btn-simple btn-file">
<span class="fileinput-new">Select image</span>
<span class="fileinput-exists">Change</span>
<input type="file" name="..." />
</span>
<a href="javascript:;" class="btn btn-danger btn-round fileinput-exists" data-dismiss="fileinput">
<i class="fa fa-times"></i> Remove</a>
</div>
</div>
<div class="fileinput fileinput-new text-center ml-5" data-provides="fileinput">
<div class="fileinput-new thumbnail img-circle img-raised">
<img src="/assets/img/placeholder.jpg" alt="...">
</div>
<div class="fileinput-preview fileinput-exists thumbnail img-circle img-raised"></div>
<div>
<span class="btn btn-raised btn-round btn-primary btn-simple btn-file">
<span class="fileinput-new">Add Photo</span>
<span class="fileinput-exists">Change</span>
<input type="file" name="..." /></span>
<br />
<a href="javascript:;" class="btn btn-danger btn-round fileinput-exists" data-dismiss="fileinput"><i class="fa fa-times"></i> Remove</a>
</div>
</div>