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..
- put former remote toggle ctrller toggle method
in new toggleAdvancedSettings in more generic toggle ctrller
- modified acordingly the 2 associated views
- put former test code in more generic ctrller test file
- deleted now useless ctrller + test files
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..
