@extends('layouts.admin-layout')
@section('title', 'Home Page')
@section('content')
    <div class="content-wrapper">
        <section class="content">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-md-12 mt-5">
                        <form class="home-form" method="post" action="{{ route('admin.page.cms.home.update') }}" enctype="multipart/form-data">
                            @csrf

                            <!-- Banner Section -->
                            <div class="card card-primary card-box-shadow mt-3">
                                <div class="card-body">
                                    <h2>Banner Section</h2>
                                    <div class="row">
                                        <div class="col-md-6 mt-4">
                                            <label for="bannerLogo">Logo</label>
                                            <input type="file" name="banner_logo" id="banner_logo" class="form-control">
                                            <div id="banner_logo_preview_container">
                                                <img id="banner_logo_preview"
                                                     src="{{ $data->getFirstMediaUrl('banner_logo') ?: '' }}"
                                                     alt="Image Preview"
                                                     style="display: {{ $data->getFirstMediaUrl('banner_logo') ? 'block' : 'none' }}; max-width: 100px; margin-top: 10px;">
                                            </div>
                                        </div>
                                        <div class="col-md-6 mt-4">
                                            <label for="bannerImage">Image</label>
                                            <input type="file" name="banner_image" id="banner_image" class="form-control">

                                            <div id="banner_image_preview_container">
                                                <img id="banner_image_preview"
                                                     src="{{ $data->getFirstMediaUrl('banner_image') ?: '' }}"
                                                     alt="Image Preview"
                                                     style="display: {{ $data->getFirstMediaUrl('banner_image') ? 'block' : 'none' }}; max-width: 100px; margin-top: 10px;">
                                            </div>
                                        </div>
                                        <div class="col-md-12 mt-4">
                                            <label for="bannerHeading">Heading</label>
                                            <input type="text" name="banner_heading" id="bannerHeading" class="form-control" value="{{ $content->banner_heading ?? '' }}">
                                        </div>
                                        <div class="col-md-12 mt-4">
                                            <label for="bannerSubHeading">Sub Heading</label>
                                            <input type="text" name="banner_sub_heading" id="bannerSubHeading" class="form-control" value="{{ $content->banner_sub_heading ?? '' }}">
                                        </div>
                                        <div class="col-md-12 mt-4">
                                            <label for="banner_description">Description</label>
                                            <textarea name="banner_description" id="banner_description" class="form-control" rows="3">{!! $content->banner_description ?? '' !!}</textarea>
                                        </div>


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

                            <!-- Creasy Diets Section -->
                            <div class="card card-primary card-box-shadow mt-3">
                                <div class="card-body">
                                    <h4>Creasy Diets Section</h4>
                                    <div class="row">
                                        <div class="col-md-12 mt-4">
                                            <label for="creasyHeading1">First Heading</label>
                                            <input type="text" name="creasy_heading_1" id="creasyHeading1" class="form-control" value="{{ $content->creasy_heading_1 ?? '' }}">
                                        </div>
                                        <div class="col-md-12 mt-4">
                                            <label for="creasyHeading2">Second Heading</label>
                                            <input type="text" name="creasy_heading_2" id="creasyHeading2" class="form-control" value="{{ $content->creasy_heading_2 ?? '' }}">
                                        </div>
                                        <div class="col-md-12 mt-4">
                                            <label for="creasyHeading3">Third Heading</label>
                                            <input type="text" name="creasy_heading_3" id="creasyHeading3" class="form-control" value="{{ $content->creasy_heading_3 ?? '' }}">
                                        </div>
                                        <div class="col-md-12 mt-4">
                                            <label for="creasyButtonText">Button Text</label>
                                            <input type="text" name="creasy_button_text" id="creasyButtonText" class="form-control" value="{{ $content->creasy_button_text ?? '' }}">
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <!-- Experience the Power of Semaglutide Section -->
                            <div class="card card-primary card-box-shadow mt-3">
                                <div class="card-body">
                                    <h4>Experience the Power of Semaglutide Section</h4>
                                    <div class="row">
                                        <div class="col-md-12 mt-4">
                                            <label for="experienceHeading">Heading</label>
                                            <input type="text" name="experience_heading" id="experienceHeading" class="form-control" value="{{ $content->experience_heading ?? '' }}">
                                        </div>
                                        <div class="col-md-12 mt-4">
                                            <label for="experienceSubHeading">Sub Heading</label>
                                            <input type="text" name="experience_sub_heading" id="experienceSubHeading" class="form-control" value="{{ $content->experience_sub_heading ?? '' }}">
                                        </div>
                                        <div class="col-md-12 mt-4">
                                            <label for="experienceImage">Image</label>
                                            <input type="file" name="experience_image" id="experience_image" class="form-control" >
                                            <div id="experience_image_preview_container">
                                                <img id="experience_image_preview"
                                                     src="{{ $data->getFirstMediaUrl('experience_image') ?: '' }}"
                                                     alt="Image Preview"
                                                     style="display: {{ $data->getFirstMediaUrl('experience_image') ? 'block' : 'none' }}; max-width: 100px; margin-top: 10px;">
                                            </div>
                                        </div>
                                        <div class="col-md-12 mt-4">
                                            <label for="experienceButtonText">Button Text</label>
                                            <input type="text" name="experience_button_text" id="experienceButtonText" class="form-control" value="{{ $content->experience_button_text ?? '' }}">
                                        </div>
                                        <!-- Points Input Fields -->
                                        @for($i = 1; $i <= 4; $i++)
                                            <div class="col-md-12 mt-4">
                                                <label for="experiencePoint{{ $i }}">Point {{ $i }}</label>
                                                <input type="text" name="experience_point_{{ $i }}" id="experiencePoint{{ $i }}" class="form-control"
                                                       value="{{ $content->{'experience_point_'.$i} ?? '' }}">
                                            </div>
                                        @endfor

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

                            <!-- Ready to Transform Your Life Section -->
                            <div class="card card-primary card-box-shadow mt-3">
                                <div class="card-body">
                                    <h4>Ready to Transform Your Life Section</h4>
                                    <div class="row">
                                        <div class="col-md-12 mt-4">
                                            <label for="transformHeading">Heading</label>
                                            <input type="text" name="transform_heading" id="transformHeading" class="form-control" value="{{ $content->transform_heading ?? '' }}">
                                        </div>
                                        <div class="col-md-12 mt-4">
                                            <label for="transformDescription">Description</label>
                                            <textarea name="transform_description" id="transform_description" class="form-control" rows="3">{!! $content->transform_description ?? '' !!}</textarea>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <!-- Cost of Semaglutide Section -->
                            <div class="card card-primary card-box-shadow mt-3">
                                <div class="card-body">
                                    <h4>As Seen On Section</h4>
                                    <div class="row">
                                        <div class="col-md-12 mt-4">
                                            <label for="costHeading">Heading</label>
                                            <input type="text" name="as_soon_heading" id="costHeading" class="form-control" value="{{ $content->as_soon_heading ?? '' }}">
                                        </div>
                                    </div>
                                </div>
                            </div>


                        <div class="card card-primary card-box-shadow mt-3">
                            <div class="card-body">
                                <h4>Real Success Stories Section</h4>
                                <div class="row">
                                    <div class="col-md-6 mt-4">
                                        <label for="bannerLogo">Image 1</label>
                                        <input type="file" name="real_success_image_1" id="cc" class="form-control">
                                        <div id="real_success_image_1_preview_container">
                                            <img id="real_success_image_1_preview"
                                                 src="{{ $data->getFirstMediaUrl('real_success_image_1') ?: '' }}"
                                                 alt="Image Preview"
                                                 style="display: {{ $data->getFirstMediaUrl('real_success_image_1') ? 'block' : 'none' }}; max-width: 100px; margin-top: 10px;">
                                        </div>
                                    </div>
                                    <div class="col-md-6 mt-4">
                                        <label for="bannerImage">Image 2</label>
                                        <input type="file" name="real_success_image_2" id="real_success_image_2" class="form-control">
                                        <div id="real_success_image_2_preview_container">
                                            <img id="real_success_image_2_preview"
                                                 src="{{ $data->getFirstMediaUrl('real_success_image_2') ?: '' }}"
                                                 alt="Image Preview"
                                                 style="display: {{ $data->getFirstMediaUrl('real_success_image_2') ? 'block' : 'none' }}; max-width: 100px; margin-top: 10px;">
                                        </div>
                                    </div>

                                    <div class="col-md-12 mt-4">
                                        <label for="costHeading">Heading</label>
                                        <input type="text" name="real_success_heading" id="real_success_heading" class="form-control" value="{{ $content->real_success_heading ?? '' }}">
                                    </div>
                                    <div class="col-md-12 mt-4">
                                        <label for="bannerDescription">Description</label>
                                        <textarea name="real_success_description" id="real_success_description" class="form-control" rows="3">{{ $content->real_success_description ?? '' }}</textarea>
                                    </div>
                                </div>
                            </div>
                        </div>


                        <div class="card card-primary card-box-shadow mt-3">
                            <div class="card-body">
                                <h4>Join Our Community of Success Stories Section</h4>
                                <div class="row">
                                    <div class="col-md-6 mt-4">
                                        <label for="bannerLogo">Image</label>
                                        <input type="file" name="join_our_community_image" id="join_our_community_image" class="form-control">
                                        <div id="join_our_community_image_preview_container">
                                            <img id="join_our_community_image_preview"
                                                 src="{{ $data->getFirstMediaUrl('join_our_community_image') ?: '' }}"
                                                 alt="Image Preview"
                                                 style="display: {{ $data->getFirstMediaUrl('join_our_community_image') ? 'block' : 'none' }}; max-width: 100px; margin-top: 10px;">
                                        </div>
                                    </div>
                                    <div class="col-md-12 mt-4">
                                        <label for="bannerHeading">Heading</label>
                                        <input type="text" name="join_our_community_heading" id="bannerHeading" class="form-control" value="{{ $content->join_our_community_heading ?? '' }}">
                                    </div>
                                    <div class="col-md-12 mt-4">
                                        <label for="experienceButtonText">Button Text</label>
                                        <input type="text" name="join_our_community_button" id="experienceButtonText" class="form-control" value="{{ $content->join_our_community_button ?? '' }}">
                                    </div>
                                    <div class="col-md-12 mt-4">
                                        <label for="bannerDescription">Description</label>
                                        <textarea name="join_our_community_description" id="join_our_community_description" class="form-control" rows="3">{!! $content->join_our_community_description ?? '' !!}</textarea>
                                    </div>
                                </div>
                            </div>
                        </div>


                        <div class="card card-primary card-box-shadow mt-3">
                            <div class="card-body">
                                <h4>Download Our Shocking Free Report Section</h4>
                                <div class="row">
                                    <div class="col-md-6 mt-4">
                                        <label for="bannerLogo">Image 1</label>
                                        <input type="file" name="download_image_1" id="download_image_1" class="form-control">
                                        <div id="why_choose_image_1_preview_container">
                                            <img id="download_image_1_preview"
                                                 src="{{ $data->getFirstMediaUrl('download_image_1') ?: '' }}"
                                                 alt="Image Preview"
                                                 style="display: {{ $data->getFirstMediaUrl('download_image_1') ? 'block' : 'none' }}; max-width: 100px; margin-top: 10px;">
                                        </div>
                                    </div>
                                    <div class="col-md-6 mt-4">
                                        <label for="bannerImage">Image 2</label>
                                        <input type="file" name="download_image_2" id="download_image_2" class="form-control">
                                        <div id="download_image_2_container">
                                            <img id="download_image_2_preview"
                                                 src="{{ $data->getFirstMediaUrl('download_image_2') ?: '' }}"
                                                 alt="Image Preview"
                                                 style="display: {{ $data->getFirstMediaUrl('download_image_2') ? 'block' : 'none' }}; max-width: 100px; margin-top: 10px;">
                                        </div>

                                    </div>
                                    <div class="col-md-12 mt-4">
                                        <label for="bannerHeading">Heading 1</label>
                                        <input type="text" name="download_heading_1" id="bannerHeading" class="form-control" value="{{ $content->download_heading_1 ?? '' }}">
                                    </div>
                                    <div class="col-md-12 mt-4">
                                        <label for="bannerSubHeading">Heading 2</label>
                                        <input type="text" name="download_heading_2" id="bannerSubHeading" class="form-control" value="{{ $content->download_heading_2 ?? '' }}">
                                    </div>
                                    <div class="col-md-12 mt-4">
                                        <label for="experienceButtonText">Button Text 1</label>
                                        <input type="text" name="download_button_1" id="experienceButtonText" class="form-control" value="{{ $content->download_button_1 ?? '' }}">
                                    </div>
                                    <div class="col-md-12 mt-4">
                                        <label for="experienceButtonText">Button Text 2</label>
                                        <input type="text" name="download_button_2" id="experienceButtonText" class="form-control" value="{{ $content->download_button_2 ?? '' }}">
                                    </div>  <div class="col-md-12 mt-4">
                                        <label for="experienceButtonText">Button Text 3</label>
                                        <input type="text" name="download_button_3" id="experienceButtonText" class="form-control" value="{{ $content->download_button_3 ?? '' }}">
                                    </div>  <div class="col-md-12 mt-4">
                                        <label for="experienceButtonText">Button Text 4</label>
                                        <input type="text" name="download_button_4" id="experienceButtonText" class="form-control" value="{{ $content->download_button_4 ?? '' }}">
                                    </div>
                                    <div class="col-md-12 mt-4">
                                        <label for="bannerDescription">Description</label>
                                        <textarea name="download_description" id="download_description" class="form-control" rows="3">{!! $content->download_description ?? '' !!}</textarea>                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="card card-primary card-box-shadow mt-3">
                            <div class="card-body">
                                <h4>Free, No-Obligation Consultation Section</h4>
                                <div class="row">
                                    <div class="col-md-12 mt-4">
                                        <label for="journeyHeading">Heading</label>
                                        <input type="text" name="free_obligation_heading" id="journeyHeading" class="form-control" value="{{ $content->free_obligation_heading ?? '' }}">
                                    </div>
                                    <div class="col-md-12 mt-4">
                                        <label for="experienceButtonText">Button Text</label>
                                        <input type="text" name="free_obligation_button" id="experienceButtonText" class="form-control" value="{{ $content->free_obligation_button ?? '' }}">
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="card card-primary card-box-shadow mt-3">
                            <div class="card-body">
                                <h4>Why Choose Breakthrough Section</h4>
                                <div class="row">
                                    <div class="col-md-6 mt-4">
                                        <label for="bannerLogo">Image 1</label>
                                        <input type="file" name="why_choose_image_1" id="why_choose_image_1" class="form-control">
                                        <div id="why_choose_image_1_preview_container">
                                            <img id="why_choose_image_1_preview"
                                                 src="{{ $data->getFirstMediaUrl('why_choose_image_1') ?: '' }}"
                                                 alt="Image Preview"
                                                 style="display: {{ $data->getFirstMediaUrl('why_choose_image_1') ? 'block' : 'none' }}; max-width: 100px; margin-top: 10px;">
                                        </div>

                                    </div>

                                    <div class="col-md-6 mt-4">
                                        <label for="bannerImage">Image 2</label>
                                        <input type="file" name="why_choose_image_2" id="why_choose_image_2" class="form-control">
                                        <div id="why_choose_image_1_preview_container">
                                            <img id="why_choose_image_2_preview"
                                                 src="{{ $data->getFirstMediaUrl('why_choose_image_2') ?: '' }}"
                                                 alt="Image Preview"
                                                 style="display: {{ $data->getFirstMediaUrl('why_choose_image_2') ? 'block' : 'none' }}; max-width: 100px; margin-top: 10px;">
                                        </div>

                                    </div>
                                    <div class="col-md-12 mt-4">
                                        <label for="bannerHeading">Heading</label>
                                        <input type="text" name="why_choose_heading" id="bannerHeading" class="form-control" value="{{ $content->why_choose_heading ?? '' }}">
                                    </div>
                                    <div class="col-md-12 mt-4">
                                        <label for="experienceButtonText">Button Text 1</label>
                                        <input type="text" name="why_choose_button_1" id="experienceButtonText" class="form-control" value="{{ $content->why_choose_button_1 ?? '' }}">
                                    </div>
                                    <div class="col-md-12 mt-4">
                                        <label for="experienceButtonText">Button Text 2</label>
                                        <input type="text" name="why_choose_button_2" id="experienceButtonText" class="form-control" value="{{ $content->why_choose_button_2 ?? '' }}">
                                    </div>
                                    <div class="col-md-12 mt-4">
                                        <label for="bannerDescription">Description</label>
                                        <textarea name="why_choose_description" id="why_choose_description" class="form-control" rows="3">{!! $content->why_choose_description ?? '' !!}"</textarea>
                                    </div>
                                </div>
                            </div>
                        </div>

                            <!-- Submit Button -->
                            <div class="text-center mt-4">
                                <button id="submit_btn" class="btn btn-primary custom_btn">
                                    <i class="fa-solid fa-cloud-arrow-up"></i> Submit
                                </button>
                            </div>

                        </form>
                    </div>
                </div>
            </div>
        </section>
    </div>
@endsection

@section('script')
    <script src="https://cdn.ckeditor.com/ckeditor5/39.0.1/classic/ckeditor.js"></script>

    <script>

        const why_choose_image_1 = document.getElementById("why_choose_image_1");
        const why_choose_image_1_preview = document.getElementById('why_choose_image_1_preview');

        window.addEventListener('DOMContentLoaded', function() {
            const existingImageUrl = why_choose_image_1_preview.src;
            if (existingImageUrl && existingImageUrl !== '') {
                why_choose_image_1_preview.style.display = 'block';
            }
        });

        why_choose_image_1.addEventListener("change", function (event) {
            const file = event.target.files[0];

            if (file) {
                const reader = new FileReader();
                reader.onload = function (e) {
                    why_choose_image_1_preview.src = e.target.result;
                    why_choose_image_1_preview.style.display = 'block';
                };
                reader.readAsDataURL(file);
            }
        });


        const why_choose_image_2 = document.getElementById("why_choose_image_2");
        const why_choose_image_2_preview = document.getElementById('why_choose_image_2_preview');

        window.addEventListener('DOMContentLoaded', function() {
            const existingImageUrl = why_choose_image_2_preview.src;
            if (existingImageUrl && existingImageUrl !== '') {
                why_choose_image_2_preview.style.display = 'block';
            }
        });

        why_choose_image_2.addEventListener("change", function (event) {
            const file = event.target.files[0];

            if (file) {
                const reader = new FileReader();
                reader.onload = function (e) {
                    why_choose_image_1_preview.src = e.target.result;
                    why_choose_image_1_preview.style.display = 'block';
                };
                reader.readAsDataURL(file);
            }
        });

        const download_image_1 = document.getElementById("download_image_1");
        const download_image_1_preview = document.getElementById('download_image_1_preview');

        window.addEventListener('DOMContentLoaded', function() {
            const existingImageUrl = download_image_1_preview.src;
            if (existingImageUrl && existingImageUrl !== '') {
                download_image_1_preview.style.display = 'block';
            }
        });

        download_image_1.addEventListener("change", function (event) {
            const file = event.target.files[0];

            if (file) {
                const reader = new FileReader();
                reader.onload = function (e) {
                    download_image_1_preview.src = e.target.result;
                    download_image_1_preview.style.display = 'block';
                };
                reader.readAsDataURL(file);
            }
        });

        const download_image_2 = document.getElementById("download_image_2");
        const download_image_2_preview = document.getElementById('download_image_2_preview');

        window.addEventListener('DOMContentLoaded', function() {
            const existingImageUrl = download_image_2_preview.src;
            if (existingImageUrl && existingImageUrl !== '') {
                download_image_2_preview.style.display = 'block';
            }
        });

        download_image_2.addEventListener("change", function (event) {
            const file = event.target.files[0];

            if (file) {
                const reader = new FileReader();
                reader.onload = function (e) {
                    download_image_2_preview.src = e.target.result;
                    download_image_2_preview.style.display = 'block';
                };
                reader.readAsDataURL(file);
            }
        });

        const join_our_community_image = document.getElementById("join_our_community_image");
        const join_our_community_image_preview = document.getElementById('join_our_community_image_preview');

        window.addEventListener('DOMContentLoaded', function() {
            const existingImageUrl = join_our_community_image_preview.src;
            if (existingImageUrl && existingImageUrl !== '') {
                join_our_community_image_preview.style.display = 'block';
            }
        });

        join_our_community_image.addEventListener("change", function (event) {
            const file = event.target.files[0];

            if (file) {
                const reader = new FileReader();
                reader.onload = function (e) {
                    join_our_community_image_preview.src = e.target.result;
                    join_our_community_image_preview.style.display = 'block';
                };
                reader.readAsDataURL(file);
            }
        });

        const real_success_image_1 = document.getElementById("real_success_image_1");
        const real_success_image_1_preview = document.getElementById('real_success_image_1_preview');

        window.addEventListener('DOMContentLoaded', function() {
            const existingImageUrl = real_success_image_1_preview.src;
            if (existingImageUrl && existingImageUrl !== '') {
                real_success_image_1_preview.style.display = 'block';
            }
        });

        real_success_image_1.addEventListener("change", function (event) {
            const file = event.target.files[0];

            if (file) {
                const reader = new FileReader();
                reader.onload = function (e) {
                    real_success_image_1_preview.src = e.target.result;
                    real_success_image_1_preview.style.display = 'block';
                };
                reader.readAsDataURL(file);
            }
        });


        const real_success_image_2 = document.getElementById("real_success_image_2");
        const real_success_image_2_preview = document.getElementById('real_success_image_2_preview');

        window.addEventListener('DOMContentLoaded', function() {
            const existingImageUrl = real_success_image_2_preview.src;
            if (existingImageUrl && existingImageUrl !== '') {
                real_success_image_2_preview.style.display = 'block';
            }
        });

        real_success_image_2.addEventListener("change", function (event) {
            const file = event.target.files[0];

            if (file) {
                const reader = new FileReader();
                reader.onload = function (e) {
                    real_success_image_2_preview.src = e.target.result;
                    real_success_image_2_preview.style.display = 'block';
                };
                reader.readAsDataURL(file);
            }
        });


        const experience_image = document.getElementById("experience_image");
        const experience_image_preview = document.getElementById('experience_image_preview');

        window.addEventListener('DOMContentLoaded', function() {
            const existingImageUrl = experience_image_preview.src;
            if (existingImageUrl && existingImageUrl !== '') {
                experience_image_preview.style.display = 'block';
            }
        });

        experience_image.addEventListener("change", function (event) {
            const file = event.target.files[0];

            if (file) {
                const reader = new FileReader();
                reader.onload = function (e) {
                    experience_image_preview.src = e.target.result;
                    experience_image_preview.style.display = 'block';
                };
                reader.readAsDataURL(file);
            }
        });

        const banner_image = document.getElementById("banner_image");
        const banner_image_preview = document.getElementById('banner_image_preview');

        window.addEventListener('DOMContentLoaded', function() {
            const existingImageUrl = banner_image_preview.src;
            if (existingImageUrl && existingImageUrl !== '') {
                banner_image_preview.style.display = 'block';
            }
        });

        banner_image.addEventListener("change", function (event) {
            const file = event.target.files[0];

            if (file) {
                const reader = new FileReader();
                reader.onload = function (e) {
                    banner_image_preview.src = e.target.result;
                    banner_image_preview.style.display = 'block';
                };
                reader.readAsDataURL(file);
            }
        });


        const banner_logo = document.getElementById("banner_logo");
        const banner_logo_preview = document.getElementById('banner_logo_preview');

        window.addEventListener('DOMContentLoaded', function() {
            const existingImageUrl = banner_logo_preview.src;
            if (existingImageUrl && existingImageUrl !== '') {
                banner_logo_preview.style.display = 'block';
            }
        });

        banner_logo.addEventListener("change", function (event) {
            const file = event.target.files[0];

            if (file) {
                const reader = new FileReader();
                reader.onload = function (e) {
                    banner_logo_preview.src = e.target.result;
                    banner_logo_preview.style.display = 'block';
                };
                reader.readAsDataURL(file);
            }
        });


        $('#banner_description').summernote({
            placeholder: 'Hello Admin',
            tabsize: 2,
            height: 100
        });





    </script>
    <script>
        ClassicEditor
            .create(document.querySelector('#banner_description'), {
                placeholder: 'Hello Admin',
                toolbar: ['bold', 'italic', 'bulletedList', 'numberedList', 'blockQuote'],
                height: 100
            })
            .catch(error => {
                console.error(error);
            });


        ClassicEditor
            .create(document.querySelector('#transform_description'), {
                placeholder: 'Hello Admin',
                toolbar: ['bold', 'italic', 'bulletedList', 'numberedList', 'blockQuote'],
                height: 100
            })
            .catch(error => {
                console.error(error);
            });


        ClassicEditor
            .create(document.querySelector('#real_success_description'), {
                placeholder: 'Hello Admin',
                toolbar: ['bold', 'italic', 'bulletedList', 'numberedList', 'blockQuote'],
                height: 100
            })
            .catch(error => {
                console.error(error);
            });


        ClassicEditor
            .create(document.querySelector('#join_our_community_description'), {
                placeholder: 'Hello Admin',
                toolbar: ['bold', 'italic', 'bulletedList', 'numberedList', 'blockQuote'],
                height: 100
            })
            .catch(error => {
                console.error(error);
            });


        ClassicEditor
            .create(document.querySelector('#why_choose_description'), {
                placeholder: 'Hello Admin',
                toolbar: ['bold', 'italic', 'bulletedList', 'numberedList', 'blockQuote'],
                height: 100
            })
            .catch(error => {
                console.error(error);
            });

        ClassicEditor
            .create(document.querySelector('#download_description'), {
                placeholder: 'Hello Admin',
                toolbar: ['bold', 'italic', 'bulletedList', 'numberedList', 'blockQuote'],
                height: 100
            })
            .catch(error => {
                console.error(error);
            });

    </script>



@endsection