lixin-web/webapp/css/element-theme/alert.css

vue and bootstrap

@charset "UTF-8";
:root{
    /* Transition
  -------------------------- */
    /* Colors
  -------------------------- */
    /* Link
  -------------------------- */
    /* Border
  -------------------------- */
    /* Box-shadow
  -------------------------- */
    /* Fill
  -------------------------- */
    /* Font
  -------------------------- */
    /* Size
  -------------------------- */
    /* z-index
  -------------------------- */
    /* Disable base
  -------------------------- */
    /* Icon
  -------------------------- */
    /* Checkbox
  -------------------------- */
    /* Radio
  -------------------------- */
    /* Select
  -------------------------- */
    /* Alert
  -------------------------- */
    /* Message Box
  -------------------------- */
    /* Message
  -------------------------- */
    /* Notification
  -------------------------- */
    /* Input
  -------------------------- */
    /* Cascader
  -------------------------- */
    /* Group
  -------------------------- */
    /* Tab
  -------------------------- */
    /* Button
  -------------------------- */
    /* cascader
  -------------------------- */
    /* Switch
 -------------------------- */
    /* Dialog
 -------------------------- */
    /* Table
 -------------------------- */
    /* Pagination
 -------------------------- */
    /* Popover
 -------------------------- */
    /* Tooltip
  -------------------------- */
    /* Tag
  -------------------------- */
    /* Dropdown
  -------------------------- */
    /* Badge
  -------------------------- */
    /* Card
  --------------------------*/
    /* Slider
  --------------------------*/
    /* Steps
  --------------------------*/
    /* Menu
  --------------------------*/
    /* Rate
  --------------------------*/
    /* DatePicker
  --------------------------*/
    /* Loading
  --------------------------*/
    /* Scrollbar
  --------------------------*/
    /* Carousel
  --------------------------*/
    /* Collapse
  --------------------------*/
    /* Transfer
  --------------------------*/
}

.el-alert{
    width: 100%;
    padding: 8px 16px;
    margin: 0;
    box-sizing: border-box;
    border-radius: 4px;
    position: relative;
    background-color: #fff;
    overflow: hidden;
    color: #fff;
    opacity: 1;
    display: table;
    transition: opacity .2s;
}

.el-alert .el-alert__description{
    color: #fff;
    font-size: 12px;
    margin: 5px 0 0 0;
}

.el-alert--success{
    background-color: #78d640;
}

.el-alert--info{
    background-color: #d7a1e9;
}

.el-alert--warning{
    background-color: #64c4c9;
}

.el-alert--error{
    background-color: #fe5307;
}

.el-alert__content{
    display: table-cell;
    padding: 0 8px;
}

.el-alert__icon{
    font-size: 16px;
    width: 16px;
    display: table-cell;
    color: #fff;
    vertical-align: middle;
}

.el-alert__icon.is-big{
    font-size: 28px;
    width: 28px;
}

.el-alert__title{
    font-size: 13px;
    line-height: 18px;
}

.el-alert__title.is-bold{
    font-weight: 700;
}

.el-alert__closebtn{
    font-size: 12px;
    color: #fff;
    opacity: 1;
    top: 12px;
    right: 15px;
    position: absolute;
    cursor: pointer;
}

.el-alert__closebtn.is-customed{
    font-style: normal;
    font-size: 13px;
    top: 9px;
}

.el-alert-fade-enter, .el-alert-fade-leave-active {
    opacity: 0;
}
:root{
    /* Transition
  -------------------------- */
    /* Colors
  -------------------------- */
    /* Link
  -------------------------- */
    /* Border
  -------------------------- */
    /* Box-shadow
  -------------------------- */
    /* Fill
  -------------------------- */
    /* Font
  -------------------------- */
    /* Size
  -------------------------- */
    /* z-index
  -------------------------- */
    /* Disable base
  -------------------------- */
    /* Icon
  -------------------------- */
    /* Checkbox
  -------------------------- */
    /* Radio
  -------------------------- */
    /* Select
  -------------------------- */
    /* Alert
  -------------------------- */
    /* Message Box
  -------------------------- */
    /* Message
  -------------------------- */
    /* Notification
  -------------------------- */
    /* Input
  -------------------------- */
    /* Cascader
  -------------------------- */
    /* Group
  -------------------------- */
    /* Tab
  -------------------------- */
    /* Button
  -------------------------- */
    /* cascader
  -------------------------- */
    /* Switch
 -------------------------- */
    /* Dialog
 -------------------------- */
    /* Table
 -------------------------- */
    /* Pagination
 -------------------------- */
    /* Popover
 -------------------------- */
    /* Tooltip
  -------------------------- */
    /* Tag
  -------------------------- */
    /* Dropdown
  -------------------------- */
    /* Badge
  -------------------------- */
    /* Card
  --------------------------*/
    /* Slider
  --------------------------*/
    /* Steps
  --------------------------*/
    /* Steps
  --------------------------*/
    /* Rate
  --------------------------*/
    /* DatePicker
  --------------------------*/
    /* Loading
  --------------------------*/
    /* Scrollbar
  --------------------------*/
    /* Carousel
  --------------------------*/
    /* Collapse
  --------------------------*/
}