EasyAdmin 5.3 is out, and it continues the work started in recent releases: modernizing the interface piece by piece while preparing the upcoming theming system. The star of this release is a completely rebuilt sidebar and main menu, along with two internal changes (CSS layers and design tokens) that make your life easier today and theming possible tomorrow. It also adds support for Symfony Reprise, a brand-new Symfony project you'll hear a lot about soon.
As usual, nothing breaks. Your existing backends and menu configuration keep working exactly as before, they just look and feel better.
A Modernized Sidebar and Main Menu
The sidebar is one of the oldest parts of EasyAdmin. Its internals dated back to the first Bootstrap-era versions of the bundle: imperative JavaScript to expand/collapse submenus, fake links acting as buttons, and CSS that was hard to evolve. In EasyAdmin 5.3, all of that has been replaced.
BEFORE: expanded sidebar; compact sidebar; and hover state in compact sidebar
AFTER: expanded sidebar; compact sidebar; and hover state in compact sidebar
Here's what you get automatically, without changing a single line of your code:
- A much better compact mode: when the sidebar is collapsed to the icon rail, hovering an item now shows a pure-CSS tooltip (dark in light mode, light in dark mode). Items with submenus show a flyout panel titled with the parent label, and items with hidden badges display a small dot on the icon so you don't miss anything.
-
Smoother submenus: the expand/collapse accordion is now pure CSS (animating
grid-template-rows) instead of JavaScript fiddling with element heights. Expanded submenus display a thin vertical guide line, and sub-items keep supporting icons. - Nicer details everywhere: icons and badges are better aligned, the sidebar resizer shows a directional cursor, clickable elements have more spacing for a better UX, etc.
-
Improved accessibility: items with submenus are now real
<button>elements witharia-expanded, tooltips and flyouts also open with keyboard focus, all animations respectprefers-reduced-motion, and the active menu item announcesaria-current="page"and is scrolled into view on page load if needed.
All this is powered by a new <twig:ea:Sidebar> component family (Sidebar, Sidebar:Header, Sidebar:Content, Sidebar:Group, Sidebar:Item, Sidebar:Submenu, and Sidebar:Footer), inspired by shadcn/ui's Sidebar but deliberately simpler. Honestly, most of you will never use these components directly; they exist so the menu you already have works better. But this keeps advancing one of EasyAdmin's long-term goals: rendering the entire UI with reusable Twig components.
The rebuild also enables two small new features. First, submenus can now be rendered always expanded and non-collapsible with the new keepOpen() method. This is handy when you use submenus to group related items but want all of them permanently visible:
use EasyCorp\Bundle\EasyAdminBundle\Config\MenuItem;
public function configureMenuItems(): iterable
{
yield MenuItem::linkToDashboard('Dashboard', 'fa fa-home');
yield MenuItem::subMenu('Blog', 'fa fa-newspaper')
->setSubItems([
MenuItem::linkToCrud('Posts', 'fa fa-file-lines', Post::class),
MenuItem::linkToCrud('Categories', 'fa fa-tags', Category::class),
])
->keepOpen();
}
Second, there's a new sidebar_footer block. Unlike the existing main_menu_after block (which renders in the normal document flow, right after the menu items), the sidebar footer is always anchored to the bottom of the screen and menu items scroll underneath it. Use it for important messages or notices that must remain visible:
{# templates/admin/layout.html.twig #}
{% extends '@!EasyAdmin/layout.html.twig' %}
{% block sidebar_footer %}
<twig:ea:Alert variant="warning">
Scheduled maintenance on Sunday at 02:00 UTC.
</twig:ea:Alert>
{% endblock %}
Theming Is Getting Closer
As mentioned in the EasyAdmin 5.2 announcement, we're building a theming system that will let you customize the entire backend with a small set of global design variables, much like shadcn/ui does. Theming will probably be included in the next stable version. EasyAdmin 5.3 ships the two last pieces of groundwork, and one of them is useful to you right now.
First, all EasyAdmin styles are now wrapped in CSS cascade layers. Your backends look exactly the same, but overriding EasyAdmin styles becomes trivial: unlayered styles (yours) always beat layered styles (EasyAdmin's), regardless of selector specificity. No more !important or artificially specific selectors:
/* BEFORE: your overrides had to fight EasyAdmin's specificity */
body #main .content-panel {
border-radius: 0 !important;
}
/* AFTER: a plain selector always wins */
.content-panel {
border-radius: 0;
}
Second, the entire backend now derives from a compact set of base design tokens. Spacing values snap to a common grid, dozens of hardcoded colors now follow the primary color token, grays are unified into a single neutral scale, and even the autocomplete widget (which used its own hardcoded Bootstrap colors) finally follows the theme. This is what will make theming work: change a handful of tokens and the whole backend re-themes coherently.
Note: This uniformization causes some intentional but very minor visual shifts after upgrading (a pixel or two here and there). Nothing in your code needs to change.
Support for Symfony Reprise
Symfony Reprise is one of the newest Symfony projects, created by Hugo Alliaume, a member of the Symfony Core Team. In short, Reprise is the spiritual successor of Webpack Encore: it brings the same first-class Symfony asset integration, but for modern bundlers like Vite and Rsbuild. It's still experimental, but it's moving fast.
EasyAdmin 5.3 supports Reprise assets with the same API you already know from the Encore and AssetMapper integrations:
use EasyCorp\Bundle\EasyAdminBundle\Config\Assets;
public function configureAssets(Assets $assets): Assets
{
return $assets->addRepriseEntry('admin');
}
You can also use addRepriseEntries() when configuring field assets, and Asset::new('...')->reprisePackageName('...') to associate an entry with a specific Symfony Asset package. EasyAdmin renders the entries with the appropriate reprise_entry_script_tags() and reprise_entry_link_tags() Twig functions automatically.
Also in This Release
EasyAdmin 5.3 includes other smaller improvements: the tab badges introduced in 5.2 for forms are now also displayed on the detail page, and MoneyField now formats Money objects correctly for currencies that don't use 2 decimals. See the full changelog for all the details.
Summary
EasyAdmin 5.3 delivers a modernized sidebar and menu with better animations, a smarter compact mode, and improved accessibility; CSS layers that make your style overrides trivial; design tokens that pave the way for the upcoming theming system; and support for Symfony Reprise. All of it 100% backwards compatible.
✨ If you enjoyed this feature and want to see more like it, consider sponsoring the EasyAdmin project 🙌💡


Top comments (0)