@extends('admin.layout.index')
@section('title', 'Resimli Metin Ayarları')
@section('content')
    <section class="content-body">
        <form action="" class="form-container" enctype="multipart/form-data" method="POST">
            @csrf
            <div class="form-item">
                <label for="status">Durum</label>
                <select name="status" id="status" data-select data-select-no-search>
                    <option value="1" {{ $data->status == "1" ? 'selected' : '' }}> Gözükür </option>
                    <option value="0" {{ $data->status == "0" ? 'selected' : '' }}> Gizli </option>
                </select>
            </div>
            <div class="grid grid-cols-2 gap-4">
                <div class="flex flex-col gap-4">
                    <h3 class="text-black text-xl font-semibold">Resimli Metin 1</h3>
                    <div class="form-item">
                        <label for="1_small_title">Küçük Başlık</label>
                        <input type="text" id="1_small_title" name="1_small_title" value="{{ $data->small_title_1 }}">
                    </div>
                    <div class="form-item">
                        <label for="1_big_title">Büyük Başlık</label>
                        <input type="text" id="1_big_title" name="1_big_title" value="{{ $data->big_title_1 }}">
                    </div>
                    <div class="form-item">
                        <label for="1_button_text">Buton Metni</label>
                        <input type="text" id="1_button_text" name="1_button_text" value="{{ $data->button_text_1 }}">
                    </div>
                    <div class="form-item">
                        <label for="1_button_link">Buton Linki</label>
                        <input type="text" id="1_button_link" name="1_button_link" value="{{ $data->button_link_1 }}">
                    </div>
                    <div class="form-item">
                        <label for="1_bg_color">Arka Plan Rengi</label>
                        <input type="color" class="h-[42px] !p-1.5" id="1_bg_color" name="1_bg_color" value="{{ $data->bg_color_1 }}">
                    </div>
                    <div class="grid grid-cols-12 gap-4">
                        <div class="form-item col-span-9">
                            <label for="image_1"> Görsel </label>
                            <input type="hidden" name="image_1_old" value="{{ $data->image_1 }}">
                            <input type="file" id="image_1" name="image_1">
                        </div>
                        <div class="col-span-3">
                            <img src="{{ upload('text_with_image', $data->image_1) }}" class="mt-[32px] rounded-lg" alt="">
                        </div>
                    </div>
                </div>
                <div class="flex flex-col gap-4">
                    <h3 class="text-black text-xl font-semibold">Resimli Metin 2</h3>
                    <div class="form-item">
                        <label for="2_small_title">Küçük Başlık</label>
                        <input type="text" id="2_small_title" name="2_small_title" value="{{ $data->small_title_2 }}">
                    </div>
                    <div class="form-item">
                        <label for="2_big_title">Büyük Başlık</label>
                        <input type="text" id="2_big_title" name="2_big_title" value="{{ $data->big_title_2 }}">
                    </div>
                    <div class="form-item">
                        <label for="2_button_text">Buton Metni</label>
                        <input type="text" id="2_button_text" name="2_button_text" value="{{ $data->button_text_2 }}">
                    </div>
                    <div class="form-item">
                        <label for="2_button_link">Buton Linki</label>
                        <input type="text" id="2_button_link" name="2_button_link" value="{{ $data->button_link_2 }}">
                    </div>
                    <div class="form-item">
                        <label for="2_bg_color">Arka Plan Rengi</label>
                        <input type="color" class="h-[42px] !p-1.5" id="2_bg_color" name="2_bg_color" value="{{ $data->bg_color_2 }}">
                    </div>
                    <div class="grid grid-cols-12 gap-4">
                        <div class="form-item col-span-9">
                            <label for="image_2"> Görsel </label>
                            <input type="hidden" name="image_2_old" value="{{ $data->image_2 }}">
                            <input type="file" id="image_2" name="image_2">
                        </div>
                        <div class="col-span-3">
                            <img src="{{ upload('text_with_image', $data->image_2) }}" class="mt-[32px] rounded-lg" alt="">
                        </div>
                    </div>
                </div>
            </div>

            <div class="flex items-center justify-end gap-2">
                <button class="border border-gray-300 bg-gray-50 hover:bg-gray-200 px-4 py-2 rounded-md" type="reset"> Sıfırla</button>
                <button class="border border-green-300 bg-green-50 hover:bg-green-200 px-4 py-2 rounded-md"> Kaydet</button>
            </div>
        </form>
    </section>
    <style>
        .select2-search.select2-search--dropdown{
            display: none!important;
        }
    </style>
@endsection