izyim/resources/views/partials/component/imageSelector.blade.php

<div class="inlineImageSelector">
    <div class="row align-items-center justify-content-center b-a b-grey btn-rounded m-t-10 m-b-10 selector pointer">
        <div class="col">
            <i class="fa fa-cloud-upload text-complete fs-18 m-r-5 inline v-align-middle lh-14"></i>
            <span class="muted fs-9 inline v-align-middle">click here to upload you image (max 2MB)</span>
        </div>
        <div class="col-auto">
            <div class="b-l b-grey btn-rounded pull-right bold text-complete all-caps fs-11 p-l-15 p-r-15 p-t-10 p-b-10"><i class="fa fa-plus m-r-5"></i>Select file</div>
        </div>
    </div>
    <div class="row align-items-center justify-content-center b-a b-grey m-t-10 m-b-10 preview hide">
        <div class="col-2 p-r-0">
            <div class="no-margin imageContainer">
                <a href="#" class="text-white full-width full-height text-center overlayPreview singleLightBox">
                    <i class="fa fa-search fs-20 hint-text lh-50"></i>
                </a>
            </div>
        </div>
        <div class="col-8">
            <span class="muted fs-9 inline v-align-middle fileName"></span>
        </div>
        <div class="col-2">
            <div class="b-l b-grey pull-right bold muted all-caps fs-11 p-l-15 p-r-15 p-t-10 p-b-10 lh-100"><i class="fa fa-times fs-14 pointer removeImage"></i></div>
        </div>
    </div>
    <input type="file" class="form-control hide" name="{{$inputName}}" accept="image/*">
</div>