@extends('dashboard.layout.layout')

@section('content')
<!-- app ecommerce details start -->
<section class="app-ecommerce-details">
    <div class="card border-info">
        <div class="card-body">
            <div class="row mb-5 mt-2">
                <div class="col-12 col-md-7">
                    <h5>{{ $gift->title }}
                    </h5>
                    <hr>
                    <p>{{ $gift->description }}</p>
                    <hr>
                    <p>{{ $gift->type }}</p>
                    <hr>
                    <p>{{ $gift->value }}</p>
                    <div class="d-flex flex-column flex-sm-row col-md-5">
                        <a href="{{ route('dashboard.gift.edit',$gift->id) }}" class="btn btn-block btn-primary mr-0 mr-sm-1 mb-1 mb-sm-0"><i class="feather icon-edit mr-25"></i>{!! trans('dashboard.general.edit') !!}</a>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>
<!-- app ecommerce details end -->
@endsection

@section('vendor_styles')
<link rel="stylesheet" type="text/css" href="{{ asset('dashboardAssets') }}/vendors/css/forms/spinner/jquery.bootstrap-touchspin.css">
<link rel="stylesheet" type="text/css" href="{{ asset('dashboardAssets') }}/vendors/css/extensions/swiper.min.css">
@endsection

@section('page_styles')
<link rel="stylesheet" type="text/css" href="{{ asset('dashboardAssets') }}/{{ LaravelLocalization::getCurrentLocaleDirection() }}/css/pages/app-ecommerce-details.css">
<link rel="stylesheet" href="{{ asset('dashboardAssets') }}/global/css/custom/custom_rate.css">
<link rel="stylesheet" type="text/css" href="{{ asset('dashboardAssets') }}/{{ LaravelLocalization::getCurrentLocaleDirection() }}/css/pages/users.css">
<link rel="stylesheet" type="text/css" href="{{ asset('dashboardAssets') }}/{{ LaravelLocalization::getCurrentLocaleDirection() }}/css/plugins/extensions/swiper.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/fancyapps/fancybox@3.5.7/dist/jquery.fancybox.min.css" />
<style media="screen">
    .toggle-edit .custom-control-label:before {
        background-color: #666b81 !important;
        height: 26px !important;
        width: 80px !important;
    }

    .toggle-edit .custom-control-label:after {
        height: 21px !important;
        width: 21px !important;
    }

    .toggle-edit .custom-control-label {
        width: 82px !important;
    }
</style>
@endsection

@section('vendor_scripts')
<script src="{{ asset('dashboardAssets') }}/vendors/js/forms/spinner/jquery.bootstrap-touchspin.js"></script>
<script src="{{ asset('dashboardAssets') }}/vendors/js/extensions/swiper.min.js"></script>
@endsection

@section('page_scripts')
<script src="{{ asset('dashboardAssets') }}/js/scripts/pages/app-ecommerce-details.js"></script>
<script src="{{ asset('dashboardAssets') }}/js/scripts/forms/number-input.js"></script>
<script src="{{ asset('dashboardAssets') }}/js/scripts/pages/user-profile.js"></script>
<script src="{{ asset('dashboardAssets') }}/js/scripts/extensions/swiper.js"></script>
<script src="https://cdn.jsdelivr.net/gh/fancyapps/fancybox@3.5.7/dist/jquery.fancybox.min.js"></script>
<script>

$(function(){
    var mySwiper8 = new Swiper('.swiper-custom', {
        spaceBetween: 30,
        centeredSlides: true,
        autoplay: {
          delay: 2500,
          disableOnInteraction: true,
        },
        pagination: {
          el: '.swiper-pagination',
          clickable: true,
        },
    });
})

</script>
@endsection