/* * Skin: Black * ---------- */ @import "../bootstrap-less/mixins.less"; @import "../bootstrap-less/variables.less"; @import "../variables.less"; @import "../mixins.less"; .skin-black { //Navbar .main-header { .navbar { .navbar-variant(@black; #fff); .sidebar-toggle { color: #fff; &:hover { background-color: darken(@black, 5%); } } @media (max-width: @screen-header-collapse) { .dropdown-menu { li { &.divider { background-color: rgba(255, 255, 255, 0.1); } a { color: #333; &:hover { background: darken(@black, 5%); } } } } } } //Logo li.user-header { background-color: @black; } } //Content Header .content-header { background: transparent; } //Create the sidebar skin .skin-dark-sidebar(@black); } .skin-black.layout-top-nav .main-header > .logo { .logo-variant { background-color: none; } } .btn, .btn:hover { color: #000 ; &.btn-primary, .btn-primary:link { background-color: @dark-gray; border-color: #FFF; color: #FFF; } &a.btn-primary:hover { background-color: @black; border-color: darken(@dark-gray, 20%); color: #fff; } &.btn-white:link { color: #fff; } &.btn-white:hover { color: #fff; } &.btn-white:visited { color: #fff; } } a { color: var(--link); &:hover { color: var(--hover-link); } &:visited { color: var(--visited-link); } } .text-primary { color: darken(@black, 20%); } :root { --button-default: darken(@black, 15%); --button-primary: darken(@black, 25%); --button-hover: darken(@black, 30%); --header: @black; /* Use same as Header picker */ --text-main: #BBB; --text-sub: #9b9b9b; --link: #black; /* Use same as Header picker, lighten by 70% */ --visited-link: @black; /* Use same as Header picker, lighten by 70% */ --hover-link: lighten(#000, 60%); /* Use same as Header picker, lighten by 70% */ --nav-link: #FFF; /* Use same as Header picker */ --light-link: #fff; /* Use same as Header picker */ } a.btn-info:link, a.btn-warning:link, a.btn-danger:link{ color: #FFF; } &a.btn-info:visited, a.btn-warning:visited, a.btn-danger:visited{ color: #FFF; } .btn-danger.btn-sm.disabled{ color: #FFF; } .sidebar-toggle-mobile { color: #FFF !important; } .skin-black .main-header .navbar .nav>li>a, .skin-black .main-header .navbar .nav>li>a { text-decoration: none; } .select2-container--default .select2-selection--multiple .select2-selection__choice { background-color: @black; } .search-highlight, .search-highlight:hover { background-color: #e9d15b; }