Setting the style of EasyAdmin badges

New in EasyAdmin 5.8. EasyAdmin badges (the small colored labels of a status or a type) have been redesigned. The <twig:ea:Badge> component separates two settings that used to be mixed up: the color (color) and the style (variant). This separation started in 5.7; 5.8 adds a style setting for a whole back office. There are four styles: light (the default, with a thin border), solid, outline and dot (a colored dot before the text).

Before

{# variant carried the color #}
<twig:ea:Badge variant="success">Confirmed</twig:ea:Badge>

Today

<twig:ea:Badge color="success">Confirmed</twig:ea:Badge>
<twig:ea:Badge variant="solid" color="danger">Cancelled</twig:ea:Badge>
<twig:ea:Badge variant="dot" color="warning">Pending</twig:ea:Badge>

The default style is not repeated on each badge: it is set once on the Crud object, with setBadgeVariant():

public function configureCrud(): Crud
{
    // in the dashboard: for the whole back office
    return Crud::new()->setBadgeVariant('solid');
}

Called in a CRUD controller, the setting only applies to it, and wins over the dashboard's setting. A badge that sets its own variant keeps it in every case. The badges EasyAdmin renders itself, such as those of ChoiceField::renderAsBadges(), follow this setting too.

Passing a color in variant still works, but it has been deprecated since 5.7.

Your task

The back office of a holiday cottage displays the status of each reservation with a custom template, written with the old syntax. Update it:

1. In templates/admin/reservation/badge.html.twig, give the color of each badge with color.
2. Make every badge of the back office solid: those of the reservations as well as those of the client type, in the client list. ClientCrudController is not to be changed: the setting goes in the dashboard.
3. In the reservation list only, turn them into colored dots (dot).
4. The "Cancelled" badge must stand out: it stays solid, even in the reservation list.