We can't always rely on other parts of the code been loaded first. We
need to declare dependencies so that they are always present.
I just ran into this problem in my dev environment.
If Rails config.assets.compile is false and config.assets.digest is
true, which is the case for staging and production, image_tag fails when
the image file is not found.
We do not need sprockets to ensure presence of the image file for these
tags, because the correct SRC values are assigned through the JS.
Inserting HTML should be sufficient.
spree_i18n translates the "store" key in different ways, sometimes like
"shop" and sometimes like "save". This could be because of a clash in
usage between Spree add-ons.
To be more specific, the "Store" link in the admin section now uses the
"admin.header.store" translation key.
Change modals for large screens from 10% position from top and 80% max
height, to 5% position from top and 90% max height.
This is to accommodate the taller cookies policy modal.
It seems that it is not easy to apply a custom position and height to a
specific modal only. This doesn't seem to be supported by the modal
library currently being used.
Before the recent changes, most modals were rendering at 10px top
position (not the originally planned 10%), so changing this to 5%
doesn't seem to be much of a compromise.
Occasionally, the page scrolls up while the modal is being opened. This
was causing the final position of the modal to be at the wrong location
relative to the viewport.
This was happening because of a race condition between the animation
that slides the modal from above the viewport to the middle, and focus()
which the modal does:
https://github.com/yalabot/angular-foundation/blob/0.8.0/src/modal/modal.js#L109
The final vertical position of the modal is at 10%, so the animation
which translates the modal -25% vertically was starting -15% above the
viewport. The focus() was then causing vertical scroll.
This lowers the starting point of the animation, so there will no longer
be scrolling.
Additionally, the animation would only happen on large screens. The CSS
property "top" is 0 for smaller screens.
When there is enough content in the modal, the height of the modal plus
its top margin could exceed the height of the viewport.
Considering a top position of 10%, a max height of 80% renders a tall
modal vertically centered, with 10% remaining space at the bottom.