getlackey/lackey-cms

{>"cms/core/modal"/}

{<body}
<section data-lky-component="table" class="context-media">
    <h1>Add Media</h1>
    <nav>
        <ul>
            <li><a data-tab-nav data-active href="tab-1">Add from computer</a></li>
            <li><a data-tab-nav href="tab-2">Add External URL</a></li>
        </ul>
    </nav>
    <div class="tabs">
        <section data-tab="tab-1">
            <div class="local">
                <div>
                    <form>
                       <div class="profile-photo">
                            <div class="upload">
                                <div id="imageDrop" data-dropzone>
                                    <span>Drop files here</span>
                                    <button id="fileIn" class="btn btn-block btn-primary" type="button">Choose file</button>
                                </div>
                            </div>

                            <div class="preview" style="display:none;">
                                <figure>
                                    <img style="max-width: 250px;" src="" data-lky-hook="avatar" data-lky-media="" />
                                </figure>
                            </div>
                        </div>
                    </form>
                </div>
                <div>
                    <h4>Progress</h4>
                    <div class="progress-container"> </div>
                </div>
            </div>

        </section>


        <section data-tab="tab-2">
            <form data-lky-hook="url.upload" style="margin-top:25px;">
                <p style="margin-top: 55px">Upload an externally hosted image by pasting the URL in the box below.</p>
                <input style="margin: 2rem 1rem 2rem 0; width:450px; color: #333" placeholder="i.e. http://s3.amazon.com/filename" type="text" name="urlUpload" />
                <button data-lky-btn type="submit">Add File</button>
            </form>
        </section>
    </div>
</section>
{/body}