Change (e-mail) button colors in Laravel 5.7

Question

What is the best way to change the success, error and primary colors in Laravel 5.7?

I have the email.blade.php via php artisan vendor:publish --tag=laravel-notifications

...
{{-- Action Button --}}
@isset($actionText)
<?php
    switch ($level) {
        case 'success':
        case 'error':
            $color = $level;
            break;
        default:
            $color = 'primary';
    }
?>
@component('mail::button', ['url' => $actionUrl, 'color' => $color])
...

The template uses the 'success', 'error' and 'primary' to color the button, but where can I change the values for them?

Answer 1

This is the best and correct way from

https://laracasts.com/series/whats-new-in-laravel-5-4/episodes/7

(I'll extract) - Run

php artisan vendor:publish --tag=laravel-mail, this will create vendors/html folder in your views directory.

Then create a new theme file at

/resources/views/vendor/mail/html/themes/my_theme.css

Then in

config/mail.php

Set new theme

        'theme' => 'my_theme',

        'paths' => [
            resource_path('views/vendor/mail'),
        ],
    ],

Now you can set your own CSS and create any new button colours.

@component('mail::button', ['url' => $url, 'color' => 'success'])
View Group
@endcomponent

Answer 2

Just run php artisan vendor:publish --tag=laravel-mail, this will create vendors/html folder in your views directory.

Then edit the /resources/views/vendor/mail/html/themes/default.css file and change .button-primary class.

Additionally, you have access to all the HTML code of each mail notification component as well if CSS changes are not enough.