@extends('frontend.layouts.navBar')

@section('content')

<style>
     img {
	-webkit-transform: scale(1.25);
	transform: scale(1.25);
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
}
     :hover img {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
</style>

    <div class="page">
        <section class="breadcrumbs-custom">
            <div class="parallax-container" data-parallax-img="{{ asset('frontend/images/logiciel.jpg') }}">
                <div class="breadcrumbs-custom-body parallax-content context-dark">
                    <div class="container">
                        <h2 class="breadcrumbs-custom-title">Shop</h2>
                    </div>
                </div>
            </div>
            <div class="breadcrumbs-custom-footer">
                <div class="container">
                    <ul class="breadcrumbs-custom-path">
                        <li><a href="/">Accueil</a></li>
                       <li class="active">Logiciels</li>
                    </ul>
                </div>
            </div>
        </section>
        <!-- Section Shop-->


        <section class="section produit section-xxl bg-default text-md-left">
            <div class="container produit">

						<div class="row">
                            @foreach ($logiciels as $logiciel)
                                <div class="col-sm-6 col-md-4 col-lg-6 col-xl-4" >
                                    <!-- Product-->
                                    <article class="product">
                                        <div class="product-body">
                                            <div class="product-figure"><img
                                                    src="{{ asset('storage/image/' . $logiciel->image) }}" alt=""
                                                    width="220" height="160" />
                                            </div>
                                            <h5 class="transform-none product-title"><a
                                                    href="{{ route('logiciel.show', ['id' => $logiciel]) }}">{{ $logiciel->nom }}</a>
                                            </h5>

                                        </div>

                                        <div class="product-button-wrap mt-4">
                                            <div class="product-button"><a class="button button-secondary button-zakaria "
                                                    href="{{ route('logiciel.show', ['id' => $logiciel]) }}"><i
                                                        class="fa-solid fa-plus"
                                                        style="color: grey; text-align:center"></i></a></div>

                                        </div>
                                    </article>
                                </div>
                            @endforeach

                        </div>
				</div>
        </section>
    </div>
@endsection