Full CSS Example

Here is a sample CSS file containing popular changes. This file includes examples that you might find useful for customizing your BioT portal.

/* BUTTONS */
/* All delete */

.biot-delete {
  color: blue !important;
  border-color: red !important;
}

.biot-delete .biot-delete-svg {
  color: red !important;
}

/* delete from side preview */

.biot-side-preview .biot-delete {
  background-color: aquamarine !important;
}

/* .biot-side-preview .biot-side-preview-delete-button .biot-delete {
  background-color: aquamarine !important;
} */

/* delete action */

.biot-delete-action {
  text-transform: uppercase !important;
  color: blueviolet !important;
}

/* delete of entity-type */

.biot-caregiver-preview .biot-side-preview .biot-delete {
  text-transform: uppercase !important;
}

/* ADD */

/* All add button */
.biot-add-list .biot-add {
  color: blue !important;
}

/* All add menu */
.biot-add-menu {
  background-color: aqua !important;
}

/* All add menu items */
.biot-add-menu-item {
  color: red !important;
}

/* Add menu of a particular template - caregiver: Massage Therapists */
.biot-add-menu-item-massage-therapists {
  text-transform: uppercase !important;
  background-color: blue !important;
}

/* Add button of entity type  */
.biot-organization-user-page .biot-add-list .biot-add {
  background-color: pink !important;
}

/* Add menu of entity type  */
.biot-organization-user-add-menu {
  background-color: forestgreen !important;
}

/* Add menu of entity type + particular template*/
.biot-organization-user-add-menu .biot-add-menu-item-developer {
  text-transform: uppercase !important;
}

.biot-add-list .biot-zilia-session {
  border-color: blueviolet !important;
}

/* we can't override items by template name only by entity type. critical?
.biot-zilia-session .biot-add-list-menu-item-add-new {
  text-transform: uppercase !important;
} */

/* EDIT */

/* All edit button */
.biot-edit {
  border-color: brown !important;
}

.biot-edit .biot-edit-svg {
  color: yellow !important;
}
/* Edit button of entity type  */
.biot-device-expand .biot-edit {
  background-color: brown !important;
}

/* ATTACH */

.biot-attach {
  color: purple !important;
}

.biot-add-menu-item-attach {
  text-transform: uppercase !important;
}

.biot-add-menu-item-attach-text {
  color: yellow !important;
}

.biot-generic-entity-add-menu .biot-add-menu-item-attach-text {
  color: pink !important;
}

/* DETACH */
.biot-detach-action {
  text-transform: uppercase !important;
}
.biot-detach-svg {
  color: yellow !important;
}

/** TABS **/

/* main tabs */

/* all tabs - as a group */
.biot-main-tabs .biot-tabs {
  text-transform: uppercase !important;
  background-color: aqua !important;
}

/* each tab */
.biot-main-tabs .biot-tab {
  color: green !important;
}

/* built in tab */
.biot-main-tabs .biot-tab-patients {
  display: none !important;
}

/* custome tab */
.biot-main-tabs .biot-tab-graafana-demo {
  text-transform: lowercase !important;
  color: pink !important;
}

/* MAIN TABS - CONTENT */
/* all main */
.biot-page-all {
  background-color: aqua !important;
}

/* EXTERNAL */
.biot-external-page {
  display: none !important;
}

/* TEMPLATE */
/* specific entity type  - cargiver type*/
.biot-caregiver-page {
  display: none !important;
}
/* specific template  - generic entity type*/
.biot-phi-entity-page {
  display: none !important;
}

/* expand tabs - by entity type */

/* all tabs - as a group */
.biot-caregiver-expand .biot-tabs {
  text-transform: uppercase !important;
  font-weight: bold !important;
}

/* built in tab */
.biot-caregiver-expand .biot-tab-overview {
  /* display: none !important; */
  color: yellowgreen !important;
}

/* custome tab */
.biot-caregiver-expand .biot-tab-test-hello {
  text-transform: uppercase !important;
  color: red !important;
}

/* all expand tabs */

/* all tabs - as a group */
.biot-expand .biot-tabs {
  text-transform: lowercase !important;
}

.biot-expand .biot-tab {
  color: rgb(77, 8, 77);
}

/* built in tab */
.biot-expand .biot-tab-overview {
  color: rgb(79, 153, 27);
  /* display: none !important; */
}

.biot-consultation-expand .biot-tab {
  color: brown !important;
}

/* external - tab content */
.biot-expand .biot-external-tab {
  display: none;
}

/* reference - tab content */
.biot-expand .biot-reference-tab {
  /* display: none !important; */
  background-color: blueviolet;
}

/* EXPAND - CONTENT */
.biot-expand .biot-tab-panel {
  background-color: aqua !important;
  /* display: none !important; */
}

/* tab panel - cccc template */
.biot-expand .biot-tab-panel-cccc {
  color: rgb(238, 15, 160) !important;
}

/* TEST THE REQUIRMENTS: */

.biot-tab-observations {
  display: none !important;
}

.biot-tab-patient-monitoring-station {
  display: none !important;
}

.biot-tab-device-operation-center {
  display: none !important;
}

/* .biot-add-list .biot-add {
  display: none !important;
} */

.biot-organization-user-page .biot-add-list .biot-add {
  display: none !important;
}

.biot-reference-tab .biot-device-alert-page .biot-add-list {
  display: none !important;
}

.biot-add-list .biot-drug-delivery {
  display: none !important;
}