feat: optional fixed viewport background on public pages

Adds background_fixed column, admin checkbox, fixed-position layers on the public layout, Dutch strings, and store tests.

Made-with: Cursor

resources/views/admin/pages/_form.blade.php

@@ -98,6 +98,19 @@
                 @enderror
             </div>
         </div>
+        <div class="mt-4">
+            <label class="inline-flex cursor-pointer items-center gap-2 text-sm text-slate-800">
+                <input
+                    type="checkbox"
+                    name="background_fixed"
+                    value="1"
+                    class="rounded border-slate-300 text-indigo-600 focus:ring-indigo-500"
+                    @checked(old('background_fixed', $page?->background_fixed ?? false))
+                />
+                {{ __('Fix background to viewport') }}
+            </label>
+            <p class="mt-1 text-xs text-slate-600">{{ __('When enabled, the background image and overlay stay fixed while visitors scroll long content.') }}</p>
+        </div>
     </div>
 
     <div class="grid gap-6 sm:grid-cols-2">

resources/views/public/page.blade.php

@@ -20,6 +20,9 @@
     $formButtonLabel = (string) (data_get($formContent, 'button_label') ?: __('public.register_button'));
     $formButtonColor = (string) data_get($formContent, 'button_color', '#F47B20');
     $formButtonTextColor = (string) data_get($formContent, 'button_text_color', '#FFFFFF');
+    $bgFixed = $page->background_fixed;
+    $bgLayerPosition = $bgFixed ? 'fixed inset-0 pointer-events-none z-0' : 'absolute inset-0';
+    $overlayPosition = $bgFixed ? 'fixed inset-0 pointer-events-none z-[1]' : 'absolute inset-0';
 @endphp
 
 @extends('layouts.public')
@@ -28,19 +31,19 @@
     <div class="relative min-h-screen w-full overflow-x-hidden">
         @if ($bgUrl !== null)
             <div
-                class="absolute inset-0 bg-cover bg-center bg-no-repeat"
+                class="{{ $bgLayerPosition }} bg-cover bg-center bg-no-repeat"
                 style="background-image: url('{{ e($bgUrl) }}')"
                 aria-hidden="true"
             ></div>
         @else
             <div
-                class="absolute inset-0 bg-gradient-to-br from-slate-950 via-slate-900 to-slate-950"
+                class="{{ $bgLayerPosition }} bg-gradient-to-br from-slate-950 via-slate-900 to-slate-950"
                 aria-hidden="true"
             ></div>
         @endif
 
         <div
-            class="absolute inset-0"
+            class="{{ $overlayPosition }}"
             style="background-color: {{ e($overlayColor) }}; opacity: {{ $overlayOpacity }}"
             aria-hidden="true"
         ></div>