By disabling line wrap we can consistently predict how it will appear. The longest translation we currently have is 14 characters so this should be fine.
This was broken when upgrading [Foundation](https://github.com/openfoodfoundation/openfoodnetwork/pull/11349). For some reason the button.expand class now sets larger font size and padding, which overrides the button.small class. It's probably a bug but we'll have to work around it.
https://sass-lang.com/documentation/breaking-changes/slash-div
> Sass currently treats / as a division operation in some contexts and a separator in others. This makes it difficult for Sass users to tell what any given / will mean, and makes it hard to work with new CSS features that use / as a separator.
There's a handy migrator:
npm install -g sass-migrator
sass-migrator division **/*.scss
And it cleverly avoids the need for the ugly division method in most cases.
We currently have two mechanisms to display flash messages. The old one
through AngularJS and the new one with StimulusReflex.
The AngularJS directive showed flashes for 10 seconds. The
StimulusReflex controller showed them only for 3 seconds. But any time
based disappearance of error messages is problematic. There's important
information in there and some error messages can be long. It's also
possible that a request takes a while, the user leaves the computer and
comes back later. If we hide the flash automatically then the user may
have no idea what went wrong. They may even think that everything is
fine and their order went through.
I removed the time-based removal of flash messages from the new
StimulusReflex controller to address this problem. But I didn't touch
the AngularJS directive because it will be removed anyway. There may
also be many more messages that could be annoying if they didn't
disappear, for example a simple "login successful".
I personally think that flash messages that are not important to keep,
don't need to be shown in the first place. The best UX makes the success
obvious on the page. And success should be assumed.
- Inherits from ModalComponent
- Has a close button
- Accept `confirm_actions` to trigger reflexes
- Accept `controller` to encapsulate stimulus reflexe controllers
