From 50169e99055ab40b67f0714411b085a720c250bd Mon Sep 17 00:00:00 2001
From: James Collins <james.collins@outlook.com.au>
Date: Mon, 29 Apr 2024 22:19:10 +1000
Subject: [PATCH] responsive forms

---
 resources/views/admin/post/edit.blade.php     |  2 +-
 resources/views/admin/workshop/edit.blade.php | 24 +++++++++----------
 2 files changed, 13 insertions(+), 13 deletions(-)

diff --git a/resources/views/admin/post/edit.blade.php b/resources/views/admin/post/edit.blade.php
index 7ec695f..99018ce 100644
--- a/resources/views/admin/post/edit.blade.php
+++ b/resources/views/admin/post/edit.blade.php
@@ -13,7 +13,7 @@
             <div class="mb-4">
                 <x-ui.media label="Image" name="hero_media_name" value="{{ $post->hero_media_name ?? '' }}" allow_uploads="true" />
             </div>
-            <div class="flex gap-8">
+            <div class="flex flex-col sm:flex-row sm:gap-8">
                 <div class="flex-1">
                     <x-ui.select label="Status" id="status" name="status" value="{{ $post->status ?? '' }}">
                         <option value="draft" {{ ($post->status ?? '') == 'draft' ? 'selected' :'' }}>Draft</option>
diff --git a/resources/views/admin/workshop/edit.blade.php b/resources/views/admin/workshop/edit.blade.php
index ade5634..5d9c662 100644
--- a/resources/views/admin/workshop/edit.blade.php
+++ b/resources/views/admin/workshop/edit.blade.php
@@ -16,7 +16,7 @@
             <div class="mb-4">
                 <x-ui.media label="Image" name="hero_media_name" value="{{ $workshop->hero_media_name ?? '' }}" allow_uploads="true" />
             </div>
-            <div class="flex gap-8">
+            <div class="flex flex-col sm:flex-row sm:gap-8">
                 <div class="flex-1">
                     <x-ui.select label="Type" name="type" x-model="type">
                         <option value="physical" {{ ($workshop->location_id ?? '') !== '' || !isset($workshop) ? 'selected' : '' }}>Physical</option>
@@ -33,7 +33,7 @@
                     </span>
                 </div>
             </div>
-            <div class="flex gap-8">
+                <div class="flex flex-col sm:flex-row sm:gap-8">
                 <div class="flex-1">
                     <x-ui.input type="datetime-local" label="Start Date" name="starts_at" value="{{ \App\Helpers::timestampNoSeconds($workshop->starts_at ?? '') }}" onchange="updatedStartsAt()"/>
                 </div>
@@ -41,7 +41,7 @@
                     <x-ui.input type="datetime-local" label="End Date" name="ends_at" value="{{ \App\Helpers::timestampNoSeconds($workshop->ends_at ?? '') }}" />
                 </div>
             </div>
-            <div class="flex gap-8">
+            <div class="flex flex-col sm:flex-row sm:gap-8">
                 <div class="flex-1">
                     <x-ui.select label="Status" name="status">
                         <option value="draft" {{ ($workshop->status ?? '') === 'draft' ? 'selected' : '' }}>Draft</option>
@@ -56,15 +56,15 @@
                     <x-ui.input type="datetime-local" label="Publish Date" name="publish_at" value="{{ \App\Helpers::timestampNoSeconds($workshop->publish_at ?? '') }}" onchange="updatedPublishAt()" />
                 </div>
             </div>
-                <div class="flex gap-8">
-                    <div class="flex-1">
-                        &nbsp;
-                    </div>
-                    <div class="flex-1">
-                        <x-ui.input type="datetime-local" label="Closes Date" name="closes_at" value="{{ \App\Helpers::timestampNoSeconds($workshop->closes_at ?? '') }}" />
-                    </div>
+            <div class="flex flex-col sm:flex-row sm:gap-8">
+                <div class="hidden sm:block flex-1">
+                    &nbsp;
                 </div>
-            <div class="flex gap-8">
+                <div class="flex-1">
+                    <x-ui.input type="datetime-local" label="Closes Date" name="closes_at" value="{{ \App\Helpers::timestampNoSeconds($workshop->closes_at ?? '') }}" />
+                </div>
+            </div>
+            <div class="flex flex-col sm:flex-row sm:gap-8">
                 <div class="flex-1">
                     <x-ui.input label="Price" name="price" info="Leave blank to hide from public. Also supports Free, TBD or TBC" value="{{ $workshop->price ?? '' }}" />
                 </div>
@@ -72,7 +72,7 @@
                     <x-ui.input label="Ages" name="ages" info="Leave blank to hide from public" value="{{ $workshop->ages ?? '8+' }}" />
                 </div>
             </div>
-            <div class="flex gap-8">
+            <div class="flex flex-col sm:flex-row sm:gap-8">
                 <div class="flex-1">
                     <x-ui.select label="Registration" name="registration" x-model="registration" onchange="document.getElementsByName('registration_data').forEach((e)=>e.value='')">
                         <option value="none" {{ (old('registration', $workshop->registration ?? '')) === 'none' ? 'selected' : '' }}>None</option>