@@ -55,8 +55,7 @@ class="relative my-10 prose max-w-none lg:max-w-full xl:max-w-none prose-img:rou
55
55
<div >
56
56
<x-buttons .primary class =" mr-2 md:mr-4" wire:click =" draft" >
57
57
<span class =" hidden md:block" >{{ __ (' Save as draft' ) } } </span >
58
- <span
59
- class =" hover:text-skin-600 md:hidden" >{{ svg (' iconsax-bul-book-saved' , ' h-6 w-6' ) } } </span >
58
+ <span class =" hover:text-skin-600 md:hidden" >{{ svg (' iconsax-bul-book-saved' , ' h-6 w-6' ) } } </span >
60
59
</x-buttons .primary >
61
60
</div >
62
61
<div >
@@ -69,46 +68,34 @@ class="hover:text-skin-600 md:hidden">{{ svg('iconsax-bul-book-saved', 'h-6 w-6'
69
68
{{ svg (' iconsax-bul-setting-2' , ' h-6 w-6' ) } }
70
69
</x-buttons .primary >
71
70
</x-slot:title >
72
- <div class =" my-6" >
73
- <label class =" text-xl font-bold line-clamp-3 tracking-wide block mb-2 text-gray-700"
74
- for =" name" >Add a cover image</label >
75
- @if ($coverImage )
76
- coverImage Preview:
77
- <div class =" relative pt-[60%] rounded-xl sm:pt-[50%] md:pt-[42%] " >
78
- <img class =" absolute top-0 bottom-0 left-0 right-0 w-full h-full m-0 bg-skin-base shadow-md object-fit rounded-xl drop-shadow-md dark:bg-gray-800"
79
- src =" {{ $coverImage -> temporaryUrl () } }" alt =" " />
71
+ <div class =" mb-4" >
72
+ <label class =" text-xl font-bold line-clamp-3 tracking-wide block mb-2 text-gray-700" >Add a
73
+ cover image</label >
74
+ <div class =" flex flex-row mb-8 items-center" >
75
+ <div class =" " >
76
+ @if ($coverImage )
77
+ <img src =" {{ $coverImage -> temporaryUrl () } }"
78
+ class =" max-h-56 max-w-[224px] bg-gray-50 mr-8"
79
+ alt =" " />
80
+ @endif
80
81
</div >
81
- @endif
82
- <div x-data =" { isUploading: false, progress: 0 }" x-on:livewire-upload-start =" isUploading = true"
83
- x-on:livewire-upload-finish =" isUploading = false"
84
- x-on:livewire-upload-error =" isUploading = false"
85
- x-on:livewire-upload-progress =" progress = $event.detail.progress" >
86
-
87
- <!-- File Input -->
88
-
89
- <input type =" file" wire:model =" coverImage"
90
- class =" text-sm my-4 py-4 px-2 text-grey-500
91
- file:mr-5 file:py-3 file:px-10
92
- file:rounded-lg
93
- file:border file:border-solid
94
- file:shadow-sm
95
- hover:file:shadow-md
96
- file:text-md file:font-semibold
97
- file:bg-skin-base
98
- hover:file:cursor-pointer hover:file:opacity-80
99
- " >
100
- <!-- Progress Bar -->
101
-
102
- <div x-show =" isUploading" >
103
-
104
- <progress max =" 100" x-bind:value =" progress" ></progress >
105
-
82
+ <div x-data =" { isUploading: false, progress: 0 }" x-on:livewire-upload-start =" isUploading = true"
83
+ x-on:livewire-upload-finish =" isUploading = false"
84
+ x-on:livewire-upload-error =" isUploading = false"
85
+ x-on:livewire-upload-progress =" progress = $event.detail.progress" class =" flex-1" >
86
+ <!-- File Input -->
87
+ <input type =" file" wire:model =" coverImage" id =" cover_image" class =" sr-only" />
88
+ <label
89
+ class =" bg-skin-base capatalize py-2 px-4 leading-6 border inline-flex flex-row justify-center items-center no-underline rounded-md font-semibold cursor-pointer transition duration-200 ease-in-out shadow-sm shadow-gray-100"
90
+ for =" cover_image" >
91
+ change
92
+ </label >
93
+ <div x-show =" isUploading" class =" mb-2" >
94
+ <progress max =" 100" x-bind:value =" progress" ></progress >
95
+ </div >
96
+ <x-error class =" text-red-500" field =" coverImage" />
106
97
</div >
107
-
108
98
</div >
109
- @error (' coverImage' )
110
- <span class =" error" >{{ $message } } </span >
111
- @enderror
112
99
</div >
113
100
<div class =" my-4" >
114
101
<label class =" text-xl font-bold line-clamp-3 tracking-wide block mb-2 text-gray-700"
@@ -180,7 +167,8 @@ class="inline-flex py-1 px-2 mb-2 mx-[5px] text-[10px] leading-4 first:ml-0 font
180
167
<div class =" mt-2 text-gray-700 px-6 sm:mt-6 md:px-20" >
181
168
<h1 class =" text-3xl font-extrabold line-clamp-3 tracking-wide text-gray-700 mb-4" >Create Blog</h1 >
182
169
<div class =" my-4" >
183
- <label class =" text-xl font-bold line-clamp-3 tracking-wide block mb-2 text-gray-700" for =" title" >Title
170
+ <label class =" text-xl font-bold line-clamp-3 tracking-wide block mb-2 text-gray-700"
171
+ for =" title" >Title
184
172
of blog</label >
185
173
<x-form .input-field type =" text" id =" title" wire:model =" title" placeholder =" Tittle . . . ." />
186
174
<x-error field =" title" class =" text-rose-500" />
0 commit comments