/* 主要的按钮样式处理 */
/*鼠标点击后移开，恢复本身样式*/
.primary,
.primary:focus:not(.primary:hover) {
    color: white;
    background: #409eff;
}

/*鼠标悬浮，没有按下；鼠标按下后抬起，没有移开*/
/* 更改背景和字體顏色 */
.primary:focus,
.primary:hover {
    color: white;
    background: #409eff;
}

/*鼠标按下，没有抬起*/
/* 更改邊框顏色 */
.primary:active {
    color: white;
    background: #337ecc;
}


/*鼠标点击后移开，恢复本身样式*/
.danger,
.danger:focus:not(.danger:hover) {
    color: white;
    background: #f56c6c;
}

/* 危险的按钮样式 */
/*鼠标悬浮，没有按下；鼠标按下后抬起，没有移开*/
/* 更改背景和字體顏色 */
.danger:focus,
.danger:hover {
    color: white;
    background: #f56c6c;
}

/*鼠标按下，没有抬起*/
/* 更改邊框顏色 */
.danger:active {
    color: white;
    background: #c45656;
}


/*鼠标点击后移开，恢复本身样式*/
.success,
.success:focus:not(.success:hover) {
    color: white;
    background: #67c23a;
}

/* 危险的按钮样式 */
/*鼠标悬浮，没有按下；鼠标按下后抬起，没有移开*/
/* 更改背景和字體顏色 */
.success:focus,
.success:hover {
    color: white;
    background: #b3e19d;
}

/*鼠标按下，没有抬起*/
/* 更改邊框顏色 */
.danger:active {
    color: white;
    background: #529b2e;
}