cronapp-framework-js/css/themes/custom/aquamarine/panel-aquamarine.css

Javascript library for CronApp's projects

.panel {
    background: var(--colorNeutral00, #ffffff);
    box-shadow: none;
    border: 0;
    border-radius: var(--borderRadiusMedium, 20px);
}


.panel-group .panel {
    border-radius: var(--borderRadiusMedium, 20px);
}

.panel-group .panel-heading {
    border-radius: calc(var(--borderRadiusMedium, 20px) - 2px);
}

.panel-heading {
    border-top-left-radius: calc(var(--borderRadiusMedium, 20px) - 2px);
    border-top-right-radius: calc(var(--borderRadiusMedium, 20px) - 2px);
}

.panel-footer {
    border-bottom-right-radius: calc(var(--borderRadiusMedium, 20px) - 2px);
    border-bottom-left-radius: calc(var(--borderRadiusMedium, 20px) - 2px);
}

.panel-default>.panel-heading+.panel-collapse>.panel-body {
    border: 0;
}

/* Default */
.panel-default {
    border-color: var(--colorDefault40, #2ca4a8);
}

.panel-default .panel-footer,
.panel-default .panel-heading {
    background: linear-gradient(90deg, var(--colorDefault40, #2ca4a8) 40%, var(--colorDefault30, #81bdc0) 100%);
    color: var(--textColorDefault40, #ffffff);
}

/* Primary */
.panel-primary {
    border-color: var(--colorPrimary40, #2c72a8);
}

.panel-primary .panel-footer,
.panel-primary>.panel-heading {
    background: linear-gradient(90deg, var(--colorPrimary40, #2c72a8) 40%, var(--colorPrimary30, #819fc0) 100%);
    color: var(--textColorPrimary40, #ffffff);
}

/* Success */
.panel-success {
    border-color: var(--colorSuccess40, #38a82c);
}

.panel-success .panel-footer,
.panel-success>.panel-heading {
    background: linear-gradient(90deg, var(--colorSuccess40, #38a82c) 40%, var(--colorSuccess30, #85c081) 100%);
    color: var(--textColorSuccess40, #ffffff);
}

/* Info */
.panel-info {
    border-color: var(--colorCalm40, #11c1f3);
}

.panel-info .panel-footer,
.panel-info>.panel-heading {
    background: linear-gradient(90deg, var(--colorCalm40, #11c1f3) 40%, var(--colorCalm30, #7cd1f6) 100%);
    color: var(--textColorCalm40, #ffffff);
}

/* Warning */
.panel-warning {
    border-color: var(--colorWarning40, #daa31f);
}

.panel-warning .panel-footer,
.panel-warning>.panel-heading {
    background: linear-gradient(90deg, var(--colorWarning40, #daa31f) 40%, var(--colorWarning30, #e3bd7e) 100%);
    color: var(--textColorWarning40, #ffffff);
}

/* Danger */
.panel-danger {
    border-color: var(--colorDanger40, #a82c2c);
}

.panel-danger .panel-footer,
.panel-danger>.panel-heading {
    background: linear-gradient(90deg, var(--colorDanger40, #a82c2c) 40%, var(--colorDanger30, #c08181) 100%);
    color: var(--textColorDanger40, #ffffff);
}

/* Light */
.panel-light {
    border-color: var(--colorLight40, #dddddd);
}

.panel-light .panel-footer,
.panel-light>.panel-heading {
    background: linear-gradient(90deg, var(--colorLight40, #dddddd) 40%, var(--colorLight30, #e5e5e5) 100%);
    color: var(--textColorLight40, #444444);
}

/* Stable */
.panel-stable {
    border-color: var(--colorStable40, #b2b2b2);
}

.panel-stable .panel-footer,
.panel-stable>.panel-heading {
    background: linear-gradient(90deg, var(--colorStable40, #b2b2b2) 40%, var(--colorStable30, #c7c7c7) 100%);
    color: var(--textColorStable40, #444444);
}

/* Royal */
.panel-royal {
    border-color: var(--colorRoyal40, #7e5ee8);
}

.panel-royal .panel-footer,
.panel-royal>.panel-heading {
    background: linear-gradient(90deg, var(--colorRoyal40, #7e5ee8) 40%, var(--colorRoyal30, #a594ee) 100%);
    color: var(--textColorRoyal40, #ffffff);
}

/* Dark */
.panel-dark {
    border-color: var(--colorDark40, #444444);
}

.panel-dark .panel-footer,
.panel-dark>.panel-heading {
    background: linear-gradient(90deg, var(--colorDark40, #444444) 40%, var(--colorDark30, #898989) 100%);
    color: var(--textColorDark40, #ffffff);
}