F
Filament13mo ago
morty

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).
No description
No description
Solution:
Override the modal footer actions and reverse the array of actions.
Jump to solution
8 Replies
ChesterS
ChesterS13mo ago
I don't think there a function or something to do it but you can give it a try with css something like
.fi-modal-footer-actions {
display: flex;
flex-direction: row-reverse;
}
.fi-modal-footer-actions {
display: flex;
flex-direction: row-reverse;
}
or something similar
morty
mortyOP13mo ago
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
awcodes
awcodes13mo ago
Override the modal footer actions and reverse the array of actions.
awcodes
awcodes13mo ago
->modalFooterActions([ $this->getSubmitAction(), $this->getCancelAction() ]) Something like that.
morty
mortyOP13mo ago
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 me
awcodes
awcodes13mo ago
You 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.
morty
mortyOP13mo ago
Ah ha! I got it!
Tables\Actions\DeleteAction::make()->modalSubmitAction(fn (StaticAction $action) => $action->extraAttributes(['class' => 'order-first'])),
Tables\Actions\DeleteAction::make()->modalSubmitAction(fn (StaticAction $action) => $action->extraAttributes(['class' => 'order-first'])),
I couldn't find where to do this?
awcodes
awcodes13mo ago
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.
Want results from more Discord servers?
Add your server