Try to use own buttons and button groups in the modal body.

Please be more specific. What should be done to test this using default core.

@infograf768 I updated the description.

Try to use any native button classes like btn, btn-success, btn-primary, btn-secondary.

I have tested this item ✅ successfully on 61401cf

Needs npm run build:css

I put this in banners/default_batch_footer.php:

<div class="btn-group" role="group" aria-label="Basic example">
<button type="button" class="btn btn-info">Left</button>
<button type="button" class="btn btn-warning">Middle</button>
<button type="button" class="btn btn-danger">Right</button>
</div>

Before:

After:

I have tested this item ✅ successfully on 61401cf

@Denitz
This does not change. Is this what you expect?

@infograf768 @ceford
Please test the buttons and button groups in modal body as well.

My patch keeps the modal footer as it is but allows the original Boostrap buttons and button groups inside modal body.

I tested again with the buttons in a modal body:

Personal opinion: I am not keen on those dark solid colours for Cancel and Process. Outline buttons might be better.

@ceford
How do you get these colors for the Cancel/Process buttons? I only get them on hover.

Just now I applied the pr, issued command npm run build:css and the modal footer buttons appeared in solid colours as illustrated in my previous screens. I also tried it with npm ci - same result. The style is coming from line 2749 of template.css. With the patch removed the styling comes from line 12422 of template.css. I don't think I have made any other changes.

I think the > may be the problem - it selects a child rather than a descendant. Although I am no expert on complex selectors!

@ceford @infograf768 Argh yes! I changed .modal > .modal-footer .btn to .modal .modal-footer .btn

Before the patch, all buttons inside modal are styled:

.modal .btn {...}

After the patch, the existing custom style (I agree that it's awful and useless) is applied to buttons in the modal footer only:

.modal .modal-footer .btn

If any boss can confirm, we can really remove this ugly style because it doesn't allow to have colored buttons in the modal footer.

I have tested this item ✅ successfully on f90dd0b

Latest patch shows coloured buttons in body and white buttons in footer. Good! Screen shot:

I assume the failing MySQL test is a temporary test glitch!

Bah! Belay that last successful test! The Left and Middle buttons in the footer have no hover behaviour. They are btn-info and btn-warning. So we need to check the other bootstrap standard buttons too.

I have not tested this item.

@Denitz are you able to look at the errors reported above

@brianteeman I updated the code, just removed the custom button style from modals.

Buttons are no longer outlined.

Sure, why do we need outlined buttons here? We need to be able to control the buttons ourselves via CSS classes.

1. Thats the design
2. What is stopping you?

The issue is that we can't style modal footer buttons via normal btn-xxx classes, Atum forces same white style for all buttons.

I don't think that it's a idea from developer point of view and I dislike the idea of adding own custom CSS.

From user point of view having all buttons in the same style hardens the usability as well, there is no possibility to distinguish between "positive" and "negative" actions via usual green/primary and red/secondary/light colors.

This PR is fine. However, to keep the design, then change the class to .btn-outline-* for buttons in the modal.

@Quy Do you mean that we should keep the custom style for .btn-outline-* and use this class for all buttons in current modals?