cronapp-framework-mobile-js/components/css/tabs-color.css

Javascript library for CronApp's projects

/* Default */

.tabs-striped.tabs-icon-default .tab-item {
    color: var(--textColorDefault40, #ffffff);
    opacity: 0.5;
}

.tabs-striped.tabs-icon-default .tab-item.active,
.tabs-striped.tabs-icon-default .tab-item.activated {
    color: var(--textColorDefault40, #ffffff);
    border-color: var(--textColorDefault40, #ffffff);
    opacity: 1;
}


/* Positive */

.tabs-striped.tabs-icon-positive .tab-item {
    color: var(--textColorPrimary40, #ffffff);
    opacity: 0.5;
}

.tabs-striped.tabs-icon-positive .tab-item.active,
.tabs-striped.tabs-icon-positive .tab-item.activated {
    color: var(--textColorPrimary40, #ffffff);
    border-color: var(--textColorPrimary40, #ffffff);
    opacity: 1;
}

/* Assertive */

.tabs-striped.tabs-icon-assertive .tab-item {
    color: var(--textColorDanger40, #ffffff);
    opacity: 0.5;
}

.tabs-striped.tabs-icon-assertive .tab-item.active,
.tabs-striped.tabs-icon-assertive .tab-item.activated {
    color: var(--textColorDanger40, #ffffff);
    border-color: var(--textColorDanger40, #ffffff);
    opacity: 1;
}


/* Energized */

.tabs-striped.tabs-icon-energized .tab-item {
    color: var(--textColorWarning40, #ffffff);
    opacity: 0.5;
}

.tabs-striped.tabs-icon-energized .tab-item.active,
.tabs-striped.tabs-icon-energized .tab-item.activated {
    color: var(--textColorWarning40, #ffffff);
    border-color: var(--textColorWarning40, #ffffff);
    opacity: 1;
}

/* Balanced */

.tabs-striped.tabs-icon-balanced .tab-item {
    color: var(--textColorSuccess40, #ffffff);
    opacity: 0.5;
}

.tabs-striped.tabs-icon-balanced .tab-item.active,
.tabs-striped.tabs-icon-balanced .tab-item.activated {
    color: var(--textColorSuccess40, #ffffff);
    border-color: var(--textColorSuccess40, #ffffff);
    opacity: 1;
}

/* Balanced */

.tabs-striped.tabs-icon-light .tab-item {
    color: var(--textColorLight40, #000000);
    opacity: 0.5;
}

.tabs-striped.tabs-icon-light .tab-item.active,
.tabs-striped.tabs-icon-light .tab-item.activated {
    color: var(--textColorLight40, #000000);
    border-color: var(--textColorLight40, #000000);
    opacity: 1;
}


/* Stable */

.tabs-striped.tabs-icon-stable .tab-item {
    color: var(--textColorStable40, #444444);
    opacity: 0.5;
}

.tabs-striped.tabs-icon-stable .tab-item.active,
.tabs-striped.tabs-icon-stable .tab-item.activated {
    color: var(--textColorStable40, #444444);
    border-color: var(--textColorStable40, #444444);
    opacity: 1;
}

/* Calm */

.tabs-striped.tabs-icon-calm .tab-item {
    color: var(--textColorCalm40, #ffffff);
    opacity: 0.5;
}

.tabs-striped.tabs-icon-calm .tab-item.active,
.tabs-striped.tabs-icon-calm .tab-item.activated {
    color: var(--textColorCalm40, #ffffff);
    border-color: var(--textColorCalm40, #ffffff);
    opacity: 1;
}

/* Royal */

.tabs-striped.tabs-icon-royal .tab-item {
    color: var(--textColorRoyal40, #ffffff);
    opacity: 0.5;
}

.tabs-striped.tabs-icon-royal .tab-item.active,
.tabs-striped.tabs-icon-royal .tab-item.activated {
    color: var(--textColorRoyal40, #ffffff);
    border-color: var(--textColorRoyal40, #ffffff);
    opacity: 1;
}

/* Dark */

.tabs-striped.tabs-icon-dark .tab-item {
    color: var(--textColorDark40, #ffffff);
    opacity: 0.5;
}

.tabs-striped.tabs-icon-dark .tab-item.active,
.tabs-striped.tabs-icon-dark .tab-item.activated {
    color: var(--textColorDark40, #ffffff);
    border-color: var(--textColorDark40, #ffffff);
    opacity: 1;
}


/* white */

.tabs-striped.tabs-icon-white .tab-item {
    color: var(--colorNeutral00, #FFFFFF);
    opacity: 0.5;
}

.tabs-striped.tabs-icon-white .tab-item.active,
.tabs-striped.tabs-icon-white .tab-item.activated {
    color: var(--colorNeutral00, #FFFFFF);
    border-color: var(--colorNeutral00, #FFFFFF);
    opacity: 1;
}

/* gray */

.tabs-striped.tabs-icon-gray .tab-item {
    color: var(--gray, #333333);
    opacity: 0.5;
}

.tabs-striped.tabs-icon-gray .tab-item.active,
.tabs-striped.tabs-icon-gray .tab-item.activated {
    color: var(--gray, #333333);
    border-color: var(--gray, #333333);
    opacity: 1;
}

/* black */

.tabs-striped.tabs-icon-black .tab-item {
    color: var(--colorNeutral220, #000000);
    opacity: 0.5;
}

.tabs-striped.tabs-icon-black .tab-item.active,
.tabs-striped.tabs-icon-black .tab-item.activated {
    color: var(--colorNeutral220, #000000);
    border-color: var(--colorNeutral220, #000000);
    opacity: 1;
}

/* blue */

.tabs-striped.tabs-icon-blue .tab-item {
    color: var(--blue, #0247FE);
    opacity: 0.5;
}

.tabs-striped.tabs-icon-blue .tab-item.active,
.tabs-striped.tabs-icon-blue .tab-item.activated {
    color: var(--blue, #0247FE);
    border-color: var(--blue, #0247FE);
    opacity: 1;
}

.tabs-striped.tabs-icon-light-blue .tab-item {
    color: var(--light-blue, #85A5FF);
    opacity: 0.5;
}

.tabs-striped.tabs-icon-light-blue .tab-item.active,
.tabs-striped.tabs-icon-light-blue .tab-item.activated {
    color: var(--light-blue, #85A5FF);
    border-color: var(--light-blue, #85A5FF);
    opacity: 1;
}

.tabs-striped.tabs-icon-dark-blue .tab-item {
    color: var(--dark-blue, #00217A);
    opacity: 0.5;
}

.tabs-striped.tabs-icon-dark-blue .tab-item.active,
.tabs-striped.tabs-icon-dark-blue .tab-item.activated {
    color: var(--dark-blue, #00217A);
    border-color: var(--dark-blue, #00217A);
    opacity: 1;
}

/* purple */

.tabs-striped.tabs-icon-purple .tab-item {
    color: var(--purple, #3D01A4);
    opacity: 0.5;
}

.tabs-striped.tabs-icon-purple .tab-item.active,
.tabs-striped.tabs-icon-purple .tab-item.activated {
    color: var(--purple, #3D01A4);
    border-color: var(--purple, #3D01A4);
    opacity: 1;
}

.tabs-striped.tabs-icon-light-purple .tab-item {
    color: var(--light-purple, #B285FF);
    opacity: 0.5;
}

.tabs-striped.tabs-icon-light-purple .tab-item.active,
.tabs-striped.tabs-icon-light-purple .tab-item.activated {
    color: var(--light-purple, #B285FF);
    border-color: var(--light-purple, #B285FF);
    opacity: 1;
}

.tabs-striped.tabs-icon-dark-purple .tab-item {
    color: var(--dark-purple, #2D007A);
    opacity: 0.5;
}

.tabs-striped.tabs-icon-dark-purple .tab-item.active,
.tabs-striped.tabs-icon-dark-purple .tab-item.activated {
    color: var(--dark-purple, #2D007A);
    border-color: var(--dark-purple, #2D007A);
    opacity: 1;
}

/* red */

.tabs-striped.tabs-icon-red .tab-item {
    color: var(--red, #FE2712);
    opacity: 0.5;
}

.tabs-striped.tabs-icon-red .tab-item.active,
.tabs-striped.tabs-icon-red .tab-item.activated {
    color: var(--red, #FE2712);
    border-color: var(--red, #FE2712);
    opacity: 1;
}

.tabs-striped.tabs-icon-light-red .tab-item {
    color: var(--light-red, #FE8F84);
    opacity: 0.5;
}

.tabs-striped.tabs-icon-light-red .tab-item.active,
.tabs-striped.tabs-icon-light-red .tab-item.activated {
    color: var(--light-red, #FE8F84);
    border-color: var(--light-red, #FE8F84);
    opacity: 1;
}

.tabs-striped.tabs-icon-dark-red .tab-item {
    color: var(--dark-red, #7A0B00);
    opacity: 0.5;
}

.tabs-striped.tabs-icon-dark-red .tab-item.active,
.tabs-striped.tabs-icon-dark-red .tab-item.activated {
    color: var(--dark-red, #7A0B00);
    border-color: var(--dark-red, #7A0B00);
    opacity: 1;
}

/* orange */

.tabs-striped.tabs-icon-orange .tab-item {
    color: var(--orange, #FB9B02);
    opacity: 0.5;
}

.tabs-striped.tabs-icon-orange .tab-item.active,
.tabs-striped.tabs-icon-orange .tab-item.activated {
    color: var(--orange, #FB9B02);
    border-color: var(--orange, #FB9B02);
    opacity: 1;
}

.tabs-striped.tabs-icon-light-orange .tab-item {
    color: var(--light-orange, #FFD085);
    opacity: 0.5;
}

.tabs-striped.tabs-icon-light-orange .tab-item.active,
.tabs-striped.tabs-icon-light-orange .tab-item.activated {
    color: var(--light-orange, #FFD085);
    border-color: var(--light-orange, #FFD085);
    opacity: 1;
}

.tabs-striped.tabs-icon-dark-orange .tab-item {
    color: var(--dark-orange, #7A4B00);
    opacity: 0.5;
}

.tabs-striped.tabs-icon-dark-orange .tab-item.active,
.tabs-striped.tabs-icon-dark-orange .tab-item.activated {
    color: var(--dark-orange, #7A4B00);
    border-color: var(--dark-orange, #7A4B00);
    opacity: 1;
}

/* yellow */

.tabs-striped.tabs-icon-yellow .tab-item {
    color: var(--yellow, #FFFF33);
    opacity: 0.5;
}

.tabs-striped.tabs-icon-yellow .tab-item.active,
.tabs-striped.tabs-icon-yellow .tab-item.activated {
    color: var(--yellow, #FFFF33);
    border-color: var(--yellow, #FFFF33);
    opacity: 1;
}

.tabs-striped.tabs-icon-light-yellow .tab-item {
    color: var(--light-yellow, #FFFF85);
    opacity: 0.5;
}

.tabs-striped.tabs-icon-light-yellow .tab-item.active,
.tabs-striped.tabs-icon-light-yellow .tab-item.activated {
    color: var(--light-yellow, #FFFF85);
    border-color: var(--light-yellow, #FFFF85);
    opacity: 1;
}

.tabs-striped.tabs-icon-dark-yellow .tab-item {
    color: var(--dark-yellow, #7A7A00);
    opacity: 0.5;
}

.tabs-striped.tabs-icon-dark-yellow .tab-item.active,
.tabs-striped.tabs-icon-dark-yellow .tab-item.activated {
    color: var(--dark-yellow, #7A7A00);
    border-color: var(--dark-yellow, #7A7A00);
    opacity: 1;
}

/* Green */

.tabs-striped.tabs-icon-green .tab-item {
    color: var(--green, #66B032);
    opacity: 0.5;
}

.tabs-striped.tabs-icon-green .tab-item.active,
.tabs-striped.tabs-icon-green .tab-item.activated {
    color: var(--green, #66B032);
    border-color: var(--green, #66B032);
    opacity: 1;
}

.tabs-striped.tabs-icon-light-green .tab-item {
    color: var(--light-green, #B7FF85);
    opacity: 0.5;
}

.tabs-striped.tabs-icon-light-green .tab-item.active,
.tabs-striped.tabs-icon-light-green .tab-item.activated {
    color: var(--light-green, #B7FF85);
    border-color: var(--light-green, #B7FF85);
    opacity: 1;
}

.tabs-striped.tabs-icon-dark-green .tab-item {
    color: var(--dark-green, #337A00);
    opacity: 0.5;
}

.tabs-striped.tabs-icon-dark-green .tab-item.active,
.tabs-striped.tabs-icon-dark-green .tab-item.activated {
    color: var(--dark-green, #337A00);
    border-color: var(--dark-green, #337A00);
    opacity: 1;
}