On gists

Starting style

CSS CSS trick

style.css Raw #

/* https://jsbin.com/fayirefaqu/2/edit?html,css,js,output */


.modal {
  /* Hidden state */
  display: none;
  opacity: 1;
}

.modal.open {
  display: block;
  /* Regular transition works now */
  transition: opacity 300ms;
  opacity: 1;
}

/* Define starting styles when modal becomes displayed */
@starting-style {
  .modal.open {
    opacity: 0;
  }
}