Restore the ITK admin styling and use EasyAdmin's own components - #94
Merged
Conversation
API Specification - Non-breaking changesNo changelog changes |
Codecov Report✅ All modified and coverable lines are covered by tests. Additional details and impacted files@@ Coverage Diff @@
## develop #94 +/- ##
=============================================
+ Coverage 37.14% 37.99% +0.84%
+ Complexity 948 946 -2
=============================================
Files 133 133
Lines 2972 2982 +10
=============================================
+ Hits 1104 1133 +29
+ Misses 1868 1849 -19
Flags with carried forward coverage won't be shown. Click here to find out more. ☔ View full report in Codecov by Harness. 🚀 New features to boost your workflow:
|
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Link to ticket
TODO: no ticket linked yet — please add before review.
Description
Follow-up to #93, which took EasyAdmin from 5.0.11 to 5.5.1. I read the maintainer's "New in EasyAdmin" posts for 5.2 through 5.5 and checked each addition against this codebase. Three things were worth doing; what I skipped is listed at the bottom.
The ITK colours have not been applied in the admin since May. Tracking
admin.cssthrough the history:public/css/admin.cssadded, holding the ITK:rootblock — bluergb(0,123,166)for buttons, links, the active sidebar item and true-boolean badges; redrgb(228,73,48)for false badges and danger; greyrgb(66,66,66)for textassets/styles/app.css.configureAssets()kept addingcss/admin.css, so every admin page has emitted a<link>to a 404 sinceassets/styles/app.cssreaches nothing. It is imported byassets/app.js, the AssetMapperappentrypoint, which onlytemplates/base.html.twigwould load — and that template callsencore_entry_link_tags('app'), an Encore entry that does not exist, and no template extends itSo the branding was not just unstyled in the admin, it was unreachable everywhere. This PR restores it in two parts:
Theme::new()->primaryColor('#007ba6'). In 5.5--button-primary-bg,--link-color,--sidebar-menu-active-item-colorand--badge-boolean-true-bgall derive from--ea-primary, so one call replaces five overrides, and the theme computes the text colour that sits on top of it (--ea-primary-foreground: #fff) instead of us guessing.DashboardController::configureAssets()adds for every admin page. What remains is what the theme API cannot express: the ITK red, and the grey text (grays()only takes named ramps likezincorslate, not an arbitrary colour).Badges and icons now use EasyAdmin's own components. 5.2 shipped a component library (
<twig:ea:Badge>,<twig:ea:Icon>), and 5.3/5.4 moved styling onto design tokens and CSS cascade layers. Our field templates hand-rolled<span class="badge badge-danger">in 17 places, which works today only because the old classes still exist. Upstream's owncrud/field/association.html.twigis now written with the component, and going through it means the admin picks up the theming above rather than shadowing it.The
AutoBadgeclasses are gone.AutoBadgeMenuItemandAutoBadgeCrudMenuItemexisted to hide a menu badge when its count was zero, by wrappingCrudMenuItemand proxying every other call through__call()— two classes, ~100 lines.MenuItemDto::hasVisibleBadge()now does that fornullcontent, sosetBadge($count ?: null, 'dark')covers it. Nothing referenced the two classes any more, so the dashboard had gone back to showing a literal "0"; that goes away too.Screenshot of the result
The admin gets its ITK blue back, so this is worth a look on staging rather than from a diff. What I verified locally on the rendered
/admin/server:--ea-primary: #007ba6and--ea-primary-foreground: #fffin the theme block/build/admin.778bbafb.cssserved 200, where/css/admin.cssused to 404.badge > .icon > i, which 5.5's theme styles with a.badge:has(>.icon)rule that the hand-rolled<i>never matchedChecklist
AdminSmokeTestloads the index page of all 16 CRUD controllers as a logged-in user, so every template touched here is rendered by the suite. PHPUnit, PHPStan, PHP-CS-Fixer, twig-cs-fixer, markdownlint and Prettier (includingyarn coding-standards-checkforwebpack.config.jsand the stylesheet) all pass locally.Additional comments or questions
assets/styles/app.cssis EasyAdmin-only despite its name, andtemplates/base.html.twigstill points at an Encoreappentry that does not exist. Both are leftovers from #81's AssetMapper-then-Encore round trip. I left them alone: nothing extendsbase.html.twig, so it is inert, and renaming the stylesheet would dragassets/app.jsandimportmap.phpinto a PR that is meant to be about EasyAdmin.Researched and deliberately not done:
prepend()/append(). Our custom field templates are all index/detail rendering, where addons do not apply. They would suitmonthlyPrice,cybersecurityPriceandquarterlyHourson Service Agreements, but that adds a unit hint rather than removing code, and I do not know which currency those prices are in.AssociationFieldsorting (5.5) — no CRUD controller overridescreateIndexQueryBuilderor joins for sorting, so there is nothing to replace.keepOpen()(5.3) — we use no tabs, override no detail templates, and the menu is flat.DashboardControllerstill counts advisories on every admin page load to draw that badge, the follow-up noted on #91. Caching it is a different change from this one.