CODEWITHSUNDEEP
laraveltwitter-bootstrap
Giacomo
Giacomo

Reputation: 341

Laravel | Bootstrap 5 pills - class active/show

how can I correct add show and active class to bootstrap 5 pills?? Now I try to do something like this:

<div class="nav-head">
<ul class="nav nav-pills mb-3" id="pills-tab" role="tablist">
@foreach($blocks as $item)
@foreach ($item->offers->take(4) as $offer)
      <li class="nav-item" role="presentation">
           <a class="nav-link {{ $offer->first ? 'active' : ''}} {{ $offer->first ? 'show' : ''}}" data-bs-toggle="tab" href="#tabs-{{ $offer->id }}">{{ $offer->title }}</a>
     </li>
@endforeach
@endforeach
</ul>
</div>

<div class="tab-content" id="pills-tabContent">
@foreach($blocks as $item)
@foreach ($item->offers as $offer)
       <div class="tab-pane fade {{ $offer->first ? 'active' : ''}} {{ $offer->first ? 'show' : ''}}" id="tabs-{{ $offer->id }}" role="tabpanel" aria-labelledby="live-chat-tab">
...
      </div>
@endforeach
@endforeach
</div>

Line:

{{ $offer->first ? 'active' : ''}} {{ $offer->first ? 'show' : ''}}

but it doesn't work. Can you help me? Thanks!

Upvotes: 0

Views: 239

Answers (1)

John Lobo
John Lobo

Reputation: 15319

It should be $loop->first not $offer->first

When looping, a $loop variable will be available inside of your loop. This variable provides access to some useful bits of information such as the current loop index and whether this is the first or last iteration through the loop:

{{$loop->first ? 'active' : ''}} {{$loop->first ? 'show' : ''}}

Ref:https://laravel.com/docs/8.x/blade#the-loop-variable

Upvotes: 2

Related Questions