cronapp-framework-mobile-js/css/themes/custom/theme-general/toggle.css

Javascript library for CronApp's projects

.toggle input:checked+.track {
    border-color: #4cd964;
    background: #4cd964;
}

/* Default */
.toggle.toggle-default input:checked+.track {
    border-color: var(--colorDefault40, #3b448e);
    background: var(--colorDefault40, #3b448e);
}

/* Light */
.toggle.toggle-light input:checked+.track {
    border-color: var(--colorLight50, #dfdfdf);
    background: var(--colorLight50, #dfdfdf);
}

/* Stable */
.toggle.toggle-stable input:checked+.track {
    border-color: var(--colorStable50, #d9d9d9);
    background: var(--colorStable50, #d9d9d9);
}

/* Positive */
.toggle.toggle-positive input:checked+.track {
    border-color: var(--colorPrimary40, #387ef5);
    background: var(--colorPrimary40, #387ef5);
}

/* Calm */
.toggle.toggle-calm input:checked+.track {
    border-color: var(--colorCalm40, #11c1f3);
    background: var(--colorCalm40, #11c1f3);
}

/* Assertive */
.toggle.toggle-assertive input:checked+.track {
    border-color: var(--colorDanger40, #ef473a);
    background: var(--colorDanger40, #ef473a);
}

/* Balanced */
.toggle.toggle-balanced input:checked+.track {
    border-color: var(--colorSuccess40, #33cd5f);
    background: var(--colorSuccess40, #33cd5f);
}

/* Energized */
.toggle.toggle-energized input:checked+.track {
    border-color: var(--colorWarning40, #ffc900);
    background: var(--colorWarning40, #ffc900);
}

/* Royal */
.toggle.toggle-royal input:checked+.track {
    border-color: var(--colorRoyal40, #886aea);
    background: var(--colorRoyal40, #886aea);
}

/* Dark */
.toggle.toggle-dark input:checked+.track {
    border-color: var(--colorDark40, #444444);
    background: var(--colorDark40, #444444);
}

/* white */
.toggle.toggle-white input:checked+.track {
    border-color: var(--white, #ffffff);
    background: var(--white, #ffffff);
}

/* gray */
.toggle.toggle-gray input:checked+.track {
    border-color: var(--gray, #333333);
    background: var(--gray, #333333);
}

/* black */
.toggle.toggle-black input:checked+.track {
    border-color: var(--black, #ffffff);
    background: var(--black, #ffffff);
}

/* blue */
.toggle.toggle-blue input:checked+.track {
    border-color: var(--blue, #333333);
    background: var(--blue, #333333);
}

/* light-blue */
.toggle.toggle-light-blue input:checked+.track {
    border-color: var(--light-blue, #ffffff);
    background: var(--light-blue, #ffffff);
}

/* dark-blue */
.toggle.toggle-dark-blue input:checked+.track {
    border-color: var(--dark-blue, #333333);
    background: var(--dark-blue, #333333);
}

/* purple */
.toggle.toggle-purple input:checked+.track {
    border-color: var(--purple, #ffffff);
    background: var(--purple, #ffffff);
}

/* light-purple */
.toggle.toggle-light-purple input:checked+.track {
    border-color: var(--light-purple, #333333);
    background: var(--light-purple, #333333);
}

/* dark-purple */
.toggle.toggle-dark-purple input:checked+.track {
    border-color: var(--dark-purple, #333333);
    background: var(--dark-purple, #333333);
}

/* red */
.toggle.toggle-red input:checked+.track {
    border-color: var(--red, #ffffff);
    background: var(--red, #ffffff);
}

/* light-red */
.toggle.toggle-light-red input:checked+.track {
    border-color: var(--light-red, #333333);
    background: var(--light-red, #333333);
}

/* dark-red */
.toggle.toggle-dark-red input:checked+.track {
    border-color: var(--dark-red, #333333);
    background: var(--dark-red, #333333);
}

/* orange */
.toggle.toggle-orange input:checked+.track {
    border-color: var(--orange, #ffffff);
    background: var(--orange, #ffffff);
}

/* light-orange */
.toggle.toggle-light-orange input:checked+.track {
    border-color: var(--light-orange, #333333);
    background: var(--light-orange, #333333);
}

/* dark-orange */
.toggle.toggle-dark-orange input:checked+.track {
    border-color: var(--dark-orange, #333333);
    background: var(--dark-orange, #333333);
}

/* yellow */
.toggle.toggle-yellow input:checked+.track {
    border-color: var(--yellow, #ffffff);
    background: var(--yellow, #ffffff);
}

/* light-yellow */
.toggle.toggle-light-yellow input:checked+.track {
    border-color: var(--light-yellow, #333333);
    background: var(--light-yellow, #333333);
}

/* dark-yellow */
.toggle.toggle-dark-yellow input:checked+.track {
    border-color: var(--dark-yellow, #333333);
    background: var(--dark-yellow, #333333);
}

/* green */
.toggle.toggle-green input:checked+.track {
    border-color: var(--green, #ffffff);
    background: var(--green, #ffffff);
}

/* light-green */
.toggle.toggle-light-green input:checked+.track {
    border-color: var(--light-green, #333333);
    background: var(--light-green, #333333);
}

/* dark-green */
.toggle.toggle-dark-green input:checked+.track {
    border-color: var(--dark-green, #333333);
    background: var(--dark-green, #333333);
}