/* Set vars */
:root {
--sky-dashboard-picture-height: 250px; /* var(--sky-dashboard-picture-height) */
--sky-dashboard-picture-height-mobile: 200px;
--sky-page-radius: 7px; /* var(--sky-page-radius) */
--sky-background-color: #C7C9B8; /* var(--sky-background-color) */
--sky-page-color: #D8D9CD; /* var(--sky-page-color) */
--sky-page-color-2nd: #D1D2C6; /* var(--sky-page-color-2nd) */
--sky-page-color-3rd: #D8D9CD; /* var(--sky-page-color-3rd) */
--sky-text-color: #333333; /* var(--sky-text-color) */
--sky-text-color-link: #751212; /* var(--sky-text-color-link) */
--sky-text-color-active: #AD2020; /* var(--sky-text-color-active) */
--sky-text-color-muted: #888888; /* var(--sky-text-color-muted) */
--sky-sidebar-background-color: #172028; /* var(--sky-sidebar-background-color) */
--sky-sidebar-text-color: #DDDDDD; /* var(--sky-sidebar-text-color) */
--sky-topbar-background-color: #484942; /* var(--sky-topbar-background-color) */
--sky-topbar-text-color: #DDDDDD; /* var(--sky-topbar-text-color) */
--sky-button-background-color: #484942; /* var(--sky-button-background-color) */
--sky-button-border-color: #484942; /* var(--sky-button-border-color) */
--sky-button-text-color: #DDDDDD; /* var(--sky-button-text-color) */
--sky-icon-background-color: #666; /* var(--sky-icon-background-color) */
--sky-icon-color: #d2d6de; /* var(--sky-icon-color) */
--sky-line-color: #333333; /* var(--sky-line-color) */
--sky-header-color: #333333; /* var(--sky-header-color) */
}
/* new hover style */
.table-hover > tbody > tr:hover, .table > tbody > tr.active > td,
.table > tbody > tr.active > th, .table > tbody > tr > td.active,
.table > tbody > tr > th.active, .table > tfoot > tr.active > td,
.table > tfoot > tr.active > th, .table > tfoot > tr > td.active,
.table > tfoot > tr > th.active, .table > thead > tr.active > td,
.table > thead > tr.active > th, .table > thead > tr > td.active,
.table > thead > tr > th.active,
.nav > li > a:active, .nav > li > a:focus, .nav > li > a:hover {
color: var(--sky-text-color-link);
background: inherit;
background-color: rgba(255, 255, 255, 0.2);
border-radius: var(--sky-page-radius);
}
.nav-stacked > li.active > a, .nav-stacked > li.active > a:hover {
background: transparent;
color: var(--sky-text-color-link);
}
/* selected tab */
.nav-tabs-custom > .nav-tabs > li.active,
.nav-stacked > li.active > a, .nav-stacked > li.active > a:hover {
border: none;
}
/******* MAIN THEME & COLORS *******/
a {
color: var(--sky-text-color-link);
}
a:active, a:focus, a:hover {
color: var(--sky-text-color-active);
}
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
color: var(--sky-header-color);
}
.help-block,
.text-muted {
color: var(--sky-text-color-muted);
}
body {
color: var(--sky-text-color);
}
.content-wrapper,
.main-footer,
body {
background-color: var(--sky-background-color);
}
hr {
border-top: 1px solid var(--sky-sidebar-background-color);
}
/* lable counters */
.label-default {
background-color: inherit;
color: inherit;
}
/* fix background */
.list-group-item {
background-color: transparent;
border: none;
}
.box-footer,
.table-striped > tbody > tr:nth-of-type(odd),
.panel-default > .panel-heading {
background-color: var(--sky-page-color);
}
/* remov unwanted borders */
.table > tbody > tr > td, .table > tbody > tr > th,
.table > tfoot > tr > td, .table > tfoot > tr > th,
.table > thead > tr > td, .table > thead > tr > th,
.box-footer {
border: none;
}
.page-header,
.box .nav-stacked > li,
.box-header.with-border {
border-bottom: none;
}
/*** MAIN NAVIGATION ***/
/* background */
.main-sidebar .sidebar,
.skin-black .left-side,
.skin-black .main-sidebar,
.skin-black .wrapper {
background-color: var(--sky-sidebar-background-color);
}
section.sidebar-campaign {
background: linear-gradient(180deg,rgba(51,51,51,0),var(--sky-sidebar-background-color));
}
.main-sidebar .sidebar li .sidebar-text,
.main-sidebar .sidebar li a {
color: var(--sky-sidebar-text-color);
}
/******* TOPBAR ********/
.skin-black .main-header .navbar {
background-color: var(--sky-topbar-background-color);
}
.skin-black .main-header .navbar .navbar-custom-menu .navbar-nav > li > a,
.skin-black .main-header .navbar .navbar-right > li > a,
.skin-black .main-header .navbar .sidebar-toggle {
color: var(--sky-topbar-text-color);
}
.skin-black .main-header .navbar .navbar-custom-menu .navbar-nav > li > a:hover,
.skin-black .main-header .navbar .navbar-right > li > a:hover,
.skin-black .main-header .navbar .sidebar-toggle:hover {
color: var(--sky-text-color);
background-color: var(--sky-topbar-text-color);
border-radius: 4px;
}
.skin-black .main-header .navbar .nav > li > a {
color: var(--sky-text-color);
}
.calendar tbody td .colour-pallet {
color: var(--sky-sidebar-text-color);
}
.calendar tbody td.today {
background-color: var(--sky-page-color-2nd);
border-radius: 2px;
}
.navbar-nav > .user-menu .user-image {
filter: invert(100%);
}
/* clean up the search window */
.form-control {
border-radius: 5px;
height: 30px;
}
.form-control:focus {
border-color: var(--sky-text-color-link);
}
/* buttons */
.btn-default,
.input-group .input-group-addon {
background-color: var(--sky-button-background-color);
border-color: var(--sky-button-border-color);
color: var(--sky-button-text-color);
}
/******* FRAMES *******/
/* picture */
.entity-header .entity-image {
width: 100%;
height: auto;
margin: 5px;
border: transparent;
box-sizing: border-box;
border-radius: 7px;
box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
/* content (glass) */
#cy,
.nav-tabs-custom > .tab-content,
.box,
.panel,
.timeline-item,
.timeline > li > .timeline-item {
border-radius: var(--sky-page-radius);
border-bottom: 1px solid;
background-color: var(--sky-page-color);
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
border-bottom: 1px solid;
border-bottom-color: rgba(255, 255, 255, 0.2);
}
/* nav tabs (glass)*/
.entity-form ul.nav li {
background-color: inherit;
margin-right: 2px;
}
.nav-tabs {
border-bottom: none;
margin-left: 40px;
}
.nav-tabs-custom > .nav-tabs > li > a {
border-radius: var(--sky-page-radius) var(--sky-page-radius) 0px 0px;
background-color: var(--sky-page-color-2nd);
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
border-bottom: 1px solid;
border-bottom-color: rgba(255, 255, 255, 0.2);
}
.nav-tabs-custom > .nav-tabs > li.active:hover > a,
.nav-tabs-custom > .nav-tabs > li.active > a {
color: var(--sky-text-color-link);
background: inherit;
background-color: var(--sky-page-color);
}
/* popup boxes */
.skin-black .modal-content,
.dropdown-menu,
.skin-black .modal-lg {
border-radius: var(--sky-page-radius);
border-bottom: 1px solid;
background-color: #DEE0D6;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
border-bottom: 1px solid;
border-bottom-color: #ccc;
border-bottom-color: rgba(255, 255, 255, 0.2);
}
/******* PAGES ********/
/* change breadcrumb */
.content-header .breadcrumb > li:last-child {
display: none;
}
.content-header .breadcrumb {
float: right;
position: absolute;
}
/* even header size */
.content-header h1 {
font-size: 36px;
}
.box-footer {
border-bottom-left-radius: var(--sky-page-radius);
border-bottom-right-radius: var(--sky-page-radius);
}
.map-dashboard,
.panel .panel-heading-entity,
.panel .panel-heading-entity h3 {
border-radius: calc(var(--sky-page-radius) - 1px);
}
.panel,
.panel-default > .panel-heading {
border-color: var(--sky-page-color);
}
.panel .panel-body .preview:before {
background: linear-gradient(transparent,var(--sky-page-color));
}
.panel .panel-heading-entity h3 {
height: var(--sky-dashboard-picture-height);
}
.panel .panel-heading-entity h3 a {
height: var(--sky-dashboard-picture-height);
}
/*next page colors*/
.pagination > li > a,
.pagination > .disabled > a,
.pagination > .disabled > a:focus,
.pagination > .disabled > a:hover,
.pagination > .disabled > span,
.pagination > .disabled > span:focus,
.pagination > .disabled > span:hover {
color: var(--sky-header-color);
background-color: var(--sky-page-color-2nd);
border-color: var(--sky-header-color);
}
.input-group-btn:last-child > .btn, .input-group-btn:last-child > .btn-group {
height: 30px;
padding: 3px 12px;
}
.tooltip-inner,
.tooltip-ajax {
background-color: var(--sky-sidebar-background-color);
}
.tooltip-arrow {
border-top-color: var(--sky-sidebar-background-color) !important;
}
