// Overview: when a modal dialog opens, we prevent the body from scrolling by
// applying the following CSS rules to the body. We then give the dialog focus.
//
// Problem #1: Without fixed positioning, when a modal dialog is positioned over
// top of the page, it's still possible to scroll the page behind the dialog in
// iOS, even when the dialog fills the viewport and is 100% opaque.
//
// Problem #2: With fixed positioning, the page jumps back to the top when the
// dialog opens. We can mitigate this problem by returning focus to the element
// that triggered the dialog to open, when the dialog closes. Unfortunately,
// Safari (both mobile and desktop) refuses to scroll the element into view
// on focus, so we have to use JavaScript's window.scrollTo() method.
//
// See: http://stackoverflow.com/questions/9280258/prevent-body-scrolling-but-allow-overlay-scrolling

.u-no-scroll {
  width: 100%;
  height: 100%;
  overflow: hidden;
  position: fixed; // See above comments
}

.u-scrollbar-measure {
  width: 100px;
  height: 100px;
  overflow: scroll;
  position: absolute;
  top: -9999px;
}

.u-no-scroll--not-fixed {
  width: 100%;
  height: 100%;
  overflow: hidden;
}
