ꦫꦣꦺꦤ꧀ꦄꦤ꧀ꦠꦱꦺꦤ

PATH: home / lab2454c / vaultchip.com / vendor / botble / platform / base / resources / assets / sass / base / themes

// Theme Colors Settings

// Main settings
$theme-name: 'grey';
$brand-main-color: #31c7b2 !default;
$brand-main-font-color: #ffffff !default;

// Body and header
$bg-color: darken(#697380, 5%) !default;
$header-bg-color: lighten(#444d59, 5%) !default;
$header-toggler-color: lighten($header-bg-color, 50%) !default;
$header-toggler-bg-color: darken($bg-color, 5%) !default;

// Top menu
$header-top-menu-bg-hover-color: lighten($header-bg-color, 10%) !default;
$header-top-menu-bg-hover-color-on-dropdown-open: lighten($header-bg-color, 10%) !default;
$header-top-menu-badge-bg-color: $brand-main-color;
$header-top-menu-badge-font-color: #ffffff;
$header-top-menu-icon-font-color: #9fa7b1 !default;

// Top menu user bar
$header-top-menu-user-font-color: lighten($header-bg-color, 50%) !default;
$header-top-menu-user-bg-color: darken($header-bg-color, 4%) !default;

//begin: Top Menu Extended Dropdowns
$header-top-menu-extended-dropdown-item-bg-color-on-hover: #f8f9fa;
$header-top-menu-extended-dropdown-item-border-color: #eff2f6;
$header-top-menu-extended-dropdown-item-font-color: #888888;

$header-top-menu-extended-dropdown-header-bg-color: darken(#f7f8fa, 4%);
$header-top-menu-extended-dropdown-border-color: darken($header-top-menu-extended-dropdown-header-bg-color, 1%);
$header-top-menu-extended-dropdown-header-font-color: darken(#6f949c, 5%);

$header-top-menu-inbox-dropdown-from-font-color: #5b9bd1;

$header-top-menu-task-dropdown-progress-bg-color: #dfe2e9;

$header-top-menu-notification-time-bg-color: lighten(#eeeeee, 1%);

// Top Menu Notifications
$header-top-menu-dropdown-dark-bg-color: lighten($header-bg-color, 10%);
$header-top-menu-dropdown-dark-header-bg-color: lighten($header-bg-color, 2%);
$header-top-menu-dropdown-dark-header-font-color: lighten($header-top-menu-dropdown-dark-header-bg-color, 50%);

$header-top-menu-dropdown-dark-item-font-color: lighten($header-top-menu-dropdown-dark-header-bg-color, 55%);
$header-top-menu-dropdown-dark-item-border-color: lighten($header-top-menu-dropdown-dark-bg-color, 6%);
$header-top-menu-dropdown-dark-item-icon-color: lighten($header-top-menu-dropdown-dark-header-bg-color, 45%);
$header-top-menu-dropdown-dark-item-bg-color-on-hover: lighten($header-top-menu-dropdown-dark-bg-color, 4%);

$header-top-menu-dropdown-dark-default-menu-divider: $header-top-menu-dropdown-dark-item-border-color;
$header-top-menu-dropdown-dark-notification-time-bg-color: darken($header-top-menu-dropdown-dark-bg-color, 5%);
//end: Top Menu Extended Dropdowns

// Sidebar menu
$sidebar-menu-deliver-border-color: lighten($bg-color, 5%) !default;

$sidebar-menu-link-font-color: #efefef !default;
$sidebar-menu-link-font-color-on-hover: $sidebar-menu-link-font-color !default;
$sidebar-menu-link-font-color-on-active: #ffffff !default;

$sidebar-menu-link-icon-font-color: #aab3bb !default;
$sidebar-menu-link-icon-font-color-on-active: $sidebar-menu-link-font-color-on-active !default;
$sidebar-menu-link-icon-font-color-on-hover: $sidebar-menu-link-icon-font-color !default;

$sidebar-menu-link-bg-color-on-hover: lighten($header-bg-color, 2%) !default;
$sidebar-menu-link-bg-color-on-active: $brand-main-color;

$sidebar-menu-arrow-color: $sidebar-menu-link-icon-font-color !default;
$sidebar-menu-arrow-color-on-active: $sidebar-menu-link-font-color-on-active !default;
$sidebar-menu-arrow-color-on-hover: $sidebar-menu-link-icon-font-color-on-hover !default;

$sidebar-menu-sub-menu-box-shadow-color: $sidebar-menu-link-bg-color-on-hover !default;
$sidebar-menu-sub-menu-link-font-color: #eeeeee !default;
$sidebar-menu-sub-menu-link-icon-font-color: $sidebar-menu-arrow-color !default;
$sidebar-menu-sub-menu-link-bg-color-on-hover: lighten($header-bg-color, 3%) !default;
$sidebar-menu-sub-menu-link-icon-font-color-on-hover: $sidebar-menu-link-icon-font-color-on-hover !default;

$sidebar-menu-hover-sub-menu-bg-color: lighten($sidebar-menu-link-bg-color-on-hover, 4%) !default;

// Sidebar for mobile
$mobile-sidebar-menu-bg-color: darken($bg-color, 10%) !default;
$mobile-sidebar-menu-link-bg-color-on-hover: darken($bg-color, 7%) !default;

// Light sidebar menu
$light-sidebar-menu-link-border-color: #5d636b !default;
$light-sidebar-menu-link-bg-color-on-hover: darken($bg-color, 4%) !default;
$light-sidebar-menu-link-bg-color-on-active: darken($bg-color, 7%) !default;
$light-sidebar-menu-link-font-color-on-active: #f1f1f1 !default;
$light-sidebar-menu-link-icon-color-on-active: #eeeeee !default;
$light-sidebar-menu-link-arrow-color-on-active: #eeeeee !default;

$light-sidebar-menu-sub-menu-bg-color: lighten($bg-color, 2%) !default;
$light-sidebar-menu-sub-menu-link-bg-color-on-hover: darken($bg-color, 2%) !default;

$mobile-light-sidebar-menu-sub-menu-bg-color: $mobile-sidebar-menu-bg-color !default;
$mobile-light-sidebar-menu-link-bg-color-on-hover: lighten($mobile-sidebar-menu-bg-color, 3%) !default;
$mobile-light-sidebar-menu-link-bg-color-on-active: lighten($mobile-sidebar-menu-bg-color, 3%) !default;
$mobile-light-sidebar-menu-sub-menu-link-bg-color-on-hover: lighten($mobile-sidebar-menu-bg-color, 3%) !default;

// Footer
$footer-default-font-color: lighten($bg-color, 40%) !default;
$footer-default-go-top-bg-color: lighten($bg-color, 7%) !default;
$footer-default-go-top-icon-font-color: lighten($bg-color, 30%) !default;
$footer-fixed-bg-color: darken($bg-color, 7%) !default;

@import '../base';

/* Page sidebar */

.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover,
.page-sidebar {
    .page-sidebar-menu {
        /* Change sidebar link font weight */
        li {
            > a {
                font-weight: 300;

> i {
                    font-weight: 900;
                }
            }

.sub-menu {
                li {
                    > a {
                        font-weight: 300;

> i {
                            font-weight: 900;
                        }
                    }
                }
            }
        }
    }
}

[-] default.scss [edit]
[-] blue.scss [edit]
[+] ..
[-] darkblue.scss [edit]
[-] grey.scss [edit]
[-] light.scss [edit]