// notice 上方滑入
.uif-notice-enter-active
.uif-notice-leave-active
  transition transform .2s linear, opacity .2s linear
.uif-notice-enter
.uif-notice-leave-to
  opacity 0
  transform translateY(-60px)

.uif-notice-container
  position fixed
  z-index 10000
  text-align center
  left 0
  top 0
  right 0
  height 0
  transition top .2s linear

.uif-notice
  display inline-block
  min-width 248px
  line-height 20px
  border 1px solid transparent
  padding 10px 20px
  overflow hidden
  white-space nowrap
  text-overflow ellipsis
  border-radius 2px
  box-shadow 0 6px 12px rgba(0, 0, 0, 0.16)
  max-width 80vw
  &-icon
    display inline-block
    color inherit
    line-height 20px
    vertical-align middle
    margin-right 6px
  &-title
    font-size 12px
    color #384048
  &-info
    color #2D8CF0
    border-color #2D8CF0
    background-color #F0FAFF
  &-success
    color #19BE6B
    border-color #19BE6B
    background-color #EDFFF3
  &-warning
    color #FF9900
    border-color #FF9900
    background-color #FFF9E6
  &-error
    color #EC3751
    border-color #EC3751
    background-color #FFECEC