From 79c6693acf4844295bdce3b982505d5506fad82d Mon Sep 17 00:00:00 2001
From: cybernexus <raczdwork@proton.me>
Date: Wed, 2 Oct 2024 21:05:55 +0200
Subject: [PATCH] Modify the edit article page layout to match.

---
 .../livewire/admin-panel/post-index.blade.php | 43 +++++++++----------
 1 file changed, 20 insertions(+), 23 deletions(-)

diff --git a/resources/views/livewire/admin-panel/post-index.blade.php b/resources/views/livewire/admin-panel/post-index.blade.php
index e7a3645..49ba716 100644
--- a/resources/views/livewire/admin-panel/post-index.blade.php
+++ b/resources/views/livewire/admin-panel/post-index.blade.php
@@ -1,25 +1,23 @@
-<div class="min-h-screen mb-10">
+<div class="w-full max-w-4xl min-h-screen p-6 mx-auto my-4 mb-10 rounded-lg shadow-md bg-surface-300">
+    <h2 class="mb-5 text-2xl font-semibold text-center">{{ __('posts.Edit Article') }}</h2>
 
-    <h2 class="py-5 text-xl font-semibold">{{ __('posts.Edit Article') }}</h2>
+    <div class="flex items-center justify-between py-4">
+        <!-- Search Input -->
+        <x-input wire:model.live.500ms='search' name="search" placeholder="{{ __('Search') }}" icon="o-magnifying-glass"
+            class="w-full bg-surface-300 placeholder-lime-shadow/50" />
 
-    <div class="p-6 bg-surface-300">
-
-        <div class="flex items-center justify-between py-4">
-            <!-- Search Input -->
-            <x-input wire:model.live.500ms='search' name="search" placeholder="{{ __('Search') }}"
-                icon="o-magnifying-glass" class="w-full bg-surface-300 placeholder-lime-shadow/50" />
-
-            <!-- Pagination Size Selector -->
-            <x-select icon="o-chevron-down" :options="$perPageOptions" option-label="name" option-value="value"
-                wire:model.live="perPage" />
-        </div>
+        <!-- Pagination Size Selector -->
+        <x-select icon="o-chevron-down" :options="$perPageOptions" option-label="name" option-value="value"
+            wire:model.live="perPage" />
+    </div>
 
-        <!-- Current Page Info -->
-        <div class="py-2 text-sm text-right text-gray-600">
-            Page {{ $posts->currentPage() }} of {{ $posts->lastPage() }}
-        </div>
+    <!-- Current Page Info -->
+    <div class="py-2 text-sm text-right text-gray-600">
+        Page {{ $posts->currentPage() }} of {{ $posts->lastPage() }}
+    </div>
 
-        <!-- Posts List -->
+    <!-- Posts List -->
+    <div class="space-y-4">
         @foreach ($posts as $post)
             <x-list-item :item="$post" value="title" sub-value="created_at" avatar="avatar">
                 <x-slot:value>
@@ -35,11 +33,10 @@
                 </x-slot:actions>
             </x-list-item>
         @endforeach
+    </div>
 
-        <!-- Pagination Links -->
-        <div class="py-4">
-            {{ $posts->links(data: ['scrollTo' => false]) }}
-        </div>
-
+    <!-- Pagination Links -->
+    <div class="py-4">
+        {{ $posts->links(data: ['scrollTo' => false]) }}
     </div>
 </div>