@extends('Admin.layout.main')

@section('content')
@if(session()->has('success'))
<script>
Swal.fire({
  title: "{{ session('success') }}",
  icon: "success"
});
</script>
@endif

@if(session()->has('error'))
<script>
Swal.fire({
  title: "{{ session('error') }}",
  icon: "error"
});
</script>
@endif
<div class="page-content-wrapper">
    <!-- start page content-->
    {{-- <div class="page-content"> --}}

        <div class="container mt-4">
            <h2>Add New Blog</h2>
            <form action="{{ route('admin.addblogs') }}" enctype="multipart/form-data" method="POST">
                @csrf
        
                <!-- Basic Info -->
                {{-- <div class="mb-3">
                    <label class="form-label">Slug</label>
                    <input type="text" name="slug" class="form-control" required>
                </div> --}}
                {{-- <div class="mb-3">
                    <label class="form-label">State</label>
                    <select name="state" class="form-control">
                        <option value="" selected disabled>Select State</option>
                        @foreach($states as $state)
                        <option value="{{ $state->state_name }}">{{ $state->state_name }}</option>
                        @endforeach
                    </select>
                </div> --}}
                

                {{-- <div class="mb-3">
                    <label class="form-label">City Name</label>
                    <input type="text" name="city" class="form-control" required>
                </div> --}}
                {{-- <div class="mb-3">
                    <label class="form-label">Service Name</label>
                    <input type="text" name="service" class="form-control" required>
                </div> --}}
                <div class="mb-3">
                    <label class="form-label">Title</label>
                    <input type="text" name="title" class="form-control" required>
                </div>

                <div class="mb-3">
                    <label class="form-label">Description</label>
                    <textarea name="description" class="form-control" rows="2" required></textarea>
                </div>
                <div class="mb-3">
                    <label class="form-label">Keywords (comma-separated)</label>
                    <input type="text" name="keywords" class="form-control"  >
                </div>
                <div class="mb-3">
                    <label class="form-label">Author</label>
                    <input type="text" name="author" class="form-control"  >
                </div>
                <div class="mb-3">
                    <label class="form-label">Robots</label>
                    <input type="text" name="robots" class="form-control" value="index, follow"  >
                </div>
                <div class="mb-3">
                    <label class="form-label">Copyright</label>
                    <input type="text" name="copyright" class="form-control"  >
                </div>
                {{-- <div class="mb-3">
                    <label class="form-label">Canonical URL</label>
                    <input type="text" name="canonical_url" class="form-control"  >
                </div> --}}
        
                <!-- OG Tags -->
                <h5 class="mt-4">Open Graph (OG) Tags</h5>
                <div class="mb-3">
                    <label class="form-label">OG Type</label>
                    <input type="text" name="og_type" class="form-control" value="website"  >
                </div>
                {{-- <div class="mb-3">
                    <label class="form-label">OG URL</label>
                    <input type="text" name="og_url" class="form-control"  >
                </div> --}}
                <div class="mb-3">
                    <label class="form-label">OG Title</label>
                    <input type="text" name="og_title" class="form-control"  >
                </div>
                <div class="mb-3">
                    <label class="form-label">OG Description</label>
                    <textarea name="og_description" class="form-control" rows="2"  ></textarea>
                </div>
                {{-- <div class="mb-3">
                    <label class="form-label">OG Image URL</label>
                    <input type="text" name="og_image" class="form-control"  >
                </div>
         --}}
                <!-- Twitter Tags -->
                <h5 class="mt-4">Twitter Tags</h5>
                <div class="mb-3">
                    <label class="form-label">Twitter Card</label>
                    <input type="text" name="twitter_card" class="form-control" value="summary_large_image"  >
                </div>
                {{-- <div class="mb-3">
                    <label class="form-label">Twitter URL</label>
                    <input type="text" name="twitter_url" class="form-control"  >
                </div> --}}
                <div class="mb-3">
                    <label class="form-label">Twitter Title</label>
                    <input type="text" name="twitter_title" class="form-control"  >
                </div>
                <div class="mb-3">
                    <label class="form-label">Twitter Description</label>
                    <textarea name="twitter_description" class="form-control" rows="2"  ></textarea>
                </div>
                {{-- <div class="mb-3">
                    <label class="form-label">Twitter Image URL</label>
                    <input type="text" name="twitter_image" class="form-control"  >
                </div> --}}
        
                <!-- Schema & Content -->
                <h5 class="mt-4">Schema & Content</h5>
                <div class="mb-3">
                    <label class="form-label">Schema JSON</label>
                    <textarea name="schema_json" class="form-control" rows="4"  ></textarea>
                </div>
                <div class="mb-3">
                    <label class="form-label">Custom JS</label>
                    <textarea name="custom_js" class="form-control" rows="2"  ></textarea>
                </div>
            
                <div class="mb-3">
                    <label class="form-label">H1</label>
                    <input type="text" name="h1" class="form-control" required>
                </div>
                <div class="mb-3">
                    <label class="form-label">P1</label>
                    <textarea name="p1" class="form-control" rows="2" required></textarea>
                </div>
                <div class="mb-3">
                    <label class="form-label">first Image</label>
                  <input type="file" name="image1" required>
                </div>
                <div class="mb-3">
                    <label class="form-label">Second Image</label>
                  <input type="file" name="image2" required>
                </div>

                <div class="mb-3">
                    <label class="form-label">H2</label>
                    <input type="text" name="h2" class="form-control" required>
                </div>
                <div class="mb-3">
                    <label class="form-label">P2</label>
                    <textarea name="p2" class="form-control" rows="2" required></textarea>
                </div>
                <div class="mb-3">
                    <label class="form-label">H3</label>
                    <input type="text" name="h3" class="form-control" required>
                </div>
                <div class="mb-3">
                    <label class="form-label">P3</label>
                    <textarea name="p3" class="form-control" rows="2" required></textarea>
                </div>
                <div class="mb-3">
                    <label class="form-label">H4</label>
                    <input type="text" name="h4" class="form-control" required>
                </div>
                <div class="mb-3">
                    <label class="form-label">P4</label>
                    <textarea name="p4" class="form-control" rows="2" required></textarea>
                </div>
                <div class="mb-3">
                    <label class="form-label">Third Image</label>
                  <input type="file" name="image3" required>
                </div>

            
             
                <button type="submit" class="btn btn-success">Save Page</button>
            </form>
        </div>
        
{{-- </div> --}}
</div>
@endsection