@extends('vendor.site-bases.website.layouts.master')

@section('title', trans('title.builds'))

@section('page_title', trans('title.builds'))

@section('breadcrumbs')
    {!! Breadcrumbs::render('builds') !!}
@endsection

@section('content')
    @if ($builds->count() > 0)
        <div class="customers">
            <div class="container">
                <div class="customers_container">
                    <div class="text">
                        <h3>
                            {{ $builds->first()->title }}
                        </h3>
                        <div class="text-build">
                            {!! $builds->first()->description !!}
                        </div>
                        <div class="texts_slider_navs">
                            <div class="swiper-button-prev">
                                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 6 9">
                                    <path id="prefix__Path_143" d="M3 4.5l-3-3L1.5 0 6 4.5 1.5 9 0 7.5z" data-name="Path 143" transform="rotate(180 3 4.5)" style="fill:#fab820"/>
                                </svg>
                            </div>
                            <div class="swiper-button-next">
                                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 6 9">
                                    <path id="prefix__Path_142" d="M12.344 12.257l-3-3 1.5-1.5 4.5 4.5-4.5 4.5-1.5-1.5z" data-name="Path 142" transform="translate(-9.343 -7.757)" style="fill:#fab820"/>
                                </svg>
                            </div>
                        </div>
                    </div>
                    <div class="images_slider">
                        <div class="main_image">
                            <div class="main_image_transform">
                                <img src="{{ asset($builds->first()->image) }}" alt="{{ $builds->first()->title }}">
                            </div>
                        </div>
                        <div class="swiper-container">
                            <div class="swiper-wrapper">
                                @foreach ($builds as $item)
                                    <div class="swiper-slide">
                                        <div class="image" data-title="{{ $item->title }}" data-image="{{ asset($item->image) }}" data-desc='{!! $item->description !!}'>
                                            <img src="{{ asset($item->thumb) }}" alt="{{ $item->title }}">
                                        </div>
                                    </div>
                                @endforeach
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="customers_decor" data-dots="" data-type="stroke" data-color="rgba(28, 68, 80, .5)" data-element-width="1.5"></div>
        </div>
    @endif
@endsection