maycur-business/lib/ErrorBar/style/ErrorBar.less

maycur business react components of web

@import '../../style/variables.less';

.error-bar {
    display: flex;
    position: relative;
    border-radius: 0 0 0 3px;
    font-size: 12px;
    padding: 5px 16px;
    line-height: 16px;
    background-color: #fffcd7;
    color: #5a5715;
    align-items: center;

    .icon {
        display: inline-block;
        margin-right: 5px;
        color: @icon-fee-yellow;
    }

    &.danger {
        background-color: #fff4f4;
        color: #91200e;

        .icon {
            color: #f53214;
        }
    }

    &.info {
        background-color: #f0faff;
        color: #3296FA;

        .icon {
            color: #3296FA;
        }
    }

    &.success {
        background-color: #E0F5DC;

        .icon {
            color: #00B600
        }
    }
}