1
0
Fork 0
mirror of https://github.com/alangrainger/immich-public-proxy.git synced 2025-01-15 12:36:44 +01:00

Fix responsive viewport

This commit is contained in:
Alan Grainger 2024-10-29 10:49:54 +01:00
parent 1498fe3a15
commit 320722908f
4 changed files with 16 additions and 5 deletions

View file

@ -1,3 +1,4 @@
IMMICH_URL=http://localhost:2283
API_KEY="Get this from your Account Settings page"
PORT=3000
SERVER_URL=http://localhost:3000
SERVER_PORT=3000

8
public/lg-fullscreen.min.js vendored Normal file
View file

@ -0,0 +1,8 @@
/**
* lightgallery | 2.8.0-beta.3 | May 3rd 2024
* http://www.lightgalleryjs.com/
* Copyright (c) 2020 Sachin Neravath;
* @license GPLv3
*/
!function(e,l){"object"==typeof exports&&"undefined"!=typeof module?module.exports=l():"function"==typeof define&&define.amd?define(l):(e="undefined"!=typeof globalThis?globalThis:e||self).lgFullscreen=l()}(this,(function(){"use strict";var e=function(){return(e=Object.assign||function(e){for(var l,n=1,t=arguments.length;n<t;n++)for(var c in l=arguments[n])Object.prototype.hasOwnProperty.call(l,c)&&(e[c]=l[c]);return e}).apply(this,arguments)},l={fullScreen:!0,fullscreenPluginStrings:{toggleFullscreen:"Toggle Fullscreen"}};return function(){function n(n,t){return this.core=n,this.$LG=t,this.settings=e(e({},l),this.core.settings),this}return n.prototype.init=function(){var e="";if(this.settings.fullScreen){if(!(document.fullscreenEnabled||document.webkitFullscreenEnabled||document.mozFullScreenEnabled||document.msFullscreenEnabled))return;e='<button type="button" aria-label="'+this.settings.fullscreenPluginStrings.toggleFullscreen+'" class="lg-fullscreen lg-icon"></button>',this.core.$toolbar.append(e),this.fullScreen()}},n.prototype.isFullScreen=function(){return document.fullscreenElement||document.mozFullScreenElement||document.webkitFullscreenElement||document.msFullscreenElement},n.prototype.requestFullscreen=function(){var e=document.documentElement;e.requestFullscreen?e.requestFullscreen():e.msRequestFullscreen?e.msRequestFullscreen():e.mozRequestFullScreen?e.mozRequestFullScreen():e.webkitRequestFullscreen&&e.webkitRequestFullscreen()},n.prototype.exitFullscreen=function(){document.exitFullscreen?document.exitFullscreen():document.msExitFullscreen?document.msExitFullscreen():document.mozCancelFullScreen?document.mozCancelFullScreen():document.webkitExitFullscreen&&document.webkitExitFullscreen()},n.prototype.fullScreen=function(){var e=this;this.$LG(document).on("fullscreenchange.lg.global"+this.core.lgId+" \n webkitfullscreenchange.lg.global"+this.core.lgId+" \n mozfullscreenchange.lg.global"+this.core.lgId+" \n MSFullscreenChange.lg.global"+this.core.lgId,(function(){e.core.lgOpened&&e.core.outer.toggleClass("lg-fullscreen-on")})),this.core.outer.find(".lg-fullscreen").first().on("click.lg",(function(){e.isFullScreen()?e.exitFullscreen():e.requestFullscreen()}))},n.prototype.closeGallery=function(){this.isFullScreen()&&this.exitFullscreen()},n.prototype.destroy=function(){this.$LG(document).off("fullscreenchange.lg.global"+this.core.lgId+" \n webkitfullscreenchange.lg.global"+this.core.lgId+" \n mozfullscreenchange.lg.global"+this.core.lgId+" \n MSFullscreenChange.lg.global"+this.core.lgId)},n}()}));

View file

@ -3,13 +3,13 @@ html {
}
#lightgallery img {
height: 250px;
height: 300px;
margin: 4px;
}
#lightgallery a {
position: relative; /* Establishes a positioning context */
display: inline-block; /* Allows the container to wrap around the image */
position: relative;
display: inline-block;
text-decoration: none;
margin: 0;
padding: 0;

View file

@ -1,6 +1,7 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
<title>Gallery</title>
<link type="text/css" rel="stylesheet" href="/style.css"/>
<link type="text/css" rel="stylesheet" href="/lightgallery-bundle.min.css"/>
@ -21,12 +22,13 @@
}) %>
</div>
<script src="/lightgallery.min.js"></script>
<script src="/lg-fullscreen.min.js"></script>
<script src="/lg-thumbnail.min.js"></script>
<script src="/lg-video.min.js"></script>
<script src="/lg-zoom.min.js"></script>
<script type="text/javascript">
lightGallery(document.getElementById('lightgallery'), {
plugins: [lgZoom, lgThumbnail, lgVideo],
plugins: [lgZoom, lgThumbnail, lgVideo, lgFullscreen],
licenseKey: '0000-0000-000-0000',
speed: 500
})