diff --git a/frontend/app/gallery/lightbox/lightbox.gallery.component.css b/frontend/app/gallery/lightbox/lightbox.gallery.component.css index 63ff984..90a533a 100644 --- a/frontend/app/gallery/lightbox/lightbox.gallery.component.css +++ b/frontend/app/gallery/lightbox/lightbox.gallery.component.css @@ -90,7 +90,6 @@ info-panel { position: fixed; height: 100vh; right: 0; - width: 0; top: 0; transition: all 0.3s ease-in-out; } diff --git a/frontend/app/gallery/lightbox/lightbox.gallery.component.html b/frontend/app/gallery/lightbox/lightbox.gallery.component.html index c9b59d7..f434183 100644 --- a/frontend/app/gallery/lightbox/lightbox.gallery.component.html +++ b/frontend/app/gallery/lightbox/lightbox.gallery.component.html @@ -23,7 +23,7 @@ endLeft:photoDimension.left}}" -->
+ [style.width.px]="getScreenWidth()">
{ top: 0, left: 0, @@ -285,7 +282,7 @@ export class GalleryLightboxComponent implements OnDestroy { } } - hideInfoPanel() { + hideInfoPanel(animate: boolean = true) { this.iPvisibilityTimer = setTimeout(() => { this.iPvisibilityTimer = null; this.infoPanelVisible = false; @@ -294,20 +291,23 @@ export class GalleryLightboxComponent implements OnDestroy { const starPhotoPos = this.calcLightBoxPhotoDimension(this.activePhoto.gridPhoto.photo); this.infoPanelWidth = 0; const endPhotoPos = this.calcLightBoxPhotoDimension(this.activePhoto.gridPhoto.photo); - this.animatePhoto(starPhotoPos, endPhotoPos); - this.contentWidth = this.getScreenWidth(); - this.animateLightbox({ - top: 0, - left: 0, - width: this.getScreenWidth() - 400, - height: this.getScreenHeight() - }, - { - top: 0, - left: 0, - width: this.getScreenWidth(), - height: this.getScreenHeight() - }); + if (animate) { + this.animatePhoto(starPhotoPos, endPhotoPos); + } + if (animate) { + this.animateLightbox({ + top: 0, + left: 0, + width: this.getScreenWidth() - 400, + height: this.getScreenHeight() + }, + { + top: 0, + left: 0, + width: this.getScreenWidth(), + height: this.getScreenHeight() + }); + } }