Blame | Last modification | View Log | Download | RSS feed
//## Base theme color file/***********Page Header***********//* Header search bar, toggler button & top menu */.page-header.navbar {background-color: $header-bg-color;/* Top notification menu/bar */.top-menu {.navbar-nav {> li.dropdown {.dropdown-toggle {> i {color: $header-top-menu-icon-font-color;}.badge.badge-default {background-color: $header-top-menu-badge-bg-color;color: $header-top-menu-badge-font-color;}&:hover {background-color: $header-top-menu-bg-hover-color;> i {color: lighten($header-top-menu-icon-font-color, 15%);}}}&.open {.dropdown-toggle {background-color: $header-top-menu-bg-hover-color-on-dropdown-open;> i {color: lighten($header-top-menu-icon-font-color, 15%);}}}}/* Extended Dropdowns */> li.dropdown-extended {.dropdown-menu {border-color: $header-top-menu-extended-dropdown-border-color;&:after {border-bottom-color: $header-top-menu-extended-dropdown-header-bg-color;}> li.external {background: $header-top-menu-extended-dropdown-header-bg-color;> h3 {color: $header-top-menu-extended-dropdown-header-font-color;}> a {color: $link-color;&:hover {color: $link-hover-color;text-decoration: none;}}}.dropdown-menu-list {> li {> a {border-bottom: 1px solid $header-top-menu-extended-dropdown-item-border-color !important;color: $header-top-menu-extended-dropdown-item-font-color;&:hover {background: $header-top-menu-extended-dropdown-item-bg-color-on-hover;}}}}}}/* Notification */> li.dropdown-notification {.dropdown-menu {.dropdown-menu-list {> li {> a {.time {background: $header-top-menu-notification-time-bg-color;}&:hover {.time {background: darken($header-top-menu-notification-time-bg-color, 5%);}}}}}}}/* Inbox */> li.dropdown-inbox {> .dropdown-toggle {> .circle {background-color: $brand-main-color;color: $brand-main-font-color;}> .corner {border-color: transparent transparent transparent $brand-main-color;}}.dropdown-menu {.dropdown-menu-list {.subject {.from {color: $header-top-menu-inbox-dropdown-from-font-color;}}}}}/* Tasks */> li.dropdown-tasks {.dropdown-menu {.dropdown-menu-list {.progress {background-color: $header-top-menu-task-dropdown-progress-bg-color;}}}}/* User */> li.dropdown-user {> .dropdown-toggle {> .username {color: $header-top-menu-user-font-color;}> i {color: $header-top-menu-user-font-color;}}> .dropdown-menu {width: 195px;}}/* Language */> li.dropdown-language {> .dropdown-toggle {> .langname {color: $header-top-menu-user-font-color;}}}/* Dark version */> li.dropdown-dark {.dropdown-menu {background: $header-top-menu-dropdown-dark-bg-color;border: 0;&:after {border-bottom-color: $header-top-menu-dropdown-dark-bg-color;}> li.external {background: $header-top-menu-dropdown-dark-header-bg-color;> h3 {color: $header-top-menu-dropdown-dark-header-font-color;}> a {&:hover {color: lighten($link-color, 11%);}}}&.dropdown-menu-default,.dropdown-menu-list {> li {a {color: $header-top-menu-dropdown-dark-item-font-color;border-bottom: 1px solid $header-top-menu-dropdown-dark-item-border-color !important;> i {color: $header-top-menu-dropdown-dark-item-icon-color;}&:hover {background: $header-top-menu-dropdown-dark-item-bg-color-on-hover;}}}}&.dropdown-menu-default {> li {a {border-bottom: 0 !important;}&.divider {background: $header-top-menu-dropdown-dark-default-menu-divider;}}}}}> li.dropdown-notification.dropdown-dark {.dropdown-menu {.dropdown-menu-list {> li {> a {.time {background: $header-top-menu-dropdown-dark-notification-time-bg-color;}&:hover {.time {background: darken($header-top-menu-dropdown-dark-notification-time-bg-color, 5%);}}}}}}}}}/* Header seaech box */.search-form {background: $header-search-bg-color;&:hover {background: $header-search-bg-hover-color;}.input-group {.form-control {color: $header-search-font-color;@include placeholder($header-search-placeholder-font-color);}.input-group-btn {.btn.submit {> i {color: $header-search-font-color;}}}}&.open {background: $header-search-bg-color-on-open;}}/* Toggler button for sidebar expand/collapse and responsive sidebar menu */.menu-toggler {background-image: url(../../img/sidebar_toggler_icon_#{$theme-name}.png);}}/* Default Horizontal Menu */.page-header.navbar {/* Default Mega Menu */.hor-menu {.navbar-nav {/* Mega menu content */> li.mega-menu-dropdown {> .dropdown-menu {box-shadow: $header-hor-menu-box-shadow;.mega-menu-content {.mega-menu-submenu {li {> h3 {color: $header-hor-menu-mega-menu-header-font-color;}}}}}}/* Classic menu */> li {> a {color: $header-hor-menu-default-link-font-color;> i {color: $header-hor-menu-default-link-icon-color;}}&.open > a,> a:hover {color: $header-hor-menu-default-link-font-color-on-hover ;background: $header-hor-menu-default-link-bg-color-on-hover !important;> i {color: $header-hor-menu-default-link-icon-color-on-hover;}}&.active,&.current {> a,> a {color: $header-hor-menu-default-link-font-color-on-active;background: $header-hor-menu-default-link-bg-color-on-active !important;> i {color: $header-hor-menu-default-link-icon-color;}}.selected {border-top: 6px solid $header-hor-menu-default-link-bg-color-on-active;}}.dropdown-menu {box-shadow: $header-hor-menu-box-shadow;background: $header-hor-menu-dropdown-menu-bg-color;li {> a {color: $header-hor-menu-dropdown-menu-link-font-color;> i {color: $header-hor-menu-dropdown-menu-link-icon-color;}}&:hover {> a {color: $header-hor-menu-dropdown-menu-link-font-color-on-hover;background: $header-hor-menu-dropdown-menu-link-bg-color-on-hover;> i {color: $header-hor-menu-dropdown-menu-link-icon-color-on-hover;}}}&.active,&.current {> a,> a:hover {color: $header-hor-menu-dropdown-menu-link-font-color-on-active;background: $header-hor-menu-dropdown-menu-link-bg-color-on-active;> i {color: $header-hor-menu-dropdown-menu-link-icon-color-on-active;}}}&.divider {background-color: lighten($header-hor-menu-dropdown-menu-bg-color, 5%);}}}.dropdown-submenu {> a:after {color: $header-hor-menu-dropdown-menu-link-icon-color;}}}}}/* Light Mega Menu */.hor-menu.hor-menu-light {.navbar-nav {/* Mega menu content */> li.mega-menu-dropdown {> .dropdown-menu {box-shadow: $header-light-hor-menu-box-shadow;.mega-menu-content {.mega-menu-submenu {li {> h3 {color: $header-light-hor-menu-mega-menu-header-font-color;}}}}}}/* Classic menu */> li {> a {color: $header-light-hor-menu-default-link-font-color;> i {color: $header-light-hor-menu-default-link-icon-color;}}> a:hover {color: $header-light-hor-menu-default-link-font-color-on-hover;background: $header-light-hor-menu-default-link-bg-color-on-hover;> i {color: $header-light-hor-menu-default-link-icon-color-on-hover;}}&.open > a {color: $header-light-hor-menu-default-link-font-color-on-onen !important;background: $header-light-hor-menu-default-link-bg-color-on-onen !important;> i {color: $header-light-hor-menu-default-link-icon-color-on-onen !important;}}&.active,&.current {> a,> a:hover {color: $header-light-hor-menu-default-link-font-color-on-active;background: $header-light-hor-menu-default-link-bg-color-on-active;> i {color: $header-light-hor-menu-default-link-icon-color;}}}.dropdown-menu {box-shadow: $header-light-hor-menu-box-shadow;background: $header-light-hor-menu-dropdown-menu-bg-color;li {> a {color: $header-light-hor-menu-dropdown-menu-link-font-color;> i {color: $header-light-hor-menu-dropdown-menu-link-icon-color;}}&:hover {> a {color: $header-light-hor-menu-dropdown-menu-link-font-color-on-hover;background: $header-light-hor-menu-dropdown-menu-link-bg-color-on-hover;> i {color: $header-light-hor-menu-dropdown-menu-link-icon-color-on-hover;}}}&.active,&.current {> a,> a:hover {color: $header-light-hor-menu-dropdown-menu-link-font-color-on-active;background: $header-light-hor-menu-dropdown-menu-link-bg-color-on-active;> i {color: $header-light-hor-menu-dropdown-menu-link-icon-color-on-active;}}}&.divider {background-color: darken($header-light-hor-menu-dropdown-menu-bg-color, 4%);}}}.dropdown-menu {border: 1px solid darken($header-light-hor-menu-default-link-bg-color-on-onen, 5%);}> .dropdown-menu {border-top: 0;}}}}}/* Page sidebar */.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover,.page-sidebar {background-color: $bg-color;/* Default sidebar */.page-sidebar-menu {/* 1st level links */> li {> a {border-top: 1px solid $sidebar-menu-devider-border-color;color: $sidebar-menu-link-font-color;> i {color: $sidebar-menu-link-icon-font-color;}> i[class^="icon-"],> i[class*="icon-"] {@if $theme-name == "light" {color: darken($sidebar-menu-link-icon-font-color, 15%);} @else if $theme-name == "light2" {color: darken($sidebar-menu-link-icon-font-color, 15%);} @else {color: lighten($sidebar-menu-link-icon-font-color, 5%);}}> .arrow {&:before,&.open:before {color: $sidebar-menu-arrow-color;}}}&.heading {> h3 {color: darken($sidebar-menu-link-font-color, 23%);}}&:hover,&.open {> a {background: $sidebar-menu-link-bg-color-on-hover;color: $sidebar-menu-link-font-color-on-hover;> i {color: $sidebar-menu-link-icon-font-color-on-hover;}> .arrow {&:before,&.open:before {color: $sidebar-menu-arrow-color-on-hover;}}}}&.active,&.active.open {> a {background: $sidebar-menu-link-bg-color-on-active;border-top-color: transparent;color: $sidebar-menu-link-font-color-on-active;&:hover {background: $sidebar-menu-link-bg-color-on-active;}> i {color: $sidebar-menu-link-icon-font-color-on-active;}> .arrow {&:before,&.open:before {color: $sidebar-menu-arrow-color-on-active;}}}}&.active + li {> a {border-top-color: transparent;}}&.active.open + li {> a {border-top-color: $sidebar-menu-devider-border-color;}}&:last-child {> a {border-bottom: 1px solid transparent !important;}}}/* All links */li {> a {> .arrow {&:before,&.open:before {color: $sidebar-menu-arrow-color;}}}&:hover {> a {> .arrow {&:before,&.open:before {color: $sidebar-menu-arrow-color-on-hover;}}}}&.active {> a {> .arrow {&:before,&.open:before {color: $sidebar-menu-arrow-color-on-active;}}}}}.page-sidebar-closed &:hover {.sub-menu {background-color: $bg-color;}}.sub-menu {> li {> a {color: $sidebar-menu-sub-menu-link-font-color;> i {color: $sidebar-menu-sub-menu-link-icon-font-color;}> i[class^="icon-"],> i[class*="icon-"] {@if $theme-name == "light" {color: darken($sidebar-menu-link-icon-font-color, 15%);} @else if $theme-name == "light2" {color: darken($sidebar-menu-link-icon-font-color, 15%);} @else {color: lighten($sidebar-menu-link-icon-font-color, 5%);}}> .arrow {&:before,&.open:before {color: $sidebar-menu-arrow-color;}}}&:hover,&.open,&.active {> a {background: $sidebar-menu-sub-menu-link-bg-color-on-hover !important;> i {color: $sidebar-menu-sub-menu-link-icon-font-color-on-hover;@if $theme-name == "light" {color: darken($sidebar-menu-link-icon-font-color, 15%);} @else if $theme-name == "light2" {color: darken($sidebar-menu-link-icon-font-color, 15%);} @else {color: lighten($sidebar-menu-link-icon-font-color, 20%);}}> .arrow {&:before,&.open:before {color: $sidebar-menu-arrow-color-on-hover;}}}}}}}/* light sidebar */.page-sidebar-menu.page-sidebar-menu-light {/* 1st level links */> li {&:hover,&.open {> a {background: $light-sidebar-menu-link-bg-color-on-hover;}}&.active,&.active.open {> a {background: $light-sidebar-menu-link-bg-color-on-active;border-left: 4px solid $light-sidebar-menu-link-border-color;color: $light-sidebar-menu-link-font-color-on-active;&:hover {border-left: 4px solid $sidebar-menu-link-bg-color-on-active;background: $light-sidebar-menu-link-bg-color-on-hover;}> i {color: $light-sidebar-menu-link-icon-color-on-active;}> .arrow {&:before,&.open:before {color: $light-sidebar-menu-link-arrow-color-on-active;}}}}.sub-menu {background: $light-sidebar-menu-sub-menu-bg-color;> li {&:hover,&.open,&.active {> a {background: $light-sidebar-menu-sub-menu-link-bg-color-on-hover !important;}}}}}}.sidebar-toggler {background: url(../../img/sidebar_inline_toggler_icon_#{$theme-name}.jpg);}/* Sidebar search */.sidebar-search {.input-group {border-bottom: 1px solid $sidebar-search-bottom-border-color;.form-control {background-color: $bg-color;color: $sidebar-search-input-font-color;@include placeholder($sidebar-search-input-placeholder-font-color);}.input-group-btn {.btn {> i {color: $sidebar-search-input-font-color;}}}}&.sidebar-search-bordered {.input-group {border: 1px solid $sidebar-search-full-border-color;}}.page-sidebar-closed &.open {.input-group {background-color: $bg-color;}.remove {> i {color: $sidebar-search-input-font-color;}}}&.sidebar-search-solid {.page-sidebar-closed & {.input-group {background: none;}}.input-group {border: 1px solid $sidebar-search-bg-color;background: $sidebar-search-bg-color;.form-control {background: $sidebar-search-bg-color;}}&.open .input-group {border: 1px solid $bg-color;background: $bg-color;.form-control {background: $bg-color;}}}}}.page-sidebar-reversed {.page-sidebar-menu.page-sidebar-menu-light {/* 1st level links */> li {&.active,&.active.open {> a {border-left: 0;border-right: 4px solid $light-sidebar-menu-link-border-color;&:hover {border-left: 0;border-right: 4px solid $sidebar-menu-link-bg-color-on-active;}}}}}}/*************Quick Sidebar*************//***Quick Sidebar Layout***/.page-quick-sidebar-wrapper {background: $quick-sidebar-bg-color;.page-quick-sidebar {background: $quick-sidebar-bg-color;}}/***Quick Sidebar Toggler***/.page-quick-sidebar-toggler {background: lighten($quick-sidebar-bg-color, 10%);&:hover {background: darken(lighten($quick-sidebar-bg-color, 10%), 3%);}> i {color: lighten($quick-sidebar-font-color, 10%);}}/***Quick Sidebar Content***/.page-quick-sidebar-wrapper {color: lighten($quick-sidebar-font-color, 10%);.page-quick-sidebar {/* Quick sidebar tabs */.nav-justified {> li {> a {color: lighten($quick-sidebar-font-color, 7%);background: lighten($quick-sidebar-bg-color, 10%);&:hover {background: lighten($quick-sidebar-bg-color, 5%);}}&.open {> a {color: lighten($quick-sidebar-font-color, 7%);background: lighten($quick-sidebar-bg-color, 10%);}}&.active {> a {border: 0;background:$quick-sidebar-bg-color;}}.dropdown-menu {border: 0;background: lighten($quick-sidebar-bg-color, 10%);box-shadow: 5px 5px rgba(lighten($quick-sidebar-bg-color, 30%), 0.1);&:before {border-bottom: 7px solid lighten($quick-sidebar-bg-color, 10%);}&:after {border-bottom: 7px solid lighten($quick-sidebar-bg-color, 10%);}> li {> a {color: lighten($quick-sidebar-font-color, 10%);> i {color: lighten($quick-sidebar-font-color, 8%);}&:hover {background: lighten($quick-sidebar-bg-color, 13%);color: lighten($quick-sidebar-font-color, 10%);> i {color: lighten($quick-sidebar-font-color, 11%);}}}&.active {> a {background: lighten($quick-sidebar-bg-color, 11%);color: lighten($quick-sidebar-font-color, 10%);}}&.divider {background-color: lighten($quick-sidebar-bg-color, 13%);}}}}}/* Quick sidebar general list heading */.list-heading {color: darken($quick-sidebar-font-color, 5%);}/* Quick sidebar general list-items */.list-items {margin: 0;padding: 0;list-style: none;> li {border-bottom-color: lighten($quick-sidebar-bg-color, 3%);&:hover {background: lighten($quick-sidebar-bg-color, 3%);}}}}.page-quick-sidebar-item {/* back to list */.page-quick-sidebar-nav {.page-quick-sidebar-back-to-list {color: lighten($quick-sidebar-font-color, 7%);}}}/* Quick sidebar chat */.page-quick-sidebar-chat {// chat users.page-quick-sidebar-chat-users {.media-list {.media {.media-body {.media-heading-sub {color: darken($quick-sidebar-font-color, 8%);}.media-heading-small {color: darken($quick-sidebar-font-color, 12%);}}}}}// user chat.page-quick-sidebar-chat-user {.page-quick-sidebar-chat-user-messages {.post {.name {color: lighten($quick-sidebar-font-color, 3%);}.datetime {color: lighten($quick-sidebar-font-color, 3%);}.message {color: lighten($quick-sidebar-font-color, 7%);background: lighten($quick-sidebar-bg-color, 10%);}&.in {.message {.arrow {border-right-color: lighten($quick-sidebar-bg-color, 10%);}}}&.out {.message {.arrow {border-left-color: lighten($quick-sidebar-bg-color, 10%);}}}}}}}/* Quick sidebar alerts */.page-quick-sidebar-alerts {.page-quick-sidebar-alerts-list {.feeds {li {a {color: lighten($quick-sidebar-font-color, 1%);.desc {text-decoration: underline;}}.desc {color: darken($quick-sidebar-font-color, 1%);}.date {color: darken($quick-sidebar-font-color, 12%);}}}}}}/******Page Footer******/.page-footer {.page-footer-inner {color: $footer-default-font-color;}.page-footer-fixed & {background-color: $footer-fixed-bg-color;}}@media (min-width: $screen-md-min) { /* 992px *//* Sidebar menu closed */.page-sidebar-menu.page-sidebar-menu-hover-submenu {> li:hover {> .sub-menu {box-shadow: 5px 5px rgba($sidebar-menu-sub-menu-box-shadow-color, 0.2);&.sidebar-toggler-wrapper,&.sidebar-search-wrapper {box-shadow: none;}}}}.page-sidebar-menu.page-sidebar-menu-closed {> li:hover {box-shadow: 5px 5px rgba($sidebar-menu-sub-menu-box-shadow-color, 0.2);&.sidebar-toggler-wrapper,&.sidebar-search-wrapper {box-shadow: none;}> .sub-menu {box-shadow: 5px 5px rgba($sidebar-menu-sub-menu-box-shadow-color, 0.2);&.sidebar-toggler-wrapper,&.sidebar-search-wrapper {box-shadow: none;}}}}/* Light sidebar menu */.page-sidebar-menu.page-sidebar-menu-light.page-sidebar-menu-closed {> li.heading {padding: 0;margin-top: 15px;margin-bottom: 15px;border-top: 1px solid $sidebar-menu-devider-border-color !important;}}/* Fixed Sidebar */.page-sidebar-fixed:not(.page-footer-fixed) {.page-content {border-bottom: 0;}.page-footer {background-color: #fff;.page-footer-inner {color: #333;}}}/* Boxed Layout */.page-boxed {background-color: $for-min-992px-page-boxed-bg-color !important;/* Page container */.page-container {background-color: $bg-color;border-left: 1px solid $for-min-992px-page-boxed-page-container-bg-color;border-bottom: 1px solid $for-min-992px-page-boxed-page-container-bg-color;}&.page-sidebar-reversed {.page-container {border-left: 0;border-right: 1px solid $for-min-992px-page-boxed-page-container-bg-color;}}&.page-sidebar-fixed {.page-container {border-left: 0;border-bottom: 0;}}&.page-sidebar-reversed.page-sidebar-fixed {.page-container {border-left: 0;border-right: 0;border-bottom: 0;}}/* Page sidebar */&.page-sidebar-fixed {.page-sidebar {border-left: 1px solid $for-min-992px-page-boxed-sidebar-fixed-border-color;}}&.page-sidebar-reversed.page-sidebar-fixed {.page-sidebar {border-right: 1px solid $for-min-992px-page-boxed-sidebar-fixed-border-color;border-left: 0;}}/* Page footer */&.page-sidebar-fixed.page-footer-fixed {.page-footer {background-color: $for-min-992px-page-boxed-bg-color !important;.page-footer-inner {color: $footer-default-font-color;}}}}/* Sidebar Menu Wirh Hoverable Submenu */.page-sidebar-menu-hover-submenu {li {&:hover {a {> .arrow {border-right:8px solid $sidebar-menu-hover-sub-menu-bg-color;.page-sidebar-reversed & {border-left:8px solid $sidebar-menu-hover-sub-menu-bg-color;}}}> .sub-menu {background: $sidebar-menu-hover-sub-menu-bg-color !important;}}}}}@media (max-width: $screen-sm-max) { /* 991px *//* Page sidebar */.page-sidebar {background-color: $mobile-sidebar-menu-bg-color;.page-sidebar-menu {> li {> a {border-top: 1px solid $bg-color;}&:hover,&.open {> a {background: $mobile-sidebar-menu-link-bg-color-on-hover;}}&:last-child {> a {border-bottom: 0 !important;}}.sub-menu {background-color: $mobile-sidebar-menu-bg-color !important;}}.sidebar-search {input {background-color: $mobile-sidebar-menu-bg-color !important;}}}/* light sidebar */.page-sidebar-menu.page-sidebar-menu-light {/* 1st level links */> li {&:hover,&.open {> a {background: $mobile-light-sidebar-menu-link-bg-color-on-hover;}}&.active,&.active.open {> a {background: $mobile-light-sidebar-menu-link-bg-color-on-active;&:hover {background: $mobile-light-sidebar-menu-link-bg-color-on-active;}}}.sub-menu {background: $mobile-light-sidebar-menu-sub-menu-bg-color !important;> li {&:hover,&.open,&.active {> a {background: $mobile-light-sidebar-menu-sub-menu-link-bg-color-on-hover !important;}}}}}}}}@media (max-width: $screen-xs-min) { /* 480px */.page-header.navbar {/* Top menu */.top-menu {background-color: $bg-color;.page-header-fixed-mobile & {background-color: $header-bg-color;}.navbar-nav {> li.dropdown-user {.dropdown-toggle {background-color: lighten($header-top-menu-bg-hover-color, 1%);.page-header-fixed-mobile & {background: none;}&:hover {background-color: $header-top-menu-bg-hover-color;}}}}}}}/****Boby****/body {background-color: $bg-color;}/****CSS3 Spinner Bar****/.page-spinner-bar > div,.block-spinner-bar > div {background: lighten($brand-main-color, 5%);}