Add class only on first carousel-cell (flickity)-CodePudding

i would have the class "opacity" inserted only at the first "carousel-cell".

For the rest in the loop, they should not be there.

<div >
            @foreach($projects as $p)
                @if($p->getMedia('teaser')->first() ?? "")
                    <div >
                        <div >
                            <div id="project-info" >
                                <div >
                                    <h2 >{{$p->name}}</h2>
                                    <h3 ><a href="#">Foto</a> / <a href="#">Video Produktion</a></h3>
                                </div>
                            </div>
                            <div >

                                <a href="{{url('projects')}}/{{$p->slug}}">
                                    <div >
                                        <img src="{{asset('storage')}}/{{$p->getMedia('teaser')->first()->id}}/{{$p->getMedia('teaser')->first()->file_name}}"  alt="Land Rover">
                                    </div>
                                </a>

                            </div>
                        </div>
                    </div>
                @endif
            @endforeach
        </div>

CodePudding user response：

You could use the $loop->first variable to add a class only on the first iteration of the loop.

Like this: <div >

See more here: https://laravel.com/docs/9.x/blade#the-loop-variable