mahaplatform/reframe

.reframe-prompt {
  flex: 1;
  display: flex;
}
.reframe-prompt-overlay {
  .opacity-transition(0, 0.5, .25s);
  .opacity(0.5);
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: rgb(0, 0, 0);
}
.reframe-prompt-options {
  position: absolute;
  .border-radius(5px);
  background-color: #FFFFFF;
  @media only screen and (max-width: 768px) {
    .translate-y-transition(100%, 0, .25s);
    bottom: 0;
    left: 0;
    right: 0;
    margin: 10px;
  }
  @media only screen and (min-width: 769px) {
    .opacity-transition(0, 1, .25s);
    width: 320px;
    top: 50%;
    left: 50%;
    .translateXY(-50%, -50%);
  }
  .reframe-prompt-title {
    .border-radius(5px 5px 0 0);
    border-bottom: 1px solid fadeout(@black, 90);
    display: block;
    padding: 0.8em;
    background-color: fadeout(@black, 92);
    color: fadeout(@black, 50);
    text-align: center;
  }
  .reframe-prompt-message {
    display: block;
    padding: 0.8em;
    text-align: center;
    border-bottom: 1px solid fadeout(@black, 90);
  }
  .reframe-prompt-item,
  .reframe-prompt-cancel {
    .hover(background-color, fadeout(@black, 98));
    display: block;
    padding: 0.8em;
    text-align: center;
    color: #1e70bf;
    cursor: pointer;
    border-bottom: 1px solid fadeout(@black, 90);
    &:last-child {
      border-bottom: none;
    }
  }
  .reframe-prompt-option {
    border-bottom: 1px solid #CCC;
  }
}