hyperion.ng/assets/webconfig/css/darkMode.css

/*General Elements*/
body {
    background-color: #212121;
    color: #DDDDDD;
}

#page-wrapper {
    background-color: #333;
    border-left: none;
}

.navbar-default {
    background-color: #212121;
    border-color: #212121;
}

.navbar-default li a {
    color: #C6C6C6 !important;
}

.panel-body {
    background-color: #424242;
}

hr {
    border-top: 1px solid #DDDDDD;
}

a {
    color: #337ab7;
}

a:hover {
    color: #5db6ff;
}

a:focus {
    color: #5db6ff;
}

a:active {
    color: #5db6ff
}

p {
    color: #DDDDDD;
}

h4 {
    color: #DDDDDD;
}

/*Buttons*/
.btn-transparent:hover {
    color: #5db6ff;
}

.btn-transparent:focus{
    color: #5db6ff;
}

.btn-default {
    color: #DDDDDD;
    background-color: #212121;
    border-color: #424242;
}

.btn-default:hover {
    color: #DDDDDD;
    background-color: #333;
    border-color: #616161;
}

.btn-default:focus{
    color: #DDDDDD;
    background-color: #333;
    border-color: #616161;
}

.btn-primary {
    background-color: #155fa0;
    border-color: #5db6ff;
}

.btn-primary:hover{
    background-color: #337ab7;
    border-color: #82B1FF;
}

.btn-primary:focus{
    background-color: #337ab7;
    border-color: #82B1FF;
}

.btn-primary[disabled]:hover {
    background-color: #337ab7;
    border-color: #82B1FF;
}

.btn-warning {
    background-color: #bc7410;
    border-color: #f0ad4e;
}

.btn-warning:hover {
    background-color: #ec971f;
    border-color: #f3bd72;
}

.btn-warning:focus {
    background-color: #ec971f;
    border-color: #f3bd72;
}

.btn-danger {
    background-color: #861c30;
    border-color: #d43f3a;
}

.btn-danger:hover {
    background-color: #b4102d;
    border-color: #F44336;
}

.btn-danger:focus {
    background-color: #b4102d;
    border-color: #F44336;
}

.btn-success {
    background-color: darkgreen;
    border-color: #4cae4c;
}

.btn-success:hover {
    background-color: green;
    border-color: #a1eea1;
}

.btn-wizard {
    background-color: #602060;
    border-color: #993399;
}

.btn-wizard:hover {
    background-color: #993399;
    border-color: #cc66cc;
}

.btn-wizard:focus {
    background-color: #993399;
    border-color: #cc66cc;
}

/*Tables*/
tr:hover td {
    background-color: #2e6da4;
}

/*Navigation Sidebar*/
.sidebar ul li {
    border-bottom: 1px solid #424242;
}

.sidebar ul li a.active{
    background-color: #424242;
}

.sidebar ul li a:hover{
    background-color: #424242;
}

.sidebar ul li a:focus{
    background-color: #424242;
}

/*Navigation Topbar*/
.navbar-top-links li a:hover {
    background-color: #424242;
}

.navbar-top-links li a:focus {
    background-color: #424242;
}

.nav .open>a, .nav .open>a:hover, .nav .open>a:focus {
    background-color: #424242;
}

.dropdown-menu {
    background-color: #212121;
    border-color: #424242;
}

.dropdown-menu>li>a {
    color: #DDDDDD;
}

/*Panels*/
.panel-default {
    background-color: #424242!important;
    border-color: #424242 !important;
    box-shadow: 0px 2px 10px 0px rgba(18, 18, 18, 0.4);
}

.panel-primary {
    background-color: #424242!important;
    border-color: #424242 !important;
    box-shadow: 0px 2px 10px 0px rgba(18, 18, 18, 0.4);
}

.panel-primary>.panel-heading {
    background-color: #424242!important;
    border-color: #424242 !important;
}

.panel-primary>.panel-heading+.panel-collapse>.panel-body {
    border-top-color: #616161;
}

.panel-default>.panel-heading{
    background-color: #424242 !important;
    border-color: #212121 !important;
    color: #DDDDDD;
}

.panel-default>.panel-system{
    background-color: #0E83E7 !important;
    border-color: #212121 !important;
    color: #fff ;
}

.panel-default>.panel-instance{
    background-color:#E18300 !important;
    border-color: #212121 !important;
    color: #DDDDDD;
}

.panel-footer {
    background-color: #424242 !important;
    border-top: 1px solid #616161 !important;
}

/*JSON Editor Inputs*/
[id^=editor_container] .well {
    background-color: #424242 !important;
}

/* Froms */
.form-control {
    border-color: #616161;
    background-color: #212121;
    color: #DDDDDD !important;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
}

select.form-control {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4.95 10'%3E%3Cpath fill='%23212121' d='M0 0h4.95v10H0z'/%3E%3Cpath fill='%23ddd' d='M1.41 4.67l1.07-1.49 1.06 1.49H1.41zm2.13.66L2.48 6.82 1.41 5.33h2.13z'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat;
    background-position: right 5px center;
}

.input-group .form-control:last-child, .input-group-addon:last-child, .input-group-btn:last-child>.btn, .input-group-btn:last-child>.btn-group>.btn, .input-group-btn:last-child>.dropdown-toggle, .input-group-btn:first-child>.btn:not(:first-child), .input-group-btn:first-child>.btn-group:not(:first-child)>.btn {
    border-color: #616161;
    background-color: #333;
    color: #DDDDDD;
}

.input-group .form-control:first-child, .input-group-addon:first-child, .input-group-btn:first-child>.btn, .input-group-btn:first-child>.btn-group>.btn, .input-group-btn:first-child>.dropdown-toggle, .input-group-btn:last-child>.btn:not(:last-child):not(.dropdown-toggle), .input-group-btn:last-child>.btn-group:not(:last-child)>.btn {
    border-color: #616161;
    background-color: #212121;
    color: #DDDDDD;
}

.checkbox label::before {
    border-color: #616161;
    background-color: #212121;
    color: #DDDDDD;
}

.checkbox label::after
{
    left: 1px;
    color: #DDDDDD;
}

.checklist li::before {
    color: #DDDDDD;
}

.checkbox input[type="checkbox"]:checked + label::before, .checkbox-success input[type="checkbox"]:checked + label::before, .checkbox-success input[type="radio"]:checked + label::before {
    border-color: #616161;
    background-color: #212121;
}

.checkbox input[type="checkbox"]:checked + label::after, .checkbox-success input[type="checkbox"]:checked + label::after, .checkbox-success input[type="radio"]:checked + label::after {
    color: #DDDDDD;
}

.btn-group>.btn:first-child:not(:last-child):not(.dropdown-toggle) {
    border-bottom-right-radius: 4px;
    border-top-right-radius: 4px;
}

.input-group-addon {
    background-color: #333;
    border: 1px solid #616161;
    border-left: none;
}

/* Tabs Buttons */
.nav-tabs {
    border-bottom: 1px solid #616161;
}

.nav-tabs>li.active>a, .nav-tabs>li.active>a:hover, .nav-tabs>li.active>a:focus {
    color: #DDDDDD;
    border: 1px solid #424242;
    border-bottom-color: transparent;
    border-top-color: #5db6ff;
    background-color: #333;
}

.nav-tabs>li>a {
    color: #999999;
    border: 1px solid #424242;
    border-bottom-color: #616161;
    background-color: #424242;
}

.nav-tabs>li>a:hover, .nav-tabs>li>a:focus {
    color: #DDDDDD;
    border: 1px solid #424242;
    border-bottom-color: transparent;
    background-color: #333;
}

/*Modals*/
.modal-content {
    background-color: #212121;
}

.modal-header {
    border-bottom: 1px solid #616161;
}

button.close {
    color: #DDDDDD;
}

button.close:hover {
    color: #ffffff;
}

/*Bootstrap Notify*/
[data-notify="container"] {
    background-color: #212121;
}

.support-container:hover .fa {
    background-color: #2e6da4;
}

/*Burger Button*/
.navbar-default .navbar-toggle {
    border-color: #2e6da4;
    background-color: #1e1e1e;
}

.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {
    border-color: #2e6da4;
    background-color: #424242;
}

.navbar-top-links .dropdown-menu li a:hover{
    background-color: #424242;
    color: #5db6ff;
}

/*navbar fixes*/
.navbar-top-links {
    display: table;
}

.navbar-top-links>li {
    display: table-cell;
}

.navbar-top-links li a {
    text-align: center;
}

.navbar-top-links li ul a {
    text-align: left;
}

.navbar-default .navbar-toggle > .icon-bar {
    background-color: #DDDDDD !important;
}

.navbar-top-links .dropdown-alerts {
    position: fixed;
    top: auto;
    margin: 0 auto;
}

/* additinal changes + fixes */
.component-on,
.component-on ~ span {
    color: greenyellow;
}

.support-container {
    color: #DDDDDD;
}

.bs-callout {
    border-top: none;
    border-right: none;
    border-bottom: none;
    background-color: #424242;
}

.page-header {
    border-bottom: 1px solid #616161;
}

#page-content .bs-callout {
    background-color: #333;
}

.bs-callout-success {
    border-left-color: #67FF01;
}

.bs-callout-success h4 {
    color: greenyellow;
}

tr:hover td {
    background-color: #616161;
}

#dash_statush span[style="color:green"] {
    color: greenyellow !important;
}

#dash_statush span[style="color:red"] {
    color:#861c30 !important;
}

pre {
    background-color: #424242 !important;
    border-color: #424242 !important;
    box-shadow: 0px 2px 10px 0px rgba(18, 18, 18, 0.4);
    color: #DDD;
}