Kleeja/styles/bootstrap/download.html

<div class="mt-3 mb-5">
    <h2 style="word-wrap:break-word;">{title}</h2>
</div>



<div class="row">
    <div class="col-md-6 mt-2">
        <!-- Information File -->
        <!-- <p class="text-center"><strong>{lang.FILE_INFO}</strong></p> -->

            <ul class="list-group">
                <li class="list-group-item d-flex justify-content-between flex-column">
                    <span class="text-secondary">{lang.FILENAME}</span>
                    <div class="list-group-item-text break-all" style="word-wrap:break-word!important;">{name}</div>
                </li>
                <li class="list-group-item d-flex justify-content-between">
                    <span class="text-secondary">{lang.FILETYPE}</span>
                    <div class="list-group-item-text">{type}</div>
                </li>
                <li class="list-group-item d-flex justify-content-between">
                    <span class="text-secondary">{lang.FILESIZE}</span>
                    <div class="list-group-item-text">{size}</div>
                </li>
                <li class="list-group-item d-flex justify-content-between">
                    <span class="text-secondary">{lang.FILEDATE}</span>
                    <div class="list-group-item-text">{time}</div>
                </li>
                <li class="list-group-item d-flex justify-content-between">
                    <span class="text-secondary">{lang.FILEUPS}</span>
                    <div class="list-group-item-text">{uploads}</div>
                </li>
                <IF NAME="fusername">
                <li class="list-group-item d-flex justify-content-between">
                    <span class="list-group-item-heading text-secondary">{lang.USERNAME}</span>
                    <div class="list-group-item-text"><a href="{userfolder}">{fusername}</a></div>
                </li>
                </IF>
                <li class="list-group-item list-group-item-info text-center justify-content-end">
                    <small><a href="{REPORT}" rel="nofollow"> {lang.FILEREPORT}</a></small>
                </li>
            </ul>

    </div>
    <!-- @end-Information-File -->



    <!-- Download box -->
    <div class="col-md-6 mt-2">
            <div class="jumbotron text-center">
                <b>{lang.FILE_FOUNDED}</b>
                <br>
                <img src="{STYLE_PATH}images/spin_lg.gif" id="loadingImage" class="mb-5" alt="{lang.WAIT}" />

                <h2 id="url" class="text">
                    <div class="alert alert-danger">{lang.JS_MUST_ON}</div>
                </h2>

            </div>
    </div>


</div>

<div class="card">
    <div class="card-header">
        <div class="d-flex justify-content-between p-1">
            {lang.ABOUT_FILE}
            <IF NAME="isFileOwnerOfFounder">
                <a href="javascript: void(0)" id="about_edit_save" class="btn btn-primary btn-sm py-0">{lang.EDIT}</a>
            </IF>
        </div>
    </div>
    <div class="list-group list-group-flush">
        <div class="card">
            <div id="about_holder" class="card-body">
                <p id="about_content">{about_file}</p>
                <div class="form-group" >
                    <textarea class="form-control" id="edit_textarea" style="display: none;" rows="3"></textarea>
                  </div>
            </div>
        </div>
    </div>
</div>



<script type="text/javascript">
<!--
var timer = {seconds_w};
ti();
function ti()
{
    if(timer > 0)
    {
        document.getElementById("url").innerHTML = '<div class="wait">{lang.WAIT} ' + timer + ' <\/div>';
        timer = timer - 1;
        setTimeout("ti()", 1000)
    }
    else
    {
        document.getElementById('loadingImage').src = '{STYLE_PATH}images/download.png';
        document.getElementById("url").innerHTML = '<p class="download"><a href="{url_file}" target="_blank" class="btn btn-outline-primary btn-lg">{lang.CLICK_DOWN}<\/a><br /><span class="badge badge-default">{size}<\/span><\/p>';
    }
}

let about_edit_save = document.getElementById('about_edit_save');
let about_content = document.getElementById('about_content');
let edit_textarea = document.getElementById('edit_textarea');

about_edit_save.onclick = () => {
    switch (about_edit_save.textContent) {
        case '{lang.SAVE}':
            about_content.innerHTML = edit_textarea.value == '' ? '{lang.FILE_NO_INFO}' : edit_textarea.value;
            about_content.style.display = '';
            edit_textarea.style.display = 'none';
            about_edit_save.innerHTML = '{lang.EDIT}';
            ajaxRemote('POST', '{config.siteurl}do.php?id={id}', 'change_file_about=1&about=' + edit_textarea.value, (request) => {})
            
            break;

        case '{lang.EDIT}':
            edit_textarea.value = about_content.textContent == '{lang.FILE_NO_INFO}' ? '' : about_content.textContent;
            about_content.style.display = 'none';
            edit_textarea.style.display = '';
            about_edit_save.innerHTML = '{lang.SAVE}'
            break;
    
        default:
            break;
    }
}
//-->
</script>