ijijin-view/vue/less/Toast.less

vuejs UI components, from ijijin.

@import './colors.less';

/*
 * v-toast
 */
.vu-toast {
    position: fixed;
    z-index: 29;
    padding: 5px 7px;
    left: 50%;
    max-width: 80%;
    min-width: 30%;
    min-height: 18px;
    font-size: 12px;
    line-height: 1.5;
    text-align: center;
    word-break: break-all;
    border-radius: 8px;
    -webkit-transform: translate(-50%, 0);
    transform: translate(-50%, 0);

    &.z-top {
        top: 10%;
    }
    &.z-middle {
        top: 35%;
        font-size: 14px;
        line-height: 20px;
    }
    &.z-bottom{
        bottom: 15%;
    }
}

.v-toast-enter-active, .v-fade-toast-leave-active {
   -webkit-transition: opacity .5s;
   transition: opacity .5s;
}
.v-toast-enter, .v-toast-leave-to {
  opacity: 0;
  z-index: -1;
}