v15: them - ashish-greycube/help GitHub Wiki

/* Works on Chrome, Edge, and Safari */
*::-webkit-scrollbar {
    width: 6px;
} 
*::-webkit-scrollbar-track {
    background: var(--scroll-bg);
}
*::-webkit-scrollbar-thumb {
    background-color: var(--scroll-color);
    border-radius: 20px;
}
* {
    scrollbar-width: thin;
    scrollbar-color: #292b30 #00000008;
}


@media (min-width: 992px) {
    [data-page-route=Workspaces] .layout-main .layout-side-section, [data-page-route=Workspaces] .layout-main .layout-main-section-wrapper {
        height: 100%;
        overflow-y: auto;
        background-color: #f3f3f3;
scrollbar-color: #292b30 #00000008;   
}
}

.layout-main-section-wrapper {
    min-width: 0;
    background-color: #23282f00;
}

[data-page-route=Workspaces] .layout-main-section {
    background-color: #ffffff;
    box-shadow: none;
    border-radius: var(--border-radius-lg);
    padding: var(--padding-sm);
}


.awesomplete .input-with-feedback {
    background-color: #c3c3c500;
    color: var(--text-color);
}

.widget.shortcut-widget-box:hover .widget-title {
    color: var(--invert-neutral) !important;
}

.widget.links-widget-box {
    padding: 10px;
    background-color:#d6e9ff6b;
} 

.widget.links-widget-box .widget-head .widget-label .widget-title {
    font-size: var(--text-lg);
    font-weight: var(--weight-semibold);
    letter-spacing: .015em;
    color: #1700ff !important;
}


.widget.links-widget-box .link-item {
    display: flex;
    text-decoration: none;
    font-size: var(--text-base);
    font-weight: var(--weight-regular);
    letter-spacing: .02em;
    color: #000000;
    padding: 4px;
    margin-left: -4px;
    margin-bottom: 0;
    border-radius: var(--border-radius-md);
    cursor: pointer;
}

.widget.links-widget-box .link-item .link-content:hover {
    color: #0600ff;
}

[data-page-route=Workspaces] .codex-editor svg {
    fill: #1700ff;
   
}
.widget {
    display: flex;
    flex-direction: column;
    min-height: 1px;
    padding: 7px;
    border-radius: var(--border-radius-lg);
    height: 100%;
    background-color: #67afffb8  ;  
}

.list-row-head {
    cursor: default;
    background-color: #2196f345;
    height: 30px;
    margin: .5rem var(--padding-xs);
    border-radius: var(--border-radius-md);
}


}
.widget.number-widget-box  {
    cursor: pointer;
    min-height: 84px;
    padding: var(--number-card-padding);
    border: 1px solid var(--border-color);
    background-color: #70b4ff;
    }
    
.widget.dashboard-widget-box {
    min-height: 240px;
    border: 1px solid #9fa1ac85;
    background-color: aliceblue;
}

.widget.number-widget-box .widget-body .widget-content .green-stat {
    color: #1d1d1d;
    }

.ql-snow .ql-editor .ql-code-block-container {
    color: #000000;
    overflow: visible;
    background: bottom;
}

.ql-editor .ql-code-block-container, .ql-bubble .ql-editor .ql-code-block-container {
    font-family: system-ui;
}

.ql-code-block-container, .ql-bubble .ql-editor .ql-code-block-container {
    background-color: #e6e6e600;
    color: #000000;
    padding: var(--padding-xs) var(--padding-sm) !important;
    margin-bottom: var(--margin-xs) !important;
    margin-top: var(--margin-xs) !important;
    border-radius: var(--border-radius-sm);
}
.frappe-control .ql-editor:not(.read-mode) {
    background-color: #f2f2f2;
}

.comment-box .comment-input-container .frappe-control .ql-editor {
    background-color: #f0f0f0 !important;
    border: 1px solid var(--border-color);
    min-height: 24px;
    padding: 6px;
}


[data-page-route=Workspaces] .sidebar-item-container .sidebar-item-container {
    margin-left: 10px;
    background-color: #96a4b533;
}

.chart-container .axis, .chart-container .chart-label {
    fill: #0018ea;
}

.form-tabs-list {
    position: sticky;
    background-color: #95d0ff;
    z-index: 5;
    transition: .5s top;
    padding-left: var(--padding-xs);
    border-bottom: 1px solid #76c2ff;
    border-radius: var(--border-radius-md) var(--border-radius-md) 0 0;
}

..form-tabs-list .form-tabs .nav-item .nav-link.active {
    font-weight: normal;
    border-bottom: 1px solid #17171700;
    color: #00156a;
}
.std-form-layout>.form-layout>.form-page {
    border-radius: var(--border-radius-md);
    border: 1px solid #9fa1ac85;
    box-shadow: none;
    background-color: #ffffff;
}

.checkbox .label-area {
    font-size: var(--text-sm);
    font-weight: var(--weight-medium);
    letter-spacing: .02em;
    color: #0474ff;
}

.like-disabled-input {
    min-height: var(--input-height);
    border-radius: var(--border-radius-sm);
    padding: var(--disabled-input-padding);
    cursor: default;
    color: #383838;
    background-color: #2196f31c;
}


.standard-sidebar .standard-sidebar-item>a, .desk-sidebar .standard-sidebar-item>a, .search-dialog .search-results .search-sidebar .standard-sidebar-item>a {
    color: #0010ff;
    text-decoration: none;
    font-weight: 500;
}

.standard-sidebar .standard-sidebar-item.selected, .desk-sidebar .standard-sidebar-item.selected, .search-dialog .search-results .search-sidebar .standard-sidebar-item.selected {
    background-color: #388ae54a;
}

.standard-sidebar .standard-sidebar-item:hover, .desk-sidebar .standard-sidebar-item:hover, .search-dialog .search-results .search-sidebar .standard-sidebar-item:hover {
    background-color: white;
    text-decoration: none;
}

.es-icon {
    fill: #0072ff2b;
    stroke: #0000004f;

}
.icon, .es-icon {
    fill: #0072ff2b;
    stroke: #0000004f;
}

.graph-svg-tip .svg-pointer {
    position: absolute;
    height: 12px;
    width: 12px;
    border-radius: 2px;
    background: #2196F3;
    transform: rotate(45deg);
    margin-top: -7px;
    margin-left: -6px;
}

.graph-svg-tip {
    position: absolute;
    z-index: 99999;
    padding: 10px;
    font-size: 12px;
    text-align: center;
    background: #9fe0ff;
    box-shadow: 0px 1px 4px rgba(17, 43, 66, 0.1), 0px 2px 6px rgba(17, 43, 66, 0.08), 0px 40px 30px -30px rgba(17, 43, 66, 0.1);
    border-radius: 6px;
}




.form-control {
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    background-color: #fffffffc !important;
    border: 1px solid #3f62d5;
}


.search-bar .awesomplete input {
    background-color: var(--bg-color)
}
.modal-backdrop{
    background-color: #2c436b !important;
}

.widget .widget-head .widget-label .widget-title {
    display: flex;
    align-items: center;
    font-size: var(--text-base);
    font-weight: 100;
    letter-spacing: .015em;
    font-family: inherit;
    line-height: 1.3em;
    color: #0027ff;
    cursor: default;
}

.comment-box .comment-input-header, .form-dashboard-section .section-head, .form-section .section-head, .head-title {
    font-size: var(--text-base);
    font-weight: 600;
}
.comment-box .comment-input-container .ql-editor {
    border: 1px solid var(--border-color);
}
.duration-picker .duration-input {
    background-color: var(--bg-color);
    border: 1px solid var(--border-color);
}

.control-label {
    font-weight: 500;
    color: #0474ff;
   
}

.page-container {
    background-color: #23282f00;
}


h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
    color: #000000;
    cursor: default;
}

[data-theme="dark"] {
    --bg-color: var(--gray-900);
    --disabled-control-bg: var(--gray-900);
    --border-color: #1c2126;
    --margin-lg : 15px;
    --text-bold: 600;
    --scroll-bg: #394cd5;
    --scroll-color: #00ffff;
}

[data-theme="light"] {
    --bg-color: #f4f4f4;
    --text-bold: 600;
    --control-bg : #c3c3c5ad;
    --control-bg-on-gray: #c6c6c69c;
    --disabled-control-bg: #f1f1f1;
    --heading-color: #000000;
    --border-color:#9fa1ac85;
    --avatar-frame-bg: #becef76b;
    --margin-lg: 15px;
    --sidebar-select-color: #d3d3d3;
    --awesomplete-hover-bg: #d4dcea;
    --scroll-bg: #394cd5;
    --scroll-color: #d9dfe6;
}


/*****  OVERRIDDEN CSS  *****/

/* Heading Text Color */
/*

h3.ellipsis.title-text,
.widget-group .widget-group-head .widget-group-title,
.layout-side-section .sidebar-label{
    color: white !important;

}

*/
/* Form Input Focus *//*

input:focus{
    border: 1px solid ##8B95EC !important;
}
.form-control:focus{
    box-shadow: 0 0 0 2px rgba(94, 108, 162, 0.25) !important;
}

*/
/* Div Padding *//*

.widget.widget-shadow.shortcut-widget-box{
    padding: 5px 10px;
}

*/
/* List Design *//*

.indicator-pill, .indicator-pill-right{
    padding: 7px 8px;
    height: unset;
}

*/
/* Collapse Div Padding *//*

.section-head.collapsed{
    padding: 2px 4px;
}

*/
/* Dropdown List Hover *//*

.awesomplete > ul > li:hover, .awesomplete > ul > li[aria-selected="true"]{
    background-color: #a492bf;
}*/


/* Global CSS */

/* Colours */
:root {
    --background-color: #2728C1;
    --primary-color: #1956a9 ;
    --secondary-color: #1956a9 ;
    --white-color: #ffffff;
    --black-color: #000000;
    --gray-color: #888;
    --page-head-height: 50px;
    --navbar-height: 50px;
}

.btn-primary:active,
.btn-secondary:focus,
.btn-secondary:active,
.btn-secondary:focus{
    box-shadow: none !important;
}

.btn-primary {
    color: #ffffffe8 !important;
    background-color: #2196f3  !important;
    border-radius: 0 !important;
}


.btn-primary:hover {
        background-color:#41b97a !important;
}



/* 
 
.btn-secondary{
    background-color: #606060 !important;
    color: var(--white-color) !important;
    border-radius: 0 !important;
    transition: background-color ease-in-out .15s;
}

.btn-secondary:hover{
    background-color: #1366af !important;
} 



*/

.btn.btn-default, div#driver-popover-item .driver-popover-footer button.btn-default {
    background-color: #ffffff;
    color: #0019ff;
}

.btn.btn-default:hover, div#driver-popover-item .driver-popover-footer button.btn-default:hover, .btn.btn-default:active, div#driver-popover-item .driver-popover-footer button.btn-default:active {
    background: #2847e0;
    color: #ffffff;
}


 .btn.btn-default, div#driver-popover-item .driver-popover-footer button.btn-default {
    background-color: #2196f345;
    color: #000000;
}

.list-paging-area .btn-group .btn-paging.btn-info, .footnote-area .btn-group .btn-paging.btn-info {
    background-color: #2196f37d;
    color: #000aff;
    font-weight: var(--weight-medium);
}

.text-body, .text-muted, div#driver-popover-item .driver-popover-footer button.driver-close-btn {
    color: #0001da !important;
}

.level-item {
    font-weight: var(--weight-medium);
    color: #0001da;
    align-items: center;
    display: flex;
    flex-basis: auto;
    flex-grow: 0;
    flex-shrink: 0;
    justify-content: center;
}

.progress-bar-success {
    background-color: #3f62d5;
}

.page-head {
    z-index: 6;
    position: sticky;
    top: var(--navbar-height);
    background: #dedede82;
    margin-bottom: 5px;
    transition: .5s top;
}
.page-head,
.page-head .page-head-content{
    height: var(--page-head-height);
}
.page-head,
.page-head .page-head-content{
    top: var(--page-head-height);
}



/* Top Header */


.navbar {
    background: #494bff !important;
    height: var(--navbar-height);
}
.navbar-expand{
    background-color: #388ae5;
}
#navbar-breadcrumbs > li > a::before{
    font-family: FontAwesome;
    font-weight: normal;
    font-style: normal;
    text-decoration: inherit;
    -webkit-font-smoothing: antialiased;
    margin-right: .3em;
    display: inline-block;

    font-size: 24px;
    transition: 0.2s;
    position: relative;
    top: 3px;
    content: "\f105";
    margin-right: 10px;
    color: var(--white-color);
}
#navbar-breadcrumbs a{
    color: var(--white-color);
    text-decoration: none;
}
header .form-control{
    color:#48494d ;
}
header .form-control:focus{
    border: 0;
}
.search-bar .awesomplete input{
    height: 32px;
}
/*#navbar-search{
    width: 300px;
    background-color: rgb(65, 78, 90);
    border-radius: 0px;
    color: #f9f9f9;
    border: none;
}*/
header ul#navbar-breadcrumbs{
    margin-top: -8px;
}
header .form-control:focus{
    background-color: var(--white-color) !important;
}



/* Sidebar */
.layout-side-section .sidebar-label{
    color:rgb(36 143 240);
}
.sidebar-label svg,
.layout-side-section .sidebar-label .icon{
    stroke: var(--primary-color);
}
.list-sidebar-button{
    background-color: #c5c5c521 !important;
    box-shadow: none !important;
}
.list-sidebar-button:active,
.list-sidebar-button:focus{
    text-decoration: none !important;
    box-shadow: none !important;
}


/* Input Fields */
input{
    border-radius: 0 !important;
}

.form-control:focus{
    outline: 0;
    border: 1px solid var(--primary-color);
    box-shadow: none;
    background: rgba(234, 233, 238, 1) !important;
}
.navbar .navbar-nav a.nav-link{
    color: var(--white-color);
}

#navbar-breadcrumbs li.disabled a {
    color: #ffffff;
    pointer-events: none;
}
span.notifications-seen use,
symbol#icon-small-down{
    fill: var(--white-color);
}


/* Table */
.form-grid{
    border-radius: 0;
    border: 1px solid #bbbbbb;
}
.form-grid .grid-heading-row{
    background-color: #95d0ff;
}
.grid-heading-row{
    border-bottom: 1px solid #03A9F4;
    border-top: 1px solid #03A9F4;
   
}
.grid-row > .row .col{
    border-right: 1px solid #d1d8dd;
}

.grid-row > .row .col {
    border-right: 1px solid #478fc3;
    background: border-box;
    color: blue;
    font-weight: normal;
}




.grid-footer, .grid-custom-buttons {
    padding: var(--padding-sm) 0px;
    background-color: #23282f00;
}

/* Heading Color */
.head-title, .form-section .section-head, .form-dashboard-section .section-head, .comment-box .comment-input-header {
    color: #000000;
    font-weight: normal;
}

/* Lists */
.list-subject a{
    text-decoration: none;
    transition: 0.3s;
}
.list-subject a:hover{
    color: var(--secondary-color);
}


/* Report Table */
.datatable .dt-header .dt-cell--header .dt-cell__content{
    background-color: #f4f4f4;
}


/* Buttons CSS
.filter-button,
.sort-selector-button,
.btn-order{
    background-color: #ea7272 !important;
    color: var(--white-color) !important;
    transition: 0.3s;
    border-radius: 0 !important;
}
.filter-button:hover,
.sort-selector-button:hover,
.btn-order:hover{
    background-color: #c83b3b !important;
}
.filter-button span.filter-icon{
    color: var(--white-color);
}
.filter-button span.filter-icon svg.icon{
    stroke: var(--white-color);
    
} */
.ace_editor {
    min-height: 48px;
    background-color: #e4e4e470;
    color: #000000;
}
.ace_editor .ace_gutter {
    z-index: auto;
    background: #e4e4e470;
    color: #000000;
}


rect[Attributes Style] {
    x: 0;
    y: -8;
    height: 12;
    width: 12;
    rx: 3;
    fill: rgb(0, 178, 255);
}



.print-format {
    font-size: 13px;
    background: white;
}

.print-heading {
    border-bottom: 1px solid #f4f5f6;
    padding-bottom: 5px;
    margin-bottom: 10px;
}

.print-heading h2 {
    font-size: 24px;
}

.print-heading h2 div {
    font-weight: 600;
}

.print-heading small {
    font-size: 13px !important;
    font-weight: normal;
    line-height: 2.5;
    color: #4c5a67;
}

.print-format .letter-head {
    margin-bottom: 30px;
}

.print-format label {
    font-weight: normal;
    font-size: 13px;
    color: #4C5A67;
    margin-bottom: 0;
}

.print-format .data-field {
    margin-top: 0;
    margin-bottom: 0;
}

.print-format .value {
    color: #192734;
    line-height: 1.8;
}

.print-format .section-break:not(:last-child) {
    margin-bottom: 0;
}

.print-format .row:not(.section-break) {
    line-height: 1.6;
    margin-top: 15px !important;
}

.print-format .important .value {
    font-size: 13px;
    font-weight: 600;
}

.print-format th {
    color: #74808b;
    font-weight: normal;
    border-bottom-width: 1px !important;
}

.print-format .table-bordered td, .print-format .table-bordered th {
    border: 1px solid #f4f5f6;
}

.print-format .table-bordered {
    border: 1px solid #f4f5f6;
}

.print-format td, .print-format th {
    padding: 10px !important;
}

.print-format .primary.compact-item {
    font-weight: normal;
}

.print-format table td .value {
    font-size: 12px;
    line-height: 1.8;
}
@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@500&display=swap" rel="stylesheet');
body {
  font-family: 'Cairo'
}