DEV Community 👩‍💻👨‍💻

Cover image for Conditional Classes Blade Directives in Laravel
Suresh Ramani
Suresh Ramani

Posted on • Originally published at techvblogs.com

Conditional Classes Blade Directives in Laravel

New in Laravel 8.51: @class Blade directive to add true/false conditions on whether some CSS class should be added.

The @class directive conditionally compiles a CSS class string. The directive accepts an array of classes where the array key contains the class or classes you wish to add, while the value is a boolean expression. If the array element has a numeric key, it will always be included in the rendered class list:

@php
    $hasError = true;
@endphp

<span @class([
    'p-4',
    'bg-red' => $hasError,
])></span>
Enter fullscreen mode Exit fullscreen mode

Thank you for reading this blog.

Top comments (2)

Collapse
bobbyiliev profile image
Bobby Iliev

Nice, very cool tip! I should upgrade to Laravel 8.51

Collapse
bdelespierre profile image
Benjamin Delespierre

Amazing!

🌚 Browsing with dark mode makes you a better developer by a factor of exactly 40.

It's a scientific fact.