Dark theme for Nginx Proxy Manager
Nginx Proxy Manager by st3v32

Details
Authorst3v32
LicenseNo License
Categorynginx proxy manager
Created
Updated
Code size4.4 kB
Code checksum3c5abfeb
Statistics
Learn how we calculate statistics in the FAQ.
Failed to fetch stats.
Description
Notes
Need to change URL/IP.
Source code
/* ==UserStyle==
@name Nginx Proxy Manager - dark theme
@version 20240604.12.41
@namespace https://userstyles.world/user/Erreur32
@description Dark theme nginx proxy manager
@author Erreur32
==/UserStyle== */
@-moz-document url-prefix("http://127.0.0.1:81") {
/* Couleurs de base */
:root {
--primary-color: #1e2533;
--secondary-color: #272e3b;
--accent-color: #5e72e4;
--accent-color-alt: #6b63f5;
--text-color: #c5c9d2;
--text-color-muted: #9da5b4;
--border-color: #35404f;
--background-color: #1e2533;
}
/* Thème général */
body {
background-color: var(--background-color);
color: var(--text-color);
}
/* En-tête */
.header, .footer {
/*background-color: var(--primary-color);*/
border-bottom: 1px solid var(--border-color);
background-color: var(--background-color);
}
.navbar-light .navbar-brand:hover, .navbar-light .navbar-brand, .navbar-light .navbar-brand:focus {
color: unset;
}
.text-default {
color: unset !important;
}
.navbar-brand {
color: white;
}
/* Navigation */
.header .dropdown-menu {
margin-top: .75rem;
background-color: #272e3b;
}
.dropdown-item {
color: #6e7687;
background-color: unset;
border-color: #dee2e6 #dee2e6 #f5f7fb;
}
.nav-tabs .nav-link.active, .nav-tabs .nav-item.show .nav-link {
color: #495057;
background-color: #c5c9d2;
border-color: #dee2e6 #dee2e6 #f5f7fb;
}
.dropdown-menu {
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
min-width: 12rem;
color: white;
}
.nav-tabs .nav-link:hover {
border-color: #e9ecef #e9ecef #dee2e6;
color: white;
}
.nav-tabs .nav-link:hover:not(.disabled) {
border-color: white;
color: white;
}
.form-control {
color: #495057;
background-color: #222631;
}
.dropdown-menu {
background-color: var(--background-color);
border-color: white;
}
.dropdown-item:hover, .dropdown-item:focus {
color: #1e2533;
text-decoration: none;
background-color: #f8f9fa;
}
.dropdown-item {
color: #fff;
background-color: unset;
border-color: #dee2e6 #dee2e6 #f5f7fb;
}
.tag {
background-color: #5eba00;
color: white;
}
.bg-success {
background-color: #5eba00 !important;
}
.bg-warning {
background-color: #f95801 !important;
}
.btn-outline-success:hover {
color: #f0eaea;
background-color: #5eba00;
border-color: #5eba00;
}
.tag.hover-green, .tag.hover-green:active, .tag.hover-green, .btn .btn-outline-success {
background-color: #4b8b1f;
/* Couleur de fond légèrement plus foncée pour un meilleur contraste */
cursor: pointer;
color: #fff;
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
/* Ombre portée pour améliorer la lisibilité */
}
.nav-tabs .nav-link.active, .nav-tabs .nav-item.show .nav-link {
color: #fff;
background-color: #314455;
border-color: #dee2e6 #dee2e6 #f5f7fb;
}
/* Cartes */
.card {
background-color: var(--secondary-color);
border: 1px solid var(--border-color);
}
/* Formulaires */
input, textarea, select {
background-color: var(--primary-color);
color: var(--text-color);
border: 1px solid var(--border-color);
}
/* Tableaux */
table {
background-color: var(--secondary-color);
border: 1px solid var(--border-color);
}
th {
background-color: var(--primary-color);
color: var(--text-color);
}
tr:nth-child(even) {
background-color: var(--primary-color);
}
.modal-content {
background-color: var(--background-color);
border-color: white;
border: 1px solid rgba(200, 195, 195, .64);
}
.modal-content .form-control {
color: #171717;
background-color: #c8cace;
}
.custom-switch-input:checked ~ .custom-switch-description {
color: #d4e0ec;
}
.selectize-input, .selectize-control.single .selectize-input.input-active {
background: #929aac;
cursor: text;
display: inline-block;
}
.selectize-control.multi .selectize-input > div {
background: #5eba00;
color: #fff;
font-size: 17px;
font-weight: bold;
}
.custom-switch-description {
margin-left: .5rem;
color: #a8b0c1;
}
.modal-content .form-control, .selectize-input.full1 {
color: #aeecff;
background-color: #515255;
}
.modal-open .modal {
overflow-x: hidden;
overflow-y: auto;
background: var(--background-color);
}
}