James Pike
James Pike

Reputation: 171

Run foreach with 2 different background styles

The layout im using for the foreach loop to return data toI am trying to run a foreach loop to return the title and price. But i need the results to go into different boxes, one has a background img, the other has no background img. The boxes alternate down the page.

Bootstrap row and columns, one with bg image, the other without[![][1]]3

Upvotes: 0

Views: 399

Answers (2)

Cloud Soh Jun Fu
Cloud Soh Jun Fu

Reputation: 1512

I assume that you're referring to dynamic adding a class card-w-bg to your cards.

Solution 1: Adding background boolean to your card and use it to determine.

@foreach($cards as $card)
<div class="col-4">
    <div class="card x-auto @if($card->background) card-w-bg @endif">
        {{ $card->title }}
        {{ $card->description }}
    </div>
</div>
@endforeach

Solution 2: In your case, it seems like the background appears at the odd number of your cards. Use the loop variable.

<div class="@if($loop->odd) card-w-bg @endif">

However, the $loop->even only works in Laravel 5.8. Use @if($loop->iteration % 2) instead if below Laravel 5.8

Upvotes: 3

A. Dady
A. Dady

Reputation: 143

Have you tried this? http://image.intervention.io/api/text

Hint: you can capture the image size and do the math to set the text X,Y for the text overlay.

Upvotes: 0

Related Questions