fleet/frontend/components/FlashMessage/_styles.scss

.wrapper > div.flash-message {
  height: 50px;
  min-height: 50px;
  max-height: 50px;
}

.flash-message {
  @include display(flex);
  @include align-items(center);
  @include justify-content(space-between);
  @include position(fixed, 0 0 null 240px);
  color: $white;
  padding: 0 $pad-half;
  z-index: 2;

  @include breakpoint(tablet) {
    left: 55px;
  }

  &--full-width {
    left: 0;
  }

  &--success {
    background-color: $success;
  }

  &--error {
    background-color: $alert;
  }

  &__action {
    @include display(flex);
    @include justify-content(space-between);
    width: 96px;
  }

  &__remove {
    @include size(30px);
    border-radius: 50%;
    color: $white;
    cursor: pointer;
    text-align: center;

    &--success {
      background-color: $success-light;
    }

    &--error {
      background-color: $alert-light;
    }
  }

  &__undo {
    color: $white;
    cursor: pointer;
  }
}