@extends('web_layouts.layout')
{{-- title --}}
@section('title','Products page')

@section('content')
<div id="middle">
    <section class="midd-inner-banner">
        <div class="container">
            <div class="row">
                <div class="col-lg-12">
                    <div class="inner-banner-area">
                        <h1 class="cmn-hd-inner"><span></span>Products</h1>
                        <div class="breadcrumb"><a href="{{url('/')}}">Home</a> <em></em> Products </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <section class="common-section ml-5 container ">
        <div class="row">
            @foreach($product as $pro)
            <div class="col-md-4">
                <div class="box box-blue">
                    <div class="row ">
                        <div class="col-sm-6">
                            <h2>{{$pro->title}}</h2>
                            <p>{{$pro->description}} </p>
                            <h3>{{$pro->price}}</h3>
                            <div class="offer-bottum">
                                <a href="#" class="btn-buy-now">Buy Now</a>
                            </div>
                        </div>
                        <div class="pro-image col-sm-6 ">
                            <Img src="{{$pro->icon}}" width="150px" ></Img>
                        </div>
                    </div>
                </div>
            </div>
            @endforeach
        </div>
    </section>
    @endsection