Using a new 'fit' modal size.
On smaller screens, we need to allow the image to shrink. That's a good general rule, but I was hesitant to make it a global rule..
Using units relative to the document, rather than the screen.
I don't think that remaining min-height should be there at all, but reveal-modal is used a lot so I don't know for sure.
It's not usually valid, but can still be entered. I wasn't able to fix the positioning of the :after psuedo element without having a child text node. Maybe it's possible to add an empty child text node, but I didn't think it worth getting down to that level..
Using browser validation. I didn't use model validation because the on_hand pseudo-attribute doesn't support it.
But.. it turned out to not be so simple. Browser validation can't work if the field is hidden, and breaks the javascript. So now I made the javascript smarter, and the end result is more helpful I think.
A StimulusReflex form handler was being ignored, resulting in an error.
Note that this method can support angular forms, the submit buttons just need to be updated to type='submit' (why they are not already boggles me).
- add enableIfPresent method in toggle_control_controller.js to handle enabling on toggle
- add testing in the corresponding spec
- replace in view previous ctrler with intended generic toggle-control
This could have been done with a tiny amount of inline JS, but I went this way in case I needed any special logic for UJS. It turns out we don't.. but it still looks a bit cleaner this way.
Unfortunately, it's not possible to stack two sticky elements that are inside different containers:
https://stackoverflow.com/questions/54689034/pure-css-multiple-stacked-position-sticky
So instead I've moved them under the same container. The .form-actions needs to cover up some of the table border.
I don't like the deep nesting of markup or class naming.. pls suggest if you have better ideas!
Before, the .form-actions was overlaying it, to avoid making the table below jump. But if the .form-actions and #sort are the same height, it won't jump when we swap them.
It does make the table jump in the case of a multi-line .form-actions message, but that only happens after submit anyway.
This is needed for the next commit..
The Vouchers tab pushed the White Label tab further down and it was
hidden by the savebar. The CSS adjustment in this commit makes sure
that users can always see all menu items.
The automatic scrolling by Capybara fails because of the savebar but
scrolling to the bottom works.