|
|
|
@ -14,57 +14,81 @@
|
|
|
|
|
|
|
|
|
|
<!-- Thumbnail view. First subfolders, then media. -->
|
|
|
|
|
<div class="container-xl">
|
|
|
|
|
<div class="col-2 d-inline-block box border border-gray box-shadow m-3 p-0">
|
|
|
|
|
<div class="col-sm-4 col-md-3 col-lg-2 d-inline-block box border border-gray box-shadow m-md-1 m-lg-2 p-0">
|
|
|
|
|
<a href="temp2">
|
|
|
|
|
<img class="width-fit" src="_thumbnails/temp2/2018-10-14 15.59.20.jpg" alt="diipadaapa">
|
|
|
|
|
</a>
|
|
|
|
|
<span class="width-fit css-truncate css-truncate-target p-1">temp2</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="col-2 d-inline-block box border border-gray box-shadow m-3 p-0" onclick="changePicture(0);displayModal(true);">
|
|
|
|
|
<div class="col-sm-4 col-md-3 col-lg-2 d-inline-block box border border-gray box-shadow m-md-1 m-lg-2 p-0" onclick="changePicture(0);displayModal(true);">
|
|
|
|
|
<img class="width-fit" src="_thumbnails/2018-03-31 16.48.28.jpg" alt="2018-03-31 16.48.28.jpg">
|
|
|
|
|
<span class="width-fit css-truncate css-truncate-target p-1">2018-03-31 16.48.28.jpg</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="col-2 d-inline-block box border border-gray box-shadow m-3 p-0" onclick="changePicture(1);displayModal(true);">
|
|
|
|
|
<div class="col-sm-4 col-md-3 col-lg-2 d-inline-block box border border-gray box-shadow m-md-1 m-lg-2 p-0" onclick="changePicture(1);displayModal(true);">
|
|
|
|
|
<img class="width-fit" src="_thumbnails/2018-07-16 17.28.12 -000.jpg" alt="2018-03-31 16.48.28.jpg">
|
|
|
|
|
<span class="width-fit css-truncate css-truncate-target p-1">2018-07-16 17.28.12 -000.jpg</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="col-2 d-inline-block box border border-gray box-shadow m-3 p-0" onclick="changePicture(2);displayModal(true);">
|
|
|
|
|
<div class="col-sm-4 col-md-3 col-lg-2 d-inline-block box border border-gray box-shadow m-md-1 m-lg-2 p-0" onclick="changePicture(2);displayModal(true);">
|
|
|
|
|
<img class="width-fit" src="_thumbnails/2018-11-10 12.36.05.jpg" alt="2018-11-10 16.48.28.jpg">
|
|
|
|
|
<span class="width-fit css-truncate css-truncate-target p-1">2018-07-16 17.28.12 -000.jpg</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="col-2 d-inline-block box border border-gray box-shadow m-3 p-0" onclick="changePicture(3);displayModal(true);">
|
|
|
|
|
<div class="col-sm-4 col-md-3 col-lg-2 d-inline-block box border border-gray box-shadow m-md-1 m-lg-2 p-0" onclick="changePicture(3);displayModal(true);">
|
|
|
|
|
<img class="width-fit" src="_thumbnails/2016-05-01 18.20.21.jpg" alt="2016-05-01 18.20.21.jpg">
|
|
|
|
|
<span class="width-fit css-truncate css-truncate-target p-1">2016-05-01 18.20.21</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="col-2 d-inline-block box border border-gray box-shadow m-3 p-0" onclick="changePicture(0);displayModal(true);">
|
|
|
|
|
<div class="col-sm-4 col-md-3 col-lg-2 d-inline-block box border border-gray box-shadow m-md-1 m-lg-2 p-0" onclick="changePicture(0);displayModal(true);">
|
|
|
|
|
<img class="width-fit" src="_thumbnails/2018-03-31 16.48.28.jpg" alt="2018-03-31 16.48.28.jpg">
|
|
|
|
|
<span class="width-fit css-truncate css-truncate-target p-1">2018-03-31 16.48.28.jpg</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="col-2 d-inline-block box border border-gray box-shadow m-3 p-0" onclick="changePicture(1);displayModal(true);">
|
|
|
|
|
<div class="col-sm-4 col-md-3 col-lg-2 d-inline-block box border border-gray box-shadow m-md-1 m-lg-2 p-0" onclick="changePicture(1);displayModal(true);">
|
|
|
|
|
<img class="width-fit" src="_thumbnails/2018-07-16 17.28.12 -000.jpg" alt="2018-03-31 16.48.28.jpg">
|
|
|
|
|
<span class="width-fit css-truncate css-truncate-target p-1">2018-07-16 17.28.12 -000.jpg</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="col-2 d-inline-block box border border-gray box-shadow m-3 p-0" onclick="changePicture(2);displayModal(true);">
|
|
|
|
|
<div class="col-sm-4 col-md-3 col-lg-2 d-inline-block box border border-gray box-shadow m-md-1 m-lg-2 p-0" onclick="changePicture(2);displayModal(true);">
|
|
|
|
|
<img class="width-fit" src="_thumbnails/2018-11-10 12.36.05.jpg" alt="2018-11-10 16.48.28.jpg">
|
|
|
|
|
<span class="width-fit css-truncate css-truncate-target p-1">2018-07-16 17.28.12 -000.jpg</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="col-2 d-inline-block box border border-gray box-shadow m-3 p-0" onclick="changePicture(3);displayModal(true);">
|
|
|
|
|
<div class="col-sm-4 col-md-3 col-lg-2 d-inline-block box border border-gray box-shadow m-md-1 m-lg-2 p-0" onclick="changePicture(3);displayModal(true);">
|
|
|
|
|
<img class="width-fit" src="_thumbnails/2016-05-01 18.20.21.jpg" alt="2016-05-01 18.20.21.jpg">
|
|
|
|
|
<span class="width-fit css-truncate css-truncate-target p-1">2016-05-01 18.20.21</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="col-2 d-inline-block box border border-gray box-shadow m-3 p-0" onclick="changePicture(0);displayModal(true);">
|
|
|
|
|
<div class="col-sm-4 col-md-3 col-lg-2 d-inline-block box border border-gray box-shadow m-md-1 m-lg-2 p-0" onclick="changePicture(0);displayModal(true);">
|
|
|
|
|
<img class="width-fit" src="_thumbnails/2018-03-31 16.48.28.jpg" alt="2018-03-31 16.48.28.jpg">
|
|
|
|
|
<span class="width-fit css-truncate css-truncate-target p-1">2018-03-31 16.48.28.jpg</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="col-2 d-inline-block box border border-gray box-shadow m-3 p-0" onclick="changePicture(1);displayModal(true);">
|
|
|
|
|
<div class="col-sm-4 col-md-3 col-lg-2 d-inline-block box border border-gray box-shadow m-md-1 m-lg-2 p-0" onclick="changePicture(1);displayModal(true);">
|
|
|
|
|
<img class="width-fit" src="_thumbnails/2018-07-16 17.28.12 -000.jpg" alt="2018-03-31 16.48.28.jpg">
|
|
|
|
|
<span class="width-fit css-truncate css-truncate-target p-1">2018-07-16 17.28.12 -000.jpg</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="col-2 d-inline-block box border border-gray box-shadow m-3 p-0" onclick="changePicture(2);displayModal(true);">
|
|
|
|
|
<div class="col-sm-4 col-md-3 col-lg-2 d-inline-block box border border-gray box-shadow m-md-1 m-lg-2 p-0" onclick="changePicture(2);displayModal(true);">
|
|
|
|
|
<img class="width-fit" src="_thumbnails/2018-11-10 12.36.05.jpg" alt="2018-11-10 16.48.28.jpg">
|
|
|
|
|
<span class="width-fit css-truncate css-truncate-target p-1">2018-07-16 17.28.12 -000.jpg</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="col-2 d-inline-block box border border-gray box-shadow m-3 p-0" onclick="changePicture(3);displayModal(true);">
|
|
|
|
|
<div class="col-sm-4 col-md-3 col-lg-2 d-inline-block box border border-gray box-shadow m-md-1 m-lg-2 p-0" onclick="changePicture(0);displayModal(true);">
|
|
|
|
|
<img class="width-fit" src="_thumbnails/2018-03-31 16.48.28.jpg" alt="2018-03-31 16.48.28.jpg">
|
|
|
|
|
<span class="width-fit css-truncate css-truncate-target p-1">2018-03-31 16.48.28.jpg</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="col-sm-4 col-md-3 col-lg-2 d-inline-block box border border-gray box-shadow m-md-1 m-lg-2 p-0" onclick="changePicture(1);displayModal(true);">
|
|
|
|
|
<img class="width-fit" src="_thumbnails/2018-07-16 17.28.12 -000.jpg" alt="2018-03-31 16.48.28.jpg">
|
|
|
|
|
<span class="width-fit css-truncate css-truncate-target p-1">2018-07-16 17.28.12 -000.jpg</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="col-sm-4 col-md-3 col-lg-2 d-inline-block box border border-gray box-shadow m-md-1 m-lg-2 p-0" onclick="changePicture(2);displayModal(true);">
|
|
|
|
|
<img class="width-fit" src="_thumbnails/2018-11-10 12.36.05.jpg" alt="2018-11-10 16.48.28.jpg">
|
|
|
|
|
<span class="width-fit css-truncate css-truncate-target p-1">2018-07-16 17.28.12 -000.jpg</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="col-sm-4 col-md-3 col-lg-2 d-inline-block box border border-gray box-shadow m-md-1 m-lg-2 p-0" onclick="changePicture(0);displayModal(true);">
|
|
|
|
|
<img class="width-fit" src="_thumbnails/2018-03-31 16.48.28.jpg" alt="2018-03-31 16.48.28.jpg">
|
|
|
|
|
<span class="width-fit css-truncate css-truncate-target p-1">2018-03-31 16.48.28.jpg</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="col-sm-4 col-md-3 col-lg-2 d-inline-block box border border-gray box-shadow m-md-1 m-lg-2 p-0" onclick="changePicture(1);displayModal(true);">
|
|
|
|
|
<img class="width-fit" src="_thumbnails/2018-07-16 17.28.12 -000.jpg" alt="2018-03-31 16.48.28.jpg">
|
|
|
|
|
<span class="width-fit css-truncate css-truncate-target p-1">2018-07-16 17.28.12 -000.jpg</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="col-sm-4 col-md-3 col-lg-2 d-inline-block box border border-gray box-shadow m-md-1 m-lg-2 p-0" onclick="changePicture(2);displayModal(true);">
|
|
|
|
|
<img class="width-fit" src="_thumbnails/2018-11-10 12.36.05.jpg" alt="2018-11-10 16.48.28.jpg">
|
|
|
|
|
<span class="width-fit css-truncate css-truncate-target p-1">2018-07-16 17.28.12 -000.jpg</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="col-sm-4 col-md-3 col-lg-2 d-inline-block box border border-gray box-shadow m-md-1 m-lg-2 p-0" onclick="changePicture(3);displayModal(true);">
|
|
|
|
|
<img class="width-fit" src="_thumbnails/2016-05-01 18.20.21.jpg" alt="2016-05-01 18.20.21.jpg">
|
|
|
|
|
<span class="width-fit css-truncate css-truncate-target p-1">2016-05-01 18.20.21</span>
|
|
|
|
|
</div>
|
|
|
|
@ -77,14 +101,14 @@
|
|
|
|
|
fix order of header icons, picture height -->
|
|
|
|
|
<div class="position-fixed top-0 left-0 width-full height-full d-flex flex-column flex-justify-center flex-items-center box border border-gray box-shadow p-0 bg-gray" id="modal" hidden>
|
|
|
|
|
<div class="bg-gray clearfix position-absolute top-0 " id="modalHeader">
|
|
|
|
|
<div class="float-right modalControl d-inline-block" onclick="displayModal(false);">
|
|
|
|
|
<i data-feather="x"></i>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="float-right modalControl d-inline-block">
|
|
|
|
|
<a href="#" id="modalDownload" download>
|
|
|
|
|
<i data-feather="download"></i>
|
|
|
|
|
</a>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="float-right modalControl d-inline-block" onclick="displayModal(false);">
|
|
|
|
|
<i data-feather="x"></i>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<img id="modalPicture">
|
|
|
|
|
<div class="bg-gray position-absolute bottom-0" id="modalFooter">
|
|
|
|
|