How do you change button order?
I noticed that the button order isn't consistent with create/edit/delete actions. Is there a way to change this?
Ideally I'd like to swap the buttons on the delete confirmation modal since we're mainly a Windows shop (primary action on the left).
8 Replies
I don't think there a function or something to do it but you can give it a try with css
something like
or something similar
I don't think that will work. It appears to be using CSS Grid rather than Flexbox, but the real issue is that it would reverse the button order for create/edit too which defeats the purpose of making it consistent.
Solution
Override the modal footer actions and reverse the array of actions.
->modalFooterActions([
$this->getSubmitAction(),
$this->getCancelAction()
])
Something like that.
Is there a way to add CSS classes on an action's submit button? Because it's grid, adding
order-first
class would solve the issue for meYou could create a custom theme and apply any styles you want. If you need to target a specific action you can probably use extraAttributes() to add a class to target a specific action.
But that will probably be applied to the button and not the modal. You’ll need to use some specific attribute selectors to target the modal probably.
In curator I use this to target its specific modal. [wire:key*="open_curation_panel"]
As an example
Easiest approach though would be to change the modalFooterActions array.
Ah ha! I got it!
I couldn't find where to do this?
On my phone so I probably didn’t name the methods right. But a good ide should be able to inspect and autocomplete them. Sorry. But yea there’s multiple ways to accomplish the end goal.