cronapp-framework-js/css/themes/custom/cyborg/button-cyborg.css

Javascript library for CronApp's projects

/* Default */
.k-button, .btn, .k-button.k-default, .btn.btn-default {
    background: var(--colorDefault40, #424242);
    border-color: transparent;
    color: var(--textColorDefault40, #ffffff);
}

.k-button.k-default.active,
.k-button.k-default:active,
.btn.btn-default.active,
.btn.btn-default:active {
    background: var(--colorDefault30, #909090);
    color: var(--textColorDefault40, #ffffff);
}

/* Primary */
.btn.btn-primary {
    background: var( --colorPrimary40, #2a9fd6);
    border-color: transparent;
    color: var(--textColorPrimary40, #ffffff);
}

.btn.btn-primary.active,
.btn.btn-primary:active,
.k-button.k-primary.active,
.k-button.k-primary:active {
    background: var(--colorPrimary30, #81bae0);
    color: var(--textColorPrimary40, #ffffff);
}

/* Success */
.btn.btn-success {
    background: var(--colorSuccess40, #77b300);
    border-color: transparent;
    color: var(--textColorSuccess40, #ffffff);
}

.btn.btn-success.active,
.btn.btn-success:active,
.k-button.k-success.active,
.k-button.k-success:active {
    background: var(--colorSuccess30, #a1c77b);
    color: var(--textColorSuccess40, #ffffff);
}

/* Warning */
.btn.btn-warning {
    background: var(--colorWarning40, #ff8800);
    border-color: transparent;
    color: var(--textColorWarning40, #ffffff);
}

.btn.btn-warning.active,
.btn.btn-warning:active,
.k-button.k-warning.active,
.k-button.k-warning:active {
    background: var(--colorWarning30, #ffab7b);
    color: var(--textColorWarning40, #ffffff);
}

/* Danger */
.btn.btn-danger {
    background: var(--colorDanger40, #cc0000);
    border-color: transparent;
    color: var(--textColorDanger40, #ffffff);
}

.btn.btn-danger.active,
.btn.btn-danger:active,
.k-button.k-danger.active,
.k-button.k-danger:active {
    background: var(--colorDanger30, #d97b7b);
    color: var(--textColorDanger40, #ffffff);
}

/* Info */
.btn.btn-info {
    background: var(--colorCalm40, #9933cc);
    border-color: transparent;
    color: var(--textColorCalm40, #ffffff);
}

.btn.btn-info.active,
.btn.btn-info:active,
.k-button.k-info.active,
.k-button.k-info:active {
    background: var(--colorCalm60, #7a29a3);
    color: var(--textColor40, #383838);
    border: 1px solid var(--colorCalm70, #732699);
}

.k-button:focus:active {
    box-shadow: unset;
}

/* Light */
.btn.btn-light {
    background: var(--colorLight40, #222222);
    border-color: transparent;
    color: var(--textColorLight40, #000000);
}

.btn.btn-light.active,
.btn.btn-light:active,
.k-button.k-light.active,
.k-button.k-light:active {
    background: var(--colorLight40, #222222);
    color: var(--textColor40, #383838);
}

/* stable */
.k-button.k-stable, .btn.btn-stable {
    background: var(--colorStable40, #f8f8f8);
    border-color: transparent;
    color: var(--textColorStable40, #444444);
}

.btn.btn-stable.active,
.btn.btn-stable:active,
.k-button.k-stable.active,
.k-button.k-stable:active {
    background: var(--colorStable30, #fafafa);
    color: var(--textColorStable40, #444444);
}

/* royal */
 .btn.btn-royal {
    background: var(--colorRoyal40, #6c2093);
    border-color: transparent;
    color: var(--textColorRoyal40, #ffffff);
}

.btn.btn-royal.active,
.btn.btn-royal:active,
.k-button.k-royal.active,
.k-button.k-royal:active {
    background: var(--colorRoyal30, #b683d9);
    color: var(--textColorRoyal40, #ffffff);
}

/* dark */
.btn.btn-dark {
    background: var(--colorDark40, #adafae);
    border-color: transparent;
    color: var(--textColorDark40, #ffffff);
}

.btn.btn-dark.active,
.btn.btn-dark:active,
.k-button.k-dark.active,
.k-button.k-dark:active {
    background: var(--colorDark30, #c3c5c4);
    color: var(--textColorDark40, #000000);
}