An error occurred while loading the file. Please try again.
-
sri-pusuluri authoredd23a9782
@use "~@project-sunbird/sb-styles/assets/mixins/mixins" as *;
html[data-mode='darkmode'] {
// --primary-theme: var(--primary-theme);
// --primary-theme-hsl: 49.3, 100%;
--primary-color: hsl(var(--primary-theme-hsl), 58.24%);
--primary-0: hsl(var(--primary-theme-hsl), 88%); // #fffcee;
--primary-100: hsl(var(--primary-theme-hsl), 82%); // #fff8db; // default button bg
--primary-200: hsl(var(--primary-theme-hsl), 76%); // #fffd2a; // divider
--primary-250: hsl(var(--primary-theme-hsl), 70%); // #f1f1c7;
--primary-300: hsl(var(--primary-theme-hsl), 64%); // #ffeb2a; // outline, focus fields
--primary-400: var(--primary-color); // button bg, heading, table titles, links, toggles
--primary-600: hsl(var(--primary-theme-hsl), 52%); // #ffc72a; // on press
--primary-800: hsl(var(--primary-theme-hsl), 46%); // #ffb62a; // hover
--secondary-200: var(--primary-color);
--secondary-color: var(--primary-color);
--gray-800: var(--white);
--color-000: #000000;
--color-111: #111111;
--color-222: #222222;
--color-333: #333333;
--color-444: #444444;
--color-5c5c5c: #5c5c5c;
--sb-search-btn-bg: var(--color-333);
--sb-search-btn-text: var(--primary-color);
--sbt-primary-bg: var(--primary-theme);
--sbt-border-chapter: var(--primary-100);
--sbt-body-bg: var(--color-000);
--sbt-body-bg2: var(--color-333) !important;
--sbt-header-bg: var(--color-333);
--sbt-filter-bar-bg: var(--color-333);
--sb-container-bg: var(--black);
--sbt-footer-bg: var(--color-333);
--sbt-box-shadow-black: rgba(var(--rc-rgba-black), 0.2);
--sbt-theme-purple-selectbox: var(--white);
--sbt-theme-green-selectbox: var(--white);
--sbt-theme-blue-selectbox: var(--white);
--sbt-theme-light-blue-selectbox: var(--white);
--sbt-theme-purple-selectbox-lbg: var(--color-222);
--sbt-theme-green-selectbox-lbg: var(--color-222);
--sbt-theme-blue-selectbox-lbg: var(--color-222);
--sbt-theme-light-blue-selectbox-lbg: var(--color-222);
--sbt-pill-hs: 212, 100%;
--sbt-pill-bg: var(--color-5c5c5c);
--sbt-pill-bg-active: var(--primary-color); // #0076FE
--sbt-pill-text: var(--white);
--sbt-pill-text-hover: var(--color-222);
--sbt-compt-bg: var(--color-333);
--sbfield-label-text: var(--gray-100);
--sb-linkmenu-icon-bg-hover: var(--black);
--sbt-pill-hs: 212, 100%;
--sb-pill-bg: var(--color-222);
// new styles
--sbt-badge-bg: var(--color-222);
--sbt-sidemenu-overlay-bg: 34, 34, 34;
--sbt-sidemenu-bg: var(--color-333);
--sidebar-profil-header-bg: var(--color-222);
--sb-linkmenu-bg: var(--color-333);
--sb-linkmenu-text: var(--white);
--sb-linkmenu-active-text: var(--primary-color);
--sb-linkmenu-text-hover: var(--color-222);
--sb-btn-default-color: var(--black);
//header
--sb-menu-bg: var(--black);
--sb-menu-item: var(--gray-0);
--sb-header-bg: var(--color-333);
--sb-notification-bg: var(--gray);
--bell-icon: var(--white);
--sb-header-qrcode-btn-bg: var(--color-333);
7172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140
--sb-header-qrcode-btn-border: var(--primary-300);
--sb-search-input-bg: var(--color-222);
--sb-search-input-text: var(--white);
--sb-qrcode-divider: var(--primary-0);
--sb-language-dropdown-bg: var(--black);
--sb-language-dropdown-item: var(--white);
--sb-language-dropdown-item-active: var(--gray);
--sb-search-auto-select: var(--black);
--sb-footer-bg: var(--gray);
--sbt-green-bg: var(--color-222);
--sbt-class-bar-label-text: var(--gray-100);
--sbt-theme-green-selectbox: var(--white);
--sb-search-input-bg: var(--color-222);
--sb-sidebar-menu-bg-active: var(--sbt-filter-bar-bg);
--sb-sidebar-menu-text: var(--primary-600);
--sb-graph-section-bg: var(--sbt-body-bg2);
//cc
--cc-accordion-panel-br: var(--primary-300);
--cc-accordion-panel-bg: var(--color-222);
--cc-accordion-panel-header-bg: var(--color-333);
--cc-accordion-panel-header-br: var(--primary-300);
--cc-accordion-panel-header-title: var(--primary-400);
--cc-progress-circle-stroke: var(--secondary-200);
--cc-sbcard-meta1: var(--rc-979797);
--cc-sbcard-metaC-data: var(--rc-FAFAFA);
--cc-sbcard-course-curi-title: var(--white);
--cc-sbcard-img-label: #284C3F;
--cc-sbcard-img-label-bg: #B3EBD7;
--cc-sbcard-img-badge-bg: var(--black);
--cc-sbcard-img-badge-text: var(--white);
--cc-sblabel-badge-br: var(--secondary-color);
--cc-sblabel-badge-text: var(--secondary-color);
--cc-pill-border: var(--secondary-color);
--cc-pill-text: var(--secondary-color);
--cc-pill-bg-hover: var(--secondary-color);
--cc-pill-text-hover: var(--black);
--cc-grade-pill-container-bg: var(--color-333);
--cc-grade-pill-text: var(--white);
--cc-grade-pill-bg-hover: var(--primary-color);
--cc-grade-pill-text-hover: var(--color-222);
--cc-grade-pill-svg-fill: var(--color-222);
--cc-sbcard-data1-2-text: var(--primary-color);
--cc-sbcard-bg: var(--color-333);
--cc-sbcard-img-container-bg: var(--gray-100);
--cc-sbcard-title: var(--white);
--cc-sbcard-meta-text: var(--gray-800);
--cc-sbcard-dot-divider: var(--gray-200);
--cc-sbcard-moreinfo-bg: none;
--cc-sbcard-moreinfo-bordertop: #cacbce;
--cc-sbcard-meta2-text: var(--gray-800);
--cc-sbcard-org-text: var(--gray-200);
--cc-sbcard-type-text: var(--white);
--cc-sbcard-rv-img-container-bg: var(--gray-100);
--cc-sbcard-selected-border: var(--primary-color);
--cc-sbcard-img-br: var(--color-222);
--cc-sbcard-offline-bg: var(--tertiary-color);
--cc-sbcard-offline-img-text: var(--white);
--cc-sbcard-card__progressbar-bg: var(--gray-100);
--cc-sbcard-card__progressbar-span-bg: var(--secondary-200);
--cc-sbcard-type-br: var(--black);
--cc-sbcard-hover-text: var(--white);
--cc-sbcard-hover-bg: var(--primary-color);
--cc-sbcard-org-text: var(--balck);
--cc-sbcard-data1-bg: var(--color-444);
--cc-sbcard-data1-bg-active: var(--primary-300);
--cc-sbcard-data2-bg: var(--color-444);
--cc-sbcard-data2-bg-active: var(--primary-300);
--cc-sbcard-data0-bg: var(--color-444);
--cc-sbcard-data0-bg-active: var(--primary-300);
141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210
--cc-sbcard-type-bg: var(--black);
--cc-sbcard-type-text: var(--white);
--cc-listView-compt-title: var(--white);
--cc-listView-compt-itemText: var(--white);
--cc-carousel-title: var(--white);
--cc-faq-yesbtn-bg: var(--primary-color) !important;
--cc-faq-yesbtn-text: var(--color-000) !important;
--cc-faq-nobtn-bg: var(--color-222);
--cc-faq-nobtn-text: var(--white);
// cc pills box
--cc-pills-grid-item: var(--color-222) !important;
--cc-pills-grid-item-hover: #f2f2f2;
--cc-pills-grid-item-img-bg: #f2f2f2;
--cc-pills-grid-icon-head-img-bg: var(--white);
--cc-viewbtn-border: #94CCF5;
--cc-viewbtn-text: #0076FE;
--cc-viewbtn-hover: var(--white);
//member card
--cc-members-list-item-selected: var(--black);
--cc-members-list-item-selected-border: var(--primary-color);
--cc-members-list-item-menu-text: var(--gray-200);
--cc-members-list-item-status-text: var(--secondary-200);
--cc-members-list-item-status-br: var(--secondary-200);
--cc-members-list-item-status-bg: var(--primary-color);
// notification
--cc-notification-list-bg: var(--color-222);
--cc-notification-list-br: var(--color-222);
--cc-notification-status-bg: var(--white);
--cc-notification-date-text: var(--white);
--cc-notification-logo-bg: var(--gray-0);
--cc-notification-title-text: var(--gray-400);
--cc-notification-title-active: var(--primary-color);
--cc-notification-subtitle-text: var(--white);
// toc
--cc-toc-card-item-bg: var(--color-333);
--cc-toc-card-item-hover: var(--primary-color);
--cc-toc-card-item-br: var(--color-222);
--cc-toc-card-item-bs: var(--rc-rgba-primary);
--cc-toc-card-item-img-bg: var(--rc-dddddd);
--cc-toc-card-item-title: var(--white);
--cc-toc-card-item-title-hover: var(--color-333);
--cc-toc-card-item-score-text: #3F19C3;
//toc item
--cc-chapter-br: var(--gray-100);
--cc-chapter-bg: var(--color-222);
--cc-chapter-title: var(--gray-800);
--cc-chapter-item-bg: varvar(--white);
--cc-chapter-item-bs: var(--rc-rgba-primary);
--cc-chapter-item-br: var(--rc-rgba-primary);
--cc-chapter-item-title-text: var(--primary-400);
--cc-chapter-item-open-br: #e0e0e0;
--cc-chapter-item-open-title-text: var(--primary-400);
--cc-chapter-item-topic-title-text: var(--primary-400);
--cc-chapter-item-topic-title-text-active: var(--primary-100);
--cc-chapter-item-topic-title-text-hover: var(--gray-0);
//toc curriculum
--cc-curriculum-br-bg: var(--white);
--cc-curriculum-bg: var(--white);
--cc-curriculum-br: var(--primary-200);
--cc-curriculum-active-bs: var(--rc-009D53);
--cc-curriculum-title-text: #3A3A3A;
//faq
--cc-faq-yesbtn-text: var(--secondary-color);
211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280
--cc-faq-helpheader-text: var(--white);
--cc-faq-helpheader-bg: var(--primary-color);
--cc-faq-panel-title-text: var(--primary-color);
--cc-faq-info-msg-bg: var(--primary-0);
--cc-faq-panelheader-bg: var(--white);
--cc-faq-panel-body-bg: var(--color-222);
--cc-faq-panel-interact-bg: var(--color-222);
--cc-faq-yesbtn-bg: inherit;
--cc-faq-yesbtn-text: var(--color-000);
//layout
--cc-lb-card-hlist-title: var(--black);
--cc-lb-card-grid-title: var(--white);
--cc-badge-bg: var(--color-222);
--cc-badge-text: var(--white);
--cc-lb-card-stack-title: var(--primary-color);
--cc-lb-card-stack-btn-bg: var(--primary-100);
--cc-lb-card-stack-btn-text: var(--primary-color);
--cc-listView-compt-title: var(--white);
--cc-listView-compt-itemText: var(--white);
--cc-carousel-title: var(--white);
--cc-sbcard-data2-bg: var(--color-444);
--cc-sbcard-data2-bg-active: var(--primary-300);
//Joy theme header
--sbt-header-bg: var(--color-333);
--sbt-page-header-bg: var(--sbt-header-bg);
--sbt-theme-green-selectbox: var(--gray-200);
--sbt-language-dropdown-icon: var(--primary-color);
--sbt-language-dropdown-bg: var(--black);
--sbt-language-dropdown-item-hover-bg: var(--color-333);
--sbt-language-dropdown-item-hover-text: var(--primary-color);
--sbt-language-selectbox: var(--primary-color);
--sbt-filter-bar-bg: var(--color-333);
--sb-notification-bg: var(--black);
--sb-footer-bg: var(--gray);
--sbt-footer-info-links: var(--white);
--sbt-footer-info-links-hover: var(--primary-color);
--sbt-language-dropdown-item: var(--white);
--sbt-filter-switcher-bg: var(--primary-color);
--sbfaq-compt-bg: var(--color-222);
//Modal
--sb-modal-header-text: var(--black);
--sb-modal-content-bg: var(--sbt-compt-bg);
--sb-modal-actions-bg: var(--sbt-compt-bg);
//landing page
--sb-landing-page-bg: var(--black);
--sb-landing-page-segments: var(--color-333);
--sb-landing-page-cards: var(--black);
--sb-landing-page-cards-desc: var(--white);
--sb-landing-page-btn: var(--sb-landing-page-segments);
//profile page
--sb-profile-certificate-bg: var(--color-333);
--sb-course-progress-status-label: var(--black);
--sb-list-data: var(--gray-100);
--sb-list-items: var(--white);
--sb-profile-bg-c-4: var(--color-444);
--sb-profile-page-basic-label-bg: var(--color-333);
//black header bar
--brand-header-tail-bg: var(--color-000);
--brand-header-tail-text: var(--white);
--primary-menu-link-active: #ff714a;
// joy theme
--themeflower-bg: #1a1a1a;
281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350
//pagination
--sb-pagination-bg: var(--color-333);
--sb-pagination-item-bg: var(--sb-pagination-bg);
--sb-pagination-item: var(--white);
--sb-pagination-item-active: var(--gray-400);
//filters
--sb-prominent-filter-bg: var(--color-444);
--sb-prominent-filter-title: var(--white);
--sb-multiple-dropdown-border: var(--gray-100);
--sb-multiple-dropdown-border-hover: var(--gray-200);
--sb-multiple-dropdown-bg: var(--color-222);
--sb-prominent-filter-field-color: var(--white);
--sb-dropdown-menu-bg: var(--sb-multiple-dropdown-bg);
--sb-dropdown-menu-item: var(--white);
--sb-drodown-selection-active: var(--primary-300);
--ui-seleted-label-bg: var(--color-222);
--ui-seleted-label-bg-hover: var(--black);
--state-medium-container-bg: var(--color-444);
--sb-class-bar-bg: var(--color-333);
--sb-dropdown-menu-text: var(--white);
--ui-dropdown-menu-selected-item-bg: var(--color-444);
--ui-dropdown-menu-selected-item: var(--white);
--sb-filter-selected-dropdown-hover: var(--black);
//slick slide card
--sb-card-bg: var(--color-222);
--sb-card-border: 0.0625rem solid transparent;
--sb-card-text: var(--white);
--sb-card-slick-arrows-bg: var(--color-444);
--sb-profile-page-container: var(--color-333);
//myGroups
--sb-mygroups-bg: var(--color-444);
--groups-content-header: var(--color-444);
--kabab-menu-hover-bg: var(--black);
--kabab-menu-dropdown-bg: var(--color-333);
--kabab-menu-dropdown-item-active: var(--color-333);
--sbfaq-compt-bg: var(--color-222);
--visit-helpcenter-bg: var(--color-333);
//SDK
--sdk-end-page-title: var(--white);
--sdk-end-page-replay-icon: var(--white);
--sdk-end-page-replay-section-bg: var(--color-333);
--sdk-end-page-replay-section-hover: var(--color-222);
--sdk-end-page-title-span: var(--white);
//QUML
--quml-main-bg: var(--color-333);
--quml-color-primary-contrast: var(--white);
--quml-scoreboard-sub-title: #f2f2f2;
--quml-mcq-title-txt: var(--white);
--quml-option-card-bg: var(--color-222);
--quml-btn-border: var(--color-222);
--quml-option-selected-checkmark: var(--color-333);
--quml-navigation-btns: var(--color-333);
--quml-question-bg: var(--color-333);
--quml-scoreboard-unattempted: var(--white);
--quml-info-icon: var(--color-000) !important;
--quml-close-icon: var(--white);
--signup-panel-bg: var(--sbt-body-bg2);
//explore-page
--sb-explore-hr: #000;
--sb-section-preference: var(--white);
--slick-dots-active-color: var(--gray-200);
--slick-dots-color: var(--gray-800);
351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420
// lazy loading
--lazyload-bg: var(--color-333);
--grey-nuance-lighter: var(--color-333);
--grey-nuance-darker: var(--color-111);
--fade-grey: #f2f2f2;
.mat-select-placeholder {
color: rgba(255,255,255,.4);
}
.sbhelp_container__left {
border-radius: 1.5rem;
}
.listView-compt__btn {
button {
background-color: var(--primary-color);
color: var(--black);
&:hover {
background-color: var(--primary-300);
}
}
}
.sbt-filter-text {
background: var(--color-222) !important;
}
.multi-select-container .list-border,
sb-form .sb-textbox,
sb-form .async-text {
border-radius: 1.75rem;
}
.sbt-back-header .content-header {
background-color: var(--color-444) !important;
}
.ui.selection.sbt-dropdown.dropdown.sbt-green {
color: var(--white);
}
.profile-bg-c-4 {
background: var(--color-222) !important;
color: var(--white);
}
.content-preference__info {
@media screen and (max-width: 992px) {
background: var(--color-222) !important;
color: var(--white);
}
}
.ui.selection.sbt-dropdown.dropdown .menu>div .item:hover,
.ui.selection.sbt-dropdown.dropdown .menu>div .item.active {
background: var(--primary-color) !important;
color: var(--black);
}
.notification-bell {
box-shadow: var(--sbt-box-shadow-6px);
}
.sbaccordion__panel-header .icon-svg,
.help-page__content .panel-heading .icon-svg {
background: var(--color-222);
}
421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490
.sbt-footer-title {
color: var(--black) !important;
}
.add-adminrole__content {
background: var(--sbt-compt-bg) !important;
}
.no-result-container {
border-radius: 1.5rem;
background: var(--sbt-compt-bg) !important;
.no-result-text {
color: var(--white);
}
}
.cfe-multiselect-label {
color:hsl(var(--gray-hs), 80%);
}
input.sb-form-control:-internal-autofill-selected {
color-scheme: dark;
box-shadow: 0 0 0 1000px var(--color-333) inset;
}
.profile-bg-c-4 {
color: var(--white);
}
app-signup {
.sb-checkbox.sb-checkbox-primary label:before {
border-color: var(--primary-color);
}
}
.sbt-theme-bg-img .st0 {
fill: #999;
}
.faq-report-container h6 {
color: #f2f2f2;
}
.faq-report-container sb-form .multi-select-section-app .multi-select-container {
sb-caret-down svg {
filter: none;
}
.list-border ul {
color: var(--black);
}
}
::placeholder {
color: var(--white) !important;
opacity: 1 !important;
/* Firefox */
}
:-ms-input-placeholder,
::-ms-input-placeholder {
/* Internet Explorer 10-11 */
color: var(--white) !important;
}
.sb-btn-link-primary:hover,
.sb-btn-link-primary:active,
.sb-btn-link-primary.active {
background-color: var(--primary-800);
491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560
}
sb-pills-grid[ng-reflect-title='Browse by Categories'] {
.sb-label-grid.sb-pills-grid .item {
background-color: var(--color-222) !important;
}
}
.sb-label-grid .item:hover {
background: var(--color-333);
}
.sb-btn-round {
background: var(--color-444);
}
.sbt-inside-page-container,
app-my-groups .sbt-center-container,
app-group-details .sbt-center-container,
app-add-activity-content-types .sbt-center-container,
app-activity-search .sbt-center-container,
app-activity-details .sbt-center-container,
app-add-member .sbt-center-container,
.sbt-fluid-content-bg,
.sbt-page-content-area {
background: rgba(17, 17, 17, 1);
}
.sbt-page-content-area {
background: none !important;
}
.terms-and-cond-form iframe,
sb-caret-down svg,
.sb-form-control:focus+i.icon-input-close,
.sb-btn-nolayer img,
.enter-qr-code-body img,
.flex-ai-jc-center.add-member-content img,
.sb-multi-rows img,
.player-endpage__right-panel .user-options img {
filter: invert(1);
}
.no-content-container .board-title,
.no-content-container .sub-title,
.ui.semi-circular.update.basic.label,
.ui.semi-circular.basic.label {
color: var(--gray-100) !important;
}
.sb-epub-reading-status,
.sb-label-grid .item:hover,
.sb-notification-modal .ui.modal,
.flex-ai-jc-center.add-member-content {
background: var(--color-333);
}
.sb-player-header__panel .player-pagenumber .page-count:focus~.focus-arrow,
.batch-details__dropdown .selection.ui.dropdown {
background: var(--color-222);
}
.ui.star.rating .icon {
color: rgba(var(--rc-rgba-black), .5);
}
.sbchapter__item--active,
.sbchapter__item--active:hover,
.sbchapter__item:hover {
border: calculateRem(1px) solid var(--cc-toc-card-item-br);
561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630
.icon-svg svg.icon.icon-svg--primary {
fill: var(--color-000) !important;
}
}
.sb-btn-disabled {
color: var(--color-000) !important;
&:hover {
color: var(--color-333) !important;
}
}
.sbt-welcome-theme-container .joy-modal-footer {
background: var(--color-333) !important;
}
//avtar
.avatar-content {
background: var(--color-222) !important;
border: calculateRem(1px) solid var(--color-222) !important;
color: var(--white) !important;
}
.sb-search-box .sb-btn {
background: var(--primary-color);
color: var(--color-000);
}
.sb-modal .ui.modal>.close {
color: var(--color-000);
}
.sbchapter__item .sbchapter__img--inprogress .icon-svg svg.icon.icon-svg--primary {
fill: var(--color-000);
}
.sb-manage-section .sb-multi-rows:nth-child(odd) {
background: var(--color-222) !important;
border: none;
}
.sb-notification-container .sb-notification-header,
.multi-select-container .list-border .placeholder {
color: var(--white) !important;
}
.menu:hover::after,
.sb-members-list-item .menu:hover::after {
background: var(--kabab-menu-hover-bg) !important;
}
.sb-members-list-item .status {
color: var(--black) !important;
}
.no-clicked,
.yes-clicked {
background: var(--color-222);
}
.help-page__content .panel .panel-info {
.input-text {
background: var(--black);
color: var(--white);
}
.submit-button {
color: var(--black);
631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700
}
}
app-add-member {
.ui.container {
.sb-bg-color-white {
background: var(--color-333) !important;
}
}
}
.certificate-course-content {
.sbchapter__item__score {
color: var(--white);
}
}
.sbchapter__item--active,
.sbchapter__item--active:hover,
.sbchapter__item:hover {
.sbchapter__item__score {
color: var(--black);
}
}
.sb-notification-container .clear-text a {
color: var(--primary-color) !important;
}
.sb-bg-color-white.sb-back-btn-panel {
background: var(--color-444) !important;
}
.sb-bg-color-white.sb-modal-content {
background-color: var(--color-333) !important;
}
//chatbot
.lib-chat-panel {
background: var(--color-222);
.lib-chat-header {
background: var(--color-000);
color: var(--white);
}
.lib-chat-body,
.messages-container {
background-color: var(--color-333);
}
.chat-msg.recieved {
background: var(--color-222);
div {
color: var(--white);
}
.btn-primary {
background: var(--white);
border: calculateRem(1px) solid var(--primary-color);
color: var(--color-000);
&:hover {
background: var(--primary-color);
}
}
}
.msg-input {
701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770
background: var(--color-222);
color: var(--white);
}
.chat-msg.sent {
background: var(--primary-color) !important;
color: var(--color-222) !important;
}
.btn-info {
background: transparent !important;
color: #fff !important;
border: 0px solid red !important;
&:hover {
background: var(--primary-800) !important;
color: var(--color-333) !important;
}
}
.lib-chat-footer .send-btn img {
filter: invert(1);
}
.lib-chat-footer {
border-top: calculateRem(1px) solid var(--color-333);
}
}
.chatbox-cover .chatbox {
border: calculateRem(1px) solid var(--primary-color) !important;
background-color: var(--primary-color) !important;
}
.chatbox-cover .chatboxText {
background: var(--primary-color) !important;
color: var(--color-000) !important;
}
.chatbox-cover .chatbox ::after {
border-color: var(--primary-color) var(--primary-color) transparent transparent !important;
}
.overlay-sidebar {
background: rgba(var(--sbt-sidemenu-overlay-bg), 0.8);
}
.logo.sbt-logo,
.five.wide.column .d-flex.logo,
.sb-onboard .brand-logo,
.terms-modal-logo {
padding: 0.5rem;
border-radius: 0 0 1rem 1rem;
background: var(--white);
}
.terms-modal-logo {
max-width: 14rem;
text-align: center;
margin: 0 auto;
}
.add-user--horizontal {
background-color: var(--primary-color);
.add-user__label {
color: var(--black) !important;
}
}
771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840
.user-profile-box,
.sb-members-list-item,
.sbt-welcome-theme-container .joy-modal-footer {
background: var(--color-333);
}
.members-inline .sb-members-list-item,
.sb-modal-dropdown-web ul li:hover,
.sb-toc-child-item,
.cc-player__btn-back {
background: var(--color-222);
}
.sb-btn-outline-primary,
.df-back-btn-container .sb-btn {
img {
filter: invert(1);
}
&:hover {
img {
filter: grayscale(1);
}
}
}
.add-user__icon img {
filter: grayscale(1);
}
.ui.segment {
background: var(--color-333);
}
.sb-members-list-item--medium .selected img {
filter: invert(1);
}
.sb-form-control {
color: var(--white) !important;
background: var(--color-333) !important;
&::placeholder {
color: var(--white);
}
&::selection {
color: var(--white) !important;
}
}
.sb-field.ui.left.icon.input {
i.icon {
color: var(--white);
}
}
.sb-rating.ui.star.rating .icon {
color: var(--color-444);
}
.sb-checkbox label:before,
.sb-radio-btn-checkbox label:before {
background: var(--black);
}
.sb-checkbox input:checked~.box:after,
.sb-checkbox input:checked~label:after {
color: var(--black);
841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910
}
.ui.selection.sbt-dropdown.dropdown.sbt-purple--lbg .sbt-dropdown-section .item:hover,
.ui.selection.sbt-dropdown.dropdown.sbt-purple--lbg .sbt-dropdown-section .item.active {
background: var(--primary-color) !important;
color: var(--black);
}
.sb-modal-dropdown-web ul {
background-color: var(--black);
color: var(--white);
border: calculateRem(2px) solid var(--black);
box-shadow: none;
}
.sb-modal-dropdown-web .selected-option {
background: var(--primary-color) !important;
color: var(--black);
}
.sb-onboard sb-form .sb-textbox,
sb-form .sb-textbox,
sb-form .async-text {
background: var(--color-333);
border: calculateRem(.5px) solid var(--gray-400);
color: var(--white);
}
.sb-onbrd-g-box__guest__item {
box-shadow: 0 1.25rem 2.5rem -0.625rem #191818;
background-color: var(--color-222);
border: 0.125rem solid var(--color-222);
&:hover,
&.active {
.title {
color: var(--color-333);
}
}
}
.sb-members-list-item:hover,
.sb-members-list-item.active {
border-radius: 0rem;
}
.sb-group-container {
background: var(--color-333) !important;
}
.batch-row .batch-name {
color: var(--gray-800);
}
.ui.styled.accordion .accordion .active.title,
.ui.styled.accordion .accordion .title:hover,
.ui.styled.accordion .active.title,
.ui.styled.accordion .title:hover {
color: rgba(255, 255, 255, .75);
}
.sb-color-gray-400 {
color: var(--gray-800) !important;
}
.notification-bell {
box-shadow: none;
}
911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980
.back-btn-container.cc-player__btn-back {
background: var(--sbt-compt-bg) !important;
}
.cc-player__content-header {
background: var(--color-444);
}
.content-video__player__details {
background: transparent !important;
}
.content-metadeta,
.ui.styled.accordion,
.ui.styled.accordion .accordion,
.sb-accordion-content.sb-bg-color-white,
.sb-groups-members-card,
.sb-toc-credits .sbaccordion__panel-header,
.sb-toc-credits .sbaccordion__panel-content {
background: var(--color-333) !important;
}
.sb-back-header {
.sb-back-btn-panel {
background: var(--color-222) !important;
}
}
.training-relevant .sb-color-gray-400 {
color: var(--white) !important;
}
.sbchapter__item.disabled-toc-card {
background-color: var(--gray-200) !important;
.sbchapter__item__title {
opacity: 1;
}
.sbchapter__item__score {
color: var(--black) !important;
}
}
.cc-player {
.ui.info.message {
background-color: var(--color-222) !important;
color: var(--primary-color) !important;
box-shadow: none;
}
}
//buttons
.sb-btn-primary,
.sb-btn-link-primary,
.sb-btn-secondary {
&:hover,
&:active,
&.active {
color: var(--black);
}
}
.sb-btn-primary {
.icon-svg--white {
fill: var(--black);
}
981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050
}
.sb-btn-outline-primary,
.sb-btn-outline-secondary {
background-color: var(--sbt-filter-bar-bg);
&:hover,
&:active,
&.active {
color: var(--black);
}
}
.sb-btn-outline-primary {
&:hover,
&:active,
&.active {
background-color: var(--primary-800);
}
}
.sb-btn-outline-secondary {
&:hover,
&:active,
&.active {
background-color: var(--secondary-400);
}
}
.sb-btn-link-gray {
&:hover,
&:active,
&.active {
background-color: var(--primary-color);
color: var(--black);
}
}
.sb-btn-link-primary,
.sb-btn-link-gray {
&:hover,
&:active,
&.active {
.icon-svg--primary {
fill: var(--black);
}
}
}
.batch-deatils__button .sb-btn-disabled {
color: var(--color-444);
&:hover {
color: var(--color-444) !important;
}
}
.sb-btn-square,
.content-video__player__tools .sb-btn-square {
color: var(--white);
&:hover {
color: var(--black);
}
}
1051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120
app-faq .sb-btn-round.sb-btn-link-primary {
background-color: inherit !important;
&:hover,
&:active,
&.active {
background-color: var(--primary-color) !important;
color: var(--black);
}
}
.ui.styled.accordion .title:hover {
color: var(--primary-color);
}
.sb-toc-child-item {
background: var(--cc-chapter-bg);
}
.help-page__header.sb-bg-color-white {
background: var(--cc-accordion-panel-header-bg) !important;
}
.help-page__content .panel {
.panel-heading,
.panel-interact {
background: var(--cc-accordion-panel-header-bg);
}
}
.sb-toc-child-item .toc-child-item,
.sb-toc-child-item .child-content-padding,
.side-toc-content.chapter-box .toc-child-item,
.side-toc-content.chapter-box .child-content-padding {
background: var(--color-222) !important;
}
.cc-player__list {
background-color: var(--color-222);
}
.sb-course-details .sb-course-details__info .sb-bg-color-white {
background: var(--color-333) !important;
}
.sb-course-details .certified-course__certificate {
background-color: var(--color-222) !important;
}
.sb-bg-color-white.certified-course__progress {
background: var(--sbt-compt-bg) !important;
}
// Pdf Player
sunbird-pdf-player .sunbird-pdf-palyer-container,
sunbird-epub-player .sunbird-epub-container {
.sb-pdf-main-header .sb-player-header {
background: var(--sbt-compt-bg);
z-index: 1;
position: relative;
.player-icon {
background: var(--black) !important;
}
}
}
// player header
1121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190
sb-player-header .sb-player-header {
background: var(--sbt-compt-bg) !important;
z-index: 1;
position: relative;
.icon_rotate {
img {
filter: invert(1);
}
}
.navigation-arrows {
background-color: var(--white);
border-color: unset !important;
}
.paginate.left,
.paginate {
i {
background-color: var(--black);
}
}
.paginate.left:hover i {
background: var(--black);
}
}
// Hamburger menu for pdf, epub, player etc
sb-player-side-menu-icon {
#overlay-button span {
background: var(--white) !important;
&:before,
&:after {
background: var(--white) !important;
}
}
input[type=checkbox]:checked~#overlay-button {
span,
&:hover span {
background: 0 0 !important;
}
span:before {
background: var(--black) !important;
}
&:hover span:before {
background: var(--white) !important;
}
span:after {
background: var(--black) !important;
}
&:hover span:after {
background: var(--white) !important;
}
}
}
.navBlock {
background: var(--color-222) !important;
ul li {
background: var(--color-222) !important;
1191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260
color: var(--white) !important;
.player-icon {
background: var(--white) !important;
}
&:hover {
color: var(--black) !important;
background: var(--gray-0) !important;
.player-icon {
background: var(--black) !important;
}
}
}
}
.navBlock .player-nav-unit {
color: var(--black) !important;
}
.sb-player-header__panel .player-zoom-btns__zoombtn {
color: var(--white) !important;
&:hover {
color: var(--black) !important;
}
}
.sb-pdf-reading-status {
color: var(--black) !important;
background: var(--primary-color) !important;
span {
background: var(--black) !important;
}
}
.file-download__popup {
background: var(--color-444) !important;
}
.file-download .close-btn .close-icon {
&:after,
&:before {
background: var(--white) !important;
}
&[data-animation=showShadow]:not(.showShadow):hover {
box-shadow: 0 0 0 0.25rem var(--white) inset !important;
}
}
.file-download__text,
.file-download__size {
color: var(--white) !important;
}
.file-download__overlay {
background: rgba(var(--rc-rgba-black), .8);
}
sui-multi-select.ui.selection.dropdown,
sui-select.ui.selection.dropdown {
background: var(--sb-dropdown-menu-bg) !important;
}
.ui.selection.dropdown .menu>.item {
color: var(--ui-dropdown-menu-selected-item);
1261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330
}
.ui.selection.dropdown .menu>.item:hover {
background: var(--primary-color);
color: var(--black);
}
.ui.multiple.dropdown .label {
background: var(--color-222);
color: var(--white);
}
.ui.dimmer {
background-color: rgba(var(--rc-rgba-black), 0.5);
}
.training-modules__title .sb-btn.sb-btn-outline-primary,
.forum-btn {
img {
filter: invert(1);
}
&:hover {
img {
filter: unset;
}
}
}
.content-header__buttons {
.sb-btn.sb-btn-normal.sb-btn-outline-primary {
&:hover {
img.mr-4.pt-2 {
filter: unset;
}
}
img.mr-4.pt-2 {
filter: invert(1);
}
}
}
app-loader {
.ui.icon.message {
background: var(--color-444);
}
.notched.circle.loading.icon {
color: var(--white) !important;
}
.content {
.header,
p {
color: var(--white) !important;
}
}
}
.course-complete-para,
.content-metadeta__title {
color: var(--white) !important;
}
.sb-onboard__container {
background: var(--color-333);
}
1331133213331334133513361337133813391340134113421343134413451346134713481349135013511352135313541355135613571358135913601361136213631364136513661367136813691370137113721373137413751376137713781379138013811382138313841385138613871388138913901391139213931394139513961397139813991400
.help-page__header.sb-bg-color-white,
.sbt-header-menu-bar {
background: var(--color-222) !important;
}
.content-metadeta__title {
color: var(--white);
}
.sb-md-container {
background: var(--color-333) !important;
}
.sbaccordion__panel-content .heading,
.data-labels,
.ui.selection.dropdown .menu>.message {
color: var(--white);
}
sb-card-hover.card-hover .action-item {
.sb-btn-grow {
color: var(--black) !important;
.icon-svg svg.icon {
filter: invert(1) !important;
}
}
}
.add-adminrole__content {
background: var(--sbt-compt-bg) !important;
}
.no-result-container {
background: var(--sbt-compt-bg) !important;
.no-result-text {
color: var(--white);
}
}
// Data tables
table.dataTable thead th,
.sb-table tbody td {
background-color: var(--gray);
color: var(--white);
}
.dataTables_wrapper {
label {
color: var(--white);
}
.dataTables_length select {
color: var(--white);
background-color: var(--gray);
}
.dataTables_info {
color: var(--white);
}
.dataTables_paginate .paginate_button {
color: var(--white) !important;
&.current {
color: var(--white) !important;
background-color: #585858;
14011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462
background: linear-gradient(to bottom, #585858 0%, #111 100%);
}
}
}
// Date picker
.md-drppicker {
background: var(--color-444);
color: var(--white);
.ranges ul li button {
&[disabled] {
opacity: .6;
}
color: var(--white);
}
.calendar-table {
background: var(--color-444);
border-color: var(--color-444);
}
td.available.prev,
th.available.prev,
td.available.next,
th.available.next {
filter: invert(1);
}
.btn {
color: var(--gray);
}
}
table.dataTable.no-footer {
background: var(--primary);
border: 1px solid var(--black);
thead th {
background-color: var(--primary) !important;
color: var(--black);
}
tbody tr {
background-color: var(--color-444);
color: var(--white);
&:nth-child(odd) {
background-color: var(--color-333) !important;
}
}
}
.field>label,
.inline.fields>label,
.ui.modal .ui.radio.checkbox .box,
.ui.radio.checkbox label {
color: var(--black);
}
}