Add box shadow by JS

When mode === 'dialog', sticky elements are
stacked so we need to apply the box shadow to the
top (when sticking to the bottom edge) and bottom
(when sticking to the top edge) elements in the
stack.

From what I can see, we need the version of
`nth-child` that supports targeting by selector.
As of this date, support for this is only in
Safari:

https://caniuse.com/#feat=css-nth-child-of

Until we can use this version of `nth-child`, we
need to use JS to apply the styles.

app/assets/stylesheets/components/stick-at-top-when-scrolling.scss

@@ -86,6 +86,11 @@
 
   top: 0;
   margin-top: 0;
+
+}
+
+.js-stick-at-top-when-scrolling.content-fixed__top {
+
   border-bottom: 1px solid $border-colour;
   box-shadow: 0 2px 0 0 rgba($border-colour, 0.2);
 
@@ -102,6 +107,11 @@
 
   top: auto; // cancel `top: 0;` inherited from govuk-template
   bottom: 0;
+
+}
+
+.js-stick-at-bottom-when-scrolling.content-fixed__bottom {
+
   border-top: 1px solid $border-colour;
   box-shadow: 0 -2px 0 0 rgba($border-colour, 0.2);