BO responsivity - button text should not overflow

[Hlavtox]

Describe the bug

Longer buttons overflow their container on lower resolutions.

Expected behavior

They should wrap

Steps to reproduce

1. BO > Edit your Profile
2. Change your admin language to Čeština (Czech)
3. Save
4. Go to Orders > Invoices
5. On your browser, enable the Toggle device toolbar
6. Choose iPhone 5s view
7. See error

How to fix it

Remove white-space: nowrap; from buttons.

Screenshots

Additional information

• PrestaShop version: develop & 1.7.8.x

[hibatallahAouadni]

Hello @Hlavtox

Thanks for your issue! I reproduce the issue with develop and 178x. It's a regression! cause I didn't manage to reproduce it with PS1775, see the attached screenshot below:

I think it's caused when we add the padding-right and padding-left to the content-div.
I’ll add this to the debug backlog so that it’s fixed.

If you manage to get the problem fixed, then please contribute the fix back to the project as a Pull Request. Remember that the more people contribute, the better PrestaShop becomes for everyone.

Thank you

[Hlavtox]

@hibatallahAouadni No it's caused by what I said :-) The button should be allowed to wrap. It should always fit no matter the outside container.

[Hlavtox]

@hibatallahAouadni This is standard behavior in Boostrap 4, so we need to override it. It's removed in Boostrap 5, I think they found out the same as we did. 👍

[hibatallahAouadni]

@Hlavtox yep I know 😉 I meant that the issue appears now cause we changed the paddings
Thanks for your PR 🚀