@extends('user.layouts.user')
@section('title', 'الارآء')
@section('content')
<section class="main-section py-5">
  <div class="container">
    <div class="holder d-flex align-items-center justify-content-between mb-4">
      <h4 class="main-heading mb-0">الارآء</h4>
      <a href="{{ route('profile.edit') }}" class="btn btn-sm px-3 btn-secondary">الحساب الشخصي <i
          class="fa-solid fa-angle-left"></i></a>
    </div>
    <div class="section-content">
      <div class="button-holder">
        <button class="btn btn-success px-4" data-bs-toggle="modal" data-bs-target="#opinionModal">اضف رآىك</button>
        <!-- Modal -->
        <div class="modal fade" id="opinionModal" aria-hidden="false">
          <div class="modal-dialog">
            <div class="modal-content">
              <div class="modal-header">
                <h1 class="modal-title fs-5 m-0" id="exampleModalLabel">اضف رآىك</h1>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
              </div>
              <div class="modal-body">
                <div class="row g-2">
                  <div class="col-12 col-md-12">
                    <div class="inp-holder">
                      <label for="title" class="form-label mb-1">العنوان</label>
                      <input type="text" class="form-control" id="title">
                    </div>
                  </div>
                  <div class="col-12 col-md-12">
                    <div class="mb-3">
                      <label for="content" class="form-label mb-1">رايك</label>
                      <textarea class="form-control" id="content" rows="3"></textarea>
                    </div>
                  </div>
                  <div class="col-12 col-md-12">
                    <div class="mb-3">
                      <label for="image" class="form-label mb-1">صورة</label>
                      <input type="file" class="form-control" id="image">
                    </div>
                  </div>
                </div>
              </div>
              <div class="modal-footer">
                <button type="button" class="btn btn-secondary btn-sm px-4" data-bs-dismiss="modal">تراجع</button>
                <button type="button" wire:click="save" class="btn btn-success btn-sm px-4">ارسال</button>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</section>
@endsection