From 6360f79ba32be94acc28769736d56ea78183d2a4 Mon Sep 17 00:00:00 2001
From: Marc Sauer <info@marcsauer.net>
Date: Fri, 17 Jul 2026 14:00:33 +0200
Subject: [PATCH] fix gallery ui in the edit aircraft page

---
 resources/views/fleet/_gallery.blade.php | 20 ++++++++++++++----
 resources/views/fleet/edit.blade.php     | 27 +++++++++++++-----------
 2 files changed, 31 insertions(+), 16 deletions(-)

diff --git a/resources/views/fleet/_gallery.blade.php b/resources/views/fleet/_gallery.blade.php
index f157583..1c7f6bd 100644
--- a/resources/views/fleet/_gallery.blade.php
+++ b/resources/views/fleet/_gallery.blade.php
@@ -50,9 +50,9 @@
                 @if($canUpload) Upload the first one from the <strong>Upload</strong> tab. @endif
             </div>
         @else
-            <div class="row g-3 gallery-group">
+            <div class="gallery-group">
                 @foreach($approved as $img)
-                    <div class="col-6 col-md-4">
+                    <div class="gallery-cell">
                         <div class="position-relative gallery-tile">
                             <button type="button"
                                     class="gallery-thumb"
@@ -106,9 +106,9 @@ class="gallery-thumb"
                     {{ $canModerate ? 'Awaiting review' : 'Your uploads awaiting review' }}
                     <span class="badge bg-warning-subtle text-warning-emphasis border border-warning-subtle ms-1">{{ $pending->count() }}</span>
                 </h6>
-                <div class="row g-3 gallery-group">
+                <div class="gallery-group">
                     @foreach($pending as $img)
-                        <div class="col-6 col-md-4">
+                        <div class="gallery-cell">
                             <div class="position-relative gallery-tile">
                                 <button type="button"
                                         class="gallery-thumb is-pending"
@@ -189,6 +189,18 @@ class="form-control @error('screenshot') is-invalid @enderror" required>
 
 @once
 <style>
+    /* Thumbnail grid — sizes to the container, not the viewport, so tiles stay
+       a sensible size whether the gallery is full-width (edit) or in a column
+       (detail) instead of ballooning into 3 giant shots on wide screens. */
+    .aircraft-gallery .gallery-group {
+        display: grid;
+        /* Capped max (not 1fr) so a lone screenshot on the full-width edit page
+           stays tile-sized instead of stretching across the whole row. */
+        grid-template-columns: repeat(auto-fill, minmax(200px, 260px));
+        gap: 1rem;
+        justify-content: start;
+    }
+
     /* Thumbnails */
     .aircraft-gallery .gallery-thumb {
         display: block;
diff --git a/resources/views/fleet/edit.blade.php b/resources/views/fleet/edit.blade.php
index b41d0ad..c8f1d33 100644
--- a/resources/views/fleet/edit.blade.php
+++ b/resources/views/fleet/edit.blade.php
@@ -29,7 +29,7 @@
         </div>
     @endif
 
-    <form action="{{ route('editaircraft', $aircraft->id) }}" method="POST">
+    <form action="{{ route('editaircraft', $aircraft->id) }}" method="POST" id="editAircraftForm">
         @csrf
         <input type="hidden" id="used_by" name="used_by" value="{{ session('activeairline')->id }}" required>
 
@@ -224,17 +224,6 @@
                     </div>
                 </div>
 
-                <!-- Submit / Cancel Card -->
-                <div class="card border-0 shadow-sm">
-                    <div class="card-body p-4 d-grid gap-2">
-                        <button type="submit" class="btn btn-primary py-2.5 fw-semibold d-flex align-items-center justify-content-center gap-2">
-                            <i class="bi bi-check-circle-fill"></i> Save Changes
-                        </button>
-                        <a href="{{ route('fleetmanager') }}" class="btn btn-outline-secondary py-2.5 text-center">
-                            Cancel
-                        </a>
-                    </div>
-                </div>
             </div>
         </div>
     </form>
@@ -292,6 +281,17 @@
             </form>
         </div>
     </div>
+
+    {{-- Sticky action bar: pins to the viewport bottom while scrolling the form,
+         then rests above the site footer. Submit targets the form via form="editAircraftForm". --}}
+    <div class="edit-actionbar bg-body border rounded-3 shadow-lg mt-4 p-2 d-flex justify-content-end gap-2">
+        <a href="{{ route('fleetmanager') }}" class="btn btn-outline-secondary px-4">
+            Cancel
+        </a>
+        <button type="submit" form="editAircraftForm" class="btn btn-primary px-4 fw-semibold d-flex align-items-center gap-2">
+            <i class="bi bi-check-circle-fill"></i> Save Changes
+        </button>
+    </div>
 </div>
 
 <script>
@@ -318,5 +318,8 @@
     .fs-7 { font-size: 0.775rem !important; }
     .fs-8 { font-size: 0.7rem; }
     .tracking-wider { letter-spacing: 0.05em; }
+    /* Sticky action bar: floats just above the viewport bottom while the form is
+       scrolled, resting at its natural spot (above the site footer) at page end. */
+    .edit-actionbar { position: sticky; bottom: 1rem; z-index: 1020; }
 </style>
 @endsection
\ No newline at end of file