Stuck on an issue?
Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.
And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.
Modal footer button order different from Bootstrap
See original GitHub issueI have a general UX question. The order of OK and Cancel buttons dialogs is an interesting topic for UX discussions with no clear answer.
Is there a particular reason for bootstrap-vue deliberately changing the default order of these buttons in the modal component compared to default Bootstrap examples?
Issue Analytics
- State:
- Created 6 years ago
- Reactions:3
- Comments:5 (3 by maintainers)
Top Results From Across the Web
Modal
Use Bootstrap's JavaScript modal plugin to add dialogs to your site for lightboxes, user notifications, or completely custom content.
Read more >Left & right align modal footer buttons in Bootstrap 4
Now that the modal-footer is "display:flex" in Bootstrap 4, it would be easiest to use the auto-margins. Use mr-auto on the left button....
Read more >Bootstrap modal with sticky header, footer, or both, and ...
To add sticky functionality we'll use two separate BEM modifiers: ... This way, we can easily enable or disable each element to make...
Read more >How to change the position of modal close button in ...
Approach: In the above, you can observe a button with class = “close” inside the modal header. This button is used for closing...
Read more ><Modal/> Component - React-Bootstrap
A modal with header, body, and set of actions in the footer. Use <Modal/> in combination with other components to show or hide...
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
@mikestu You can easily just make a modal component in your app that overrides the footer and passes through the rest of the content. Then you don’t need every dev to redefine it.
Unfortunately, this component just ordered the buttons the same way the bootstrap demos have their buttons in the modal markup samples. I know the bootstrap guys had to choose an order for their samples (they chose the Mac order), but some apps have Cancel on the far right (like my app). It probably means we have to either create our own mixin, or devs always define buttons in the footer in the order we want. Even if there was a new option to reverse the order, I don’t know that Vue has a way to set a global option for a component today. If there are other options for my issue, please let me know.