@extends('frontend.layout.master')
@section('content')
    <div class="container">
        <div class="breadcrumb-wrapper">
            <nav aria-label="breadcrumb">
                <ol class="breadcrumb">


                    <li class="breadcrumb-item"><a href="{{route('home')}}">Home</a></li>
                    <li class="breadcrumb-item active" aria-current="page">solutions</li>


                </ol>
            </nav>
        </div>
    </div>

    <!-- case study page  -->
    <section class="case-study section-gap" data-aos="fade-up" data-aos-offset="200" data-aos-easing="ease-in-sine"
             data-aos-duration="700">
        <div class="container">
            <div class="headingArea">
                <h2 class="h2">We create elegent solutions</h2>
            </div>
            <div class="row align-items-center justify-content-center">

                @if(!empty($solutions))
                    @foreach($solutions as $solution)
                        <div class="col-md-6 col-lg-4 col-xl-3">
                            <div class="case-study-box">
                                <div class="img-area">
                                    <img src="{{url('/')}}/{{ $solution->image }}" alt="" loading="lazy">
                                </div>
                                <div class="txt-area">
                                    <div class="h4">{{ $solution->name }}</div>
                                    <p>
                                        {{ $solution->description }}
                                    </p>
                                </div>
                            </div>
                        </div>


                    @endforeach
                @endif
            </div>

        </div>
    </section>
    <section class="brand-area section-area" data-aos="zoom-in" data-aos-offset="200" data-aos-easing="ease-in-sine"
             data-aos-duration="1200" id="brands-area">
        <div class="container">
            <div class="row">
                <div class="col-md-12">
                    <div class="headingArea text-center">
                        <h2 class="h2">
                            Our Partners and Clients
                        </h2>
                    </div>
                </div>
            </div>

            <section class="owl-carousel owl-theme brand-carousel">

                @foreach($brands as $brand)
                    <div class="brand-info">
                        <img src="{{url('/')}}/{{$brand->image}}" alt="" loading="lazy"/>
                    </div>
                @endforeach

            </section>
        </div>
    </section>
@endsection
@push('scripts')
    <script>

        // function readcontant(id){
        //     console.log($(this).attr('data-value') );
        //     $('.textCont').slideToggle();
        //     if ($(this).attr('data-value') == "1") {
        //         $(this).attr('data-value',"0")
        //         $(this).text("Read less")
        //     } else {
        //         $(this).text("Read more")
        //     }
        // }

        // function readcontant(id){
        //     $('.textCont').slideToggle();
        //     if ($('#btnn1'+id).text() == "Read more") {
        //         $(this).text("Read less")
        //     } else {
        //         $(this).text("Read more")
        //     }
        // }

        $(document).on('click', '.btn1', function () {
            var id = $(this).attr('data-demo');
            var data = $(this).attr('data-id');
            // $('#abc'+data).slideToggle();

            $(this).parent().find('span').slideToggle();
            if (id == "1") {
                $(this).attr('data-demo', '0')
                $(this).text("Read less")
            } else {
                $(this).attr('data-demo', '1')
                $(this).text("Read more")
            }
        })


    </script>
@endpush