Add device detection for portrait mode in directories listing

package-lock.json

@@ -14027,6 +14027,21 @@
         }
       }
     },
+    "ngx-device-detector": {
+      "version": "2.0.9",
+      "resolved": "https://registry.npmjs.org/ngx-device-detector/-/ngx-device-detector-2.0.9.tgz",
+      "integrity": "sha512-bsAO7w7REwHPTF1p4MrZJFqsNJLW8vnIcNhYDQxwFwZe3JOpIEcV0VebJCIG0HzkLg3/YlVsatTnXkErw111BA==",
+      "requires": {
+        "tslib": "^2.0.0"
+      },
+      "dependencies": {
+        "tslib": {
+          "version": "2.2.0",
+          "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.2.0.tgz",
+          "integrity": "sha512-gS9GVHRU+RGn5KQM2rllAlR3dU6m7AcpJKdtH8gFvQiC4Otgk98XnmMU+nZenHt/+VhnBPWwgrJsyrdcw6i23w=="
+        }
+      }
+    },
     "ngx-toastr": {
       "version": "13.2.1",
       "resolved": "https://registry.npmjs.org/ngx-toastr/-/ngx-toastr-13.2.1.tgz",

package.json

@@ -47,6 +47,7 @@
     "image-size": "0.9.7",
     "jimp": "0.16.1",
     "locale": "0.1.0",
+    "ngx-device-detector": "^2.0.9",
     "node-geocoder": "3.27.0",
     "reflect-metadata": "0.1.13",
     "sharp": "0.23.4",

src/frontend/app/ui/gallery/directories/directories.component.ts

@@ -1,4 +1,5 @@
 import {Component, ElementRef, Input, OnChanges} from '@angular/core';
+import { DeviceDetectorService } from 'ngx-device-detector';
 import {DirectoryDTO} from '../../../../../common/entities/DirectoryDTO';
 
 @Component({
@@ -10,8 +11,10 @@ export class DirectoriesComponent implements OnChanges {
 
   @Input() directories: DirectoryDTO[];
   size: number;
+  isDesktop: boolean;
 
-  constructor(private container: ElementRef) {
+  constructor(private container: ElementRef, private deviceService: DeviceDetectorService) {
+    this.isDesktop = this.deviceService.isDesktop();
   }
 
   ngOnChanges(): void {
@@ -19,7 +22,7 @@ export class DirectoriesComponent implements OnChanges {
   }
 
   private updateSize(): void {
-    if (window.innerWidth < window.innerHeight) {
+    if (!this.isDesktop && window.innerWidth < window.innerHeight) {
       // On portrait mode, show 2 directories side by side with some padding
       this.size = Math.round(window.innerWidth / 2) - 25;
     } else {