mahaplatform/reframe

.reframe-flash {
  flex: 1;
  display: flex;
}
.reframe-flash-popup {
  .translate-y-transition(-100%, 0, .25s);
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  padding: 1em;
  &.info {
    .reframe-flash-popup-panel {
      border-color: @info_color;
    }
    i {
      color: @info_color;
    }
  }
  &.warning {
    .reframe-flash-popup-panel {
      border-color: @warning_color;
    }
    i {
      color: @warning_color;
    }
  }
  &.success {
    .reframe-flash-popup-panel {
      border-color: @success_color;
    }
    i {
      color: @success_color;
    }
  }
  &.error {
    .reframe-flash-popup-panel {
      border-color: @error_color;
    }
    i {
      color: @error_color;
    }
  }
}
.reframe-flash-popup-panel {
  display: flex;
  color: @black;
  background-color: @white;
  border-left: 5px solid @black;
  width: 100%;
  max-width: ~"calc(800px - 2em)";
  margin: 0 auto;
  box-shadow: 0 0 10px rgba(0,0,0,0.2);
}
.reframe-flash-popup-icon {
  padding: 1em 0 1em 1em;
  display: flex;
  i {
    display: block;
    margin: auto;
    font-size: 1.8em;
  }
}
.reframe-flash-popup-message {
  padding: 1em;
  flex: 1;
  font-weight: bold;
  display: flex;
  p {
    margin: auto 0;
  }
}