@extends('Admin.layout.app')
@section('content')
<section id="search" class="my-3">
    <div class="container-fluid">
        <div class="card shadow border mb-4">
            <div class="card-header pink-text">Create Blog</div>
            <div class="card-body">
                <!-- Start of Form -->
                <form action="{{ route('blog.store') }}" method="POST" enctype="multipart/form-data">
                    @csrf

                    <!-- First Row: Title, Banner Title -->
                    <div class="row mb-3">
                        <div class="col-md-4">
                            <div class="form-floating">
                                <input type="text" name='title' class="form-control" placeholder="Enter Blog Title" value="{{ old('title') }}"/>
                                <label for="floatingInputTitle">Title</label>
                                @error('title')
                                    <span class="text-danger p-1">{{ $message }}</span>
                                @enderror
                            </div>
                        </div>



                        <div class="col-md-4">
                            <div class="form-floating">
                                <input type="text" name='url' class="form-control" placeholder="Enter URL" value="{{ old('url') }}"/>
                                <label for="floatingInputURL">URL</label>
                                @error('url')
                                    <span class="text-danger p-1">{{ $message }}</span>
                                @enderror
                            </div>
                        </div>



                        <div class="col-md-4">
                            <div class="form-floating">
                                <input type="text" name='type' class="form-control" placeholder="Enter Blog type" value="{{ old('type') }}"/>
                                <label for="floatingInputType">Type</label>
                                @error('type')
                                    <span class="text-danger p-1">{{ $message }}</span>
                                @enderror
                            </div>
                        </div>
                   

                    <!-- Second Row: URL, Background CSS Class -->
                   
                     
                 </div>




                 <div class="row mb-3">
                        <div class="col-md-4">
                            <div class="form-floating">
                                <input type="text" name='tags' class="form-control" placeholder="Enter Tags" value="{{ old('tags') }}"/>
                                <label for="floatingInputTags">Tags</label>
                                @error('tags')
                                    <span class="text-danger p-1">{{ $message }}</span>
                                @enderror
                            </div>
                        </div>

                   <div class="col-md-4">
                            <div class="form-floating">
                                <input type="text" name='meta_title' class="form-control" placeholder="Enter Meta Title" value="{{ old('meta_title') }}"/>
                                <label for="floatingInputMetaTitle">Meta Title</label>
                                @error('meta_title')
                                    <span class="text-danger p-1">{{ $message }}</span>
                                @enderror
                            </div>
                        </div>
                   

                   
                        <div class="col-md-4">
                            <div class="form-floating">
                                <input type="text" name='meta_keyword' class="form-control" placeholder="Enter Meta Keyword" value="{{ old('meta_keyword') }}"/>
                                <label for="floatingInputMetaKeyword">Meta Keyword</label>
                                @error('meta_keyword')
                                    <span class="text-danger p-1">{{ $message }}</span>
                                @enderror
                            </div>
                        </div> 
                 </div>




                    <!-- Full-Width Text Areas: Short Description and Meta Description -->
                    <div class="row mb-3">
                        <div class="col-md-6">
                            <div class="form-floating">
                                <textarea class="form-control" placeholder="Short Description" name="short_description" id="short_description">{{old('short_description')}}</textarea>
                                <label for="floatingInputShortDescription">Short Description</label>
                              
                                @error('short_description')
                                    <span class="text-danger p-1">{{ $message }}</span>
                                @enderror
                            </div>
                           
                        </div>
                       <div class="col-md-6">
                            <div class="form-floating">
                                <textarea class="form-control" name="meta_description" id="meta_description" placeholder="Meta Description">{{old('meta_description')}}</textarea>
                                <label for="floatingInputMetaDescription">Meta Description</label>
                                @error('meta_description')
                                    <span class="text-danger p-1">{{ $message }}</span>
                                @enderror
                            </div>
                        </div>  
                    </div>

                  
                    <!-- Image Upload Section -->
                    <div class="row mb-3">
                        <div class="col-md-6">
                            <div class="form-floating">
                                <textarea class="form-control" name="content" id="content" placeholder="Please Enter Content">{{old('content')}}</textarea>
                                <label for="floatingInputcontent">Content</label>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="form-floating">
                            <input type="file" name="image" class="form-control" id="image" aria-describedby="image" aria-label="Upload" accept="image/*" onchange="loadFile(event)"/>
                            <label for="floatingInputImage">Image</label>
                            @error('image')
                    <span class="text-danger p-1">{{ $message }}</span>
                    @enderror
                            </div>
                        </div>
                    </div>

                    <!-- Submit Button -->
                    <div class="row mb-3">
                        <div class="col-md-2">
                            <button type="submit" class="btn pink-bg text-white">Create</button>
                        </div>
                    </div>

                </form>
                <!-- End of Form -->
            </div>
        </div>
    </div>
</section>
@endsection
@push('script')
<script src="https://cdn.tiny.cloud/1/x71lspwx2b4z0eppj01ik96r0xl0rjc5frwhr8mqziuq4yz9/tinymce/7/tinymce.min.js" referrerpolicy="origin"></script>
<script>
  
    tinymce.init({
      selector: 'textarea#content',
      plugins: ['code'],
    });
  </script>
@endpush