@extends('admin.layout.admin')
@section('content')
    <div class="content-page">
        <!-- Start content -->
        <div class="content">
            {{--@dd($data)--}}
            <div class="container-fluid">
                <div class="row mb-2">
                    <div class="col-sm-6">
                        <h1 class="m-0" style="font-size: 2.5rem; color: #333; font-weight: bold;">Footer Content
                            Details</h1>
                    </div>
                    <div class="col-sm-6">
                        <ol class="breadcrumb float-sm-right">
                            <li class="breadcrumb-item"><a href="#" style="color: #666;">Footer</a></li>
                            <li class="breadcrumb-item active" aria-current="page"
                                style="color: #333; font-weight: bold;">
                                Dashboard
                            </li>
                        </ol>
                    </div>
                </div>
                <form action="{{ route('setting.update') }}" method="post"
                      enctype="multipart/form-data">
{{--                    <input type="hidden" name="slug" value="{{ $page->slug }}">--}}
                    <input type="hidden" name="media_collections[]" value="footer_logo">

                    @csrf
                    <div class="row mt-5">
                        <label for="title" style="font-size:2.5rem; color: #555; font-weight: bold;">---------------------------------------
                            Website Setting--------------------------------------</label>
                        <div class="col-md-12">
                            <div class="row">
                                <div class="col-md-6">

                                    <div class="form-group">
                                        <label for="title" style="font-size: 1.2rem; color: #555; font-weight: bold;">

                                            Title</label>
                                        <textarea class="form-control" name="title">{{ old('title',  $content->title ?? '') }}</textarea>
                                    </div>
                                </div>
                                <div class="col-md-6">

                                    <div class="form-group">
                                        <label for="title" style="font-size: 1.2rem; color: #555; font-weight: bold;">

                                            Copy Right Content</label>
                                        <textarea class="form-control" name="copy_right_content">{{ old('copy_right_content', $content->copy_right_content ?? '') }}</textarea>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-md-6">

                                        <div class="form-group">
                                            <label for="title" style="font-size: 1.2rem; color: #555; font-weight: bold;">

                                                E-Mail</label>
                                            <input type="email" class="form-control" name="email" value="{{ old('home_about_sec_heading',  $content->email ?? '') }}">
                                        </div>
                                    </div>
                                    <div class="col-md-6">

                                        <div class="form-group">
                                            <label for="title" style="font-size: 1.2rem; color: #555; font-weight: bold;">

                                                Contact Number</label>
                                            <input  type="tel" class="form-control" name="contact_number" value="{{ old('home_about_sec_sub_title', $content->contact_number ?? '') }}">
                                        </div>
                                    </div>
                            </div>
                            <div class="row">
                                <div class="col-md-6">


                                        <label for="title" style="font-size: 1.2rem; color: #555; font-weight: bold;">
                                            Icon</label>
                                        <input type="file" class="form-control" name="logo" id="about_me_sec_img_1">
                                        <img id="about_me_sec_img_1_preview"
                                                                                  src="{{ $data->CmsImage('logo') }}"
                                             alt=" Preview"
                                             style="max-width: 200px; max-height: 200px; margin-top: 20px; display: {{ $data->cmsImage('logo') ? 'block' : 'none' }}; ">




                                </div>
                                <div class="col-md-6">
                                    <label for="title" style="font-size: 1.2rem; color: #555; font-weight: bold;">
                                       favicon</label>
                                    <input type="file" class="form-control" name="favicon" id="about_me_sec_img_2">
                                    <img id="about_me_sec_img_2_preview"
                                                                              src="{{ $data->CmsImage('favicon') }}"
                                         alt=" Preview"
                                         style="max-width: 200px; max-height: 200px; margin-top: 20px; display: {{ $data->cmsImage('favicon') ? 'block' : 'none' }}; ">
                                </div>

                                </div>
                                <div class="row mt-5">
                                    <label for="title" style="font-size:2.5rem; color: #555; font-weight: bold;">---------------------------------------
                                        Footer Section--------------------------------------</label>
                                    <div class="col-md-12">
                                        <div class="row">


                                                <div class="col-md-6">
                                                    <label for="title" style="font-size: 1.2rem; color: #555; font-weight: bold;">

                                                        Contact Form Heading</label>
                                                    <input type="text" class="form-control" name="footer_contact_form_heading" value="{{ old('footer_contact_form_heading',  $content->footer_contact_form_heading ?? '') }}">
                                                </div>



                                                <div class="col-md-6">


                                                    <label for="title" style="font-size: 1.2rem; color: #555; font-weight: bold;">
                                                        Image</label>
                                                    <input type="file" class="form-control" name="footer_image" id="about_me_sec_img_3">
                                                    <img id="about_me_sec_img_3_preview"
                                                                                              src="{{ $data->CmsImage('footer_image') }}"
                                                         alt=" Preview"
                                                         style="max-width: 200px; max-height: 200px; margin-top: 20px; display: {{ $data->cmsImage('footer_image') ? 'block' : 'none' }};">




                                                </div>
                                        </div>
                                    </div>


                                <button type="submit" class="btn btn-success">Submit</button>
                            </div>






                        </div>




                </form>
            </div>

            @endsection


            @section('script')
                <script>

                    $(document).ready(function() {
                        $('#about_me_sec_img_1_preview').change(function() {
                            var input = this;
                            if (input.files && input.files[0]) {
                                var reader = new FileReader();
                                reader.onload = function(e) {
                                    $('#about_me_sec_img_1').attr('src', e.target.result).show();
                                }
                                reader.readAsDataURL(input.files[0]);
                            }
                        });
                    })
                    $(document).ready(function() {
                        $('#about_me_sec_img_2_preview').change(function() {
                            var input = this;
                            if (input.files && input.files[0]) {
                                var reader = new FileReader();
                                reader.onload = function(e) {
                                    $('#about_me_sec_img_2').attr('src', e.target.result).show();
                                }
                                reader.readAsDataURL(input.files[0]);
                            }
                        });
                    })
                    $(document).ready(function() {
                        $('#about_me_sec_img_3_preview').change(function() {
                            var input = this;
                            if (input.files && input.files[0]) {
                                var reader = new FileReader();
                                reader.onload = function(e) {
                                    $('#about_me_sec_img_3').attr('src', e.target.result).show();
                                }
                                reader.readAsDataURL(input.files[0]);
                            }
                        });
                    })

                    // $(document).ready(function () {
                    //     $('#banner_image1').change(function () {
                    //         var input = this;
                    //         if (input.files && input.files[0]) {
                    //             var reader = new FileReader();
                    //             reader.onload = function (e) {
                    //                 $('#banner_image1_preview').attr('src', e.target.result).show();
                    //             }
                    //             reader.readAsDataURL(input.files[0]);
                    //         }
                    //     });
                    // });
                </script>
@endsection