Modal with scrollable content

modal--scrollable--content.scss

.modal {
  min-height: 100%;
  position: fixed;
  background-color: $darkslategray-opaque;
  transform: translateY(-150%);
  transition: transform 750ms ease-in-out;
  display: flex;
  justify-content: center;
  align-items: center;
}

.modal__content {
  width: 90%;
  background-color: white;
  border-radius: 2px;
  // Right here is what enables the dialog to be scrollable
  max-height: calc(100vh - 210px);
  overflow-y: auto;
}

.modal--active {
  transform: translateX(0);
}

// jQuery
// $('.modal--open').on('click', function(e) {
//    $('#modal').addClass('modal--active');
//  });

//  $('.modal--close').on('click', function(e) {
//    $('#modal').removeClass('modal--active');
//  });