mirror of
https://github.com/deunix-educ/Fail2banMqttActionBanishment.git
synced 2026-08-24 03:11:58 +02:00
200 lines
7.9 KiB
CSS
200 lines
7.9 KiB
CSS
/* ============================================================
|
|
Emitter — Django Admin Theme Override
|
|
Thème sombre, couleurs depuis main.css
|
|
============================================================ */
|
|
|
|
/* --- Variables Django admin 4.x ----------------------------- */
|
|
:root {
|
|
--primary : #00d4aa;
|
|
--secondary : #00a884;
|
|
--accent : #00d4aa;
|
|
--primary-fg : #0d1117;
|
|
|
|
--body-fg : #e6edf3;
|
|
--body-bg : #0d1117;
|
|
--body-quiet-color : #8b949e;
|
|
--body-loud-color : #e6edf3;
|
|
|
|
--header-color : #e6edf3;
|
|
--header-branding-color: #00d4aa;
|
|
--header-bg : #161b22;
|
|
--header-link-color : #e6edf3;
|
|
|
|
--breadcrumbs-fg : #8b949e;
|
|
--breadcrumbs-link-fg : #00d4aa;
|
|
--breadcrumbs-bg : #161b22;
|
|
|
|
--link-fg : #00d4aa;
|
|
--link-hover-color : #00a884;
|
|
--link-selected-fg : #00d4aa;
|
|
|
|
--hairline-color : #1f2a36;
|
|
--border-color : #1f2a36;
|
|
|
|
--error-fg : #f85149;
|
|
|
|
--message-success-bg : rgba(63,185,80,.15);
|
|
--message-warning-bg : rgba(210,153,34,.15);
|
|
--message-error-bg : rgba(248,81,73,.15);
|
|
|
|
--darkened-bg : #161b22;
|
|
--selected-bg : #21262d;
|
|
--selected-row : #2d333b;
|
|
|
|
--button-fg : #0d1117;
|
|
--button-bg : #00d4aa;
|
|
--button-hover-bg : #00a884;
|
|
--default-button-fg : #0d1117;
|
|
--default-button-bg : #00d4aa;
|
|
--default-button-hover-bg: #00a884;
|
|
--close-button-bg : #21262d;
|
|
--close-button-hover-bg : #2d333b;
|
|
|
|
--object-tools-fg : #0d1117;
|
|
--object-tools-bg : #00d4aa;
|
|
--object-tools-hover-bg : #00a884;
|
|
|
|
--font-family : 'Segoe UI', system-ui, -apple-system, sans-serif;
|
|
}
|
|
|
|
/* --- Global ------------------------------------------------- */
|
|
html, body { font-family: var(--font-family); background: var(--body-bg); color: var(--body-fg); }
|
|
a { color: var(--link-fg); }
|
|
a:hover { color: var(--link-hover-color); }
|
|
|
|
/* --- Header ------------------------------------------------- */
|
|
#header {
|
|
background : var(--header-bg);
|
|
color : var(--header-color);
|
|
border-bottom: 1px solid #1f2a36;
|
|
}
|
|
#header a:link, #header a:visited { color: var(--header-color); }
|
|
#branding h1, #branding h1 a:link, #branding h1 a:visited {
|
|
color: var(--accent);
|
|
font-weight: 700;
|
|
}
|
|
#user-tools a { color: #8b949e; }
|
|
#user-tools a:hover { color: var(--accent); }
|
|
|
|
/* --- Breadcrumbs -------------------------------------------- */
|
|
div.breadcrumbs {
|
|
background : var(--breadcrumbs-bg);
|
|
color : var(--breadcrumbs-fg);
|
|
border-bottom: 1px solid #1f2a36;
|
|
}
|
|
div.breadcrumbs a { color: var(--accent); }
|
|
div.breadcrumbs a:hover { color: var(--link-hover-color); }
|
|
|
|
/* --- Sidebar / nav ------------------------------------------ */
|
|
#nav-sidebar { background: #161b22; border-right: 1px solid #1f2a36; }
|
|
#nav-sidebar .current-app .section:link,
|
|
#nav-sidebar .current-app .section:visited { color: var(--accent); }
|
|
|
|
/* --- Content area ------------------------------------------- */
|
|
#content { background: var(--body-bg); }
|
|
#content-main { background: var(--body-bg); }
|
|
.colMS #content-main { border-right: 1px solid #1f2a36; }
|
|
|
|
/* --- Module headers (blocs gris-bleu → sombre+accent) ------- */
|
|
.module caption,
|
|
.inline-group h2,
|
|
fieldset.module h2,
|
|
div.submit-row {
|
|
background : #161b22;
|
|
color : var(--body-fg);
|
|
border-bottom: 1px solid #1f2a36;
|
|
}
|
|
.module { background: #161b22; border: 1px solid #1f2a36; }
|
|
fieldset.module { background: #161b22; border: 1px solid #1f2a36; }
|
|
|
|
/* --- Tables ------------------------------------------------- */
|
|
#result_list thead th { background: #161b22; color: var(--body-quiet-color); border-bottom: 1px solid #1f2a36; }
|
|
#result_list tr.row1 { background: #0d1117; }
|
|
#result_list tr.row2 { background: #111820; }
|
|
#result_list tr:hover td { background: #21262d !important; }
|
|
#result_list td, #result_list th { border-right-color: #1f2a36; }
|
|
table { border-color: #1f2a36; }
|
|
td, th { border-color: #1f2a36; }
|
|
|
|
/* --- Filtres (colonne droite) -------------------------------- */
|
|
#changelist-filter { background: #161b22; border-left: 1px solid #1f2a36; }
|
|
#changelist-filter h2 { background: #161b22; color: var(--accent); border-bottom: 1px solid #1f2a36; }
|
|
#changelist-filter h3 { color: var(--body-quiet-color); border-bottom: 1px solid #1f2a36; }
|
|
#changelist-filter li.selected a { color: var(--accent); font-weight: 600; }
|
|
#changelist-filter a { color: var(--body-fg); }
|
|
#changelist-filter a:hover { color: var(--accent); }
|
|
|
|
/* --- Formulaires -------------------------------------------- */
|
|
input, select, textarea {
|
|
background : #21262d;
|
|
color : var(--body-fg);
|
|
border : 1px solid #2d3748;
|
|
border-radius: 4px;
|
|
}
|
|
input:focus, select:focus, textarea:focus {
|
|
border-color: var(--accent);
|
|
outline : none;
|
|
box-shadow : 0 0 0 2px rgba(0,212,170,.2);
|
|
}
|
|
.form-row { border-bottom-color: #1f2a36; }
|
|
.aligned label { color: var(--body-quiet-color); }
|
|
.help { color: #8b949e; }
|
|
|
|
/* --- Boutons ------------------------------------------------ */
|
|
.button, input[type=submit], input[type=button], .submit-row input, a.button {
|
|
background : var(--button-bg);
|
|
color : var(--button-fg);
|
|
border : none;
|
|
border-radius: 4px;
|
|
font-weight : 600;
|
|
}
|
|
.button:hover, input[type=submit]:hover, input[type=button]:hover {
|
|
background: var(--button-hover-bg);
|
|
color : var(--button-fg);
|
|
}
|
|
.button.default, input[type=submit].default {
|
|
background: var(--accent);
|
|
color : #0d1117;
|
|
}
|
|
a.deletelink { background: #7f1d1d; color: #fca5a5; border-radius: 4px; padding: 4px 8px; }
|
|
a.deletelink:hover { background: #991b1b; color: #fca5a5; }
|
|
|
|
/* --- Object tools (haut des formulaires) ------------------- */
|
|
ul.object-tools li a { background: #21262d; color: var(--accent); border: 1px solid #1f2a36; }
|
|
ul.object-tools li a:hover { background: #2d333b; }
|
|
ul.object-tools li a.addlink { background: var(--accent); color: #0d1117; border: none; }
|
|
ul.object-tools li a.addlink:hover { background: var(--link-hover-color); }
|
|
|
|
/* --- Pagination -------------------------------------------- */
|
|
.paginator a, .paginator span {
|
|
background : #21262d;
|
|
color : var(--body-fg);
|
|
border : 1px solid #1f2a36;
|
|
border-radius: 3px;
|
|
}
|
|
.paginator a:hover { background: #2d333b; }
|
|
.paginator .this-page { background: var(--accent); color: #0d1117; border-color: var(--accent); }
|
|
|
|
/* --- Messages (success/warning/error) ---------------------- */
|
|
.messagelist li { border-radius: 4px; padding: 10px 14px; }
|
|
.messagelist li.success { background: rgba(63,185,80,.15); color: #3fb950; border: 1px solid rgba(63,185,80,.3); }
|
|
.messagelist li.warning { background: rgba(210,153,34,.15); color: #d29922; border: 1px solid rgba(210,153,34,.3); }
|
|
.messagelist li.error { background: rgba(248,81,73,.15); color: #f85149; border: 1px solid rgba(248,81,73,.3); }
|
|
|
|
/* --- Dashboard (index admin) -------------------------------- */
|
|
#content-main .module h2 { color: var(--body-fg); }
|
|
.dashboard #content { background: var(--body-bg); }
|
|
|
|
/* --- Inlines ------------------------------------------------ */
|
|
.inline-group { border: 1px solid #1f2a36; }
|
|
.inline-group thead tr { background: #161b22; }
|
|
.inline-related h3 { background: #161b22; border: 1px solid #1f2a36; color: var(--accent); }
|
|
|
|
/* --- Misc --------------------------------------------------- */
|
|
.errornote { background: rgba(248,81,73,.1); color: #f85149; border: 1px solid rgba(248,81,73,.4); }
|
|
.errorlist li { color: #f85149; }
|
|
.selector { background: #161b22; border: 1px solid #1f2a36; }
|
|
.selector select { background: #0d1117; color: var(--body-fg); border: none; }
|
|
.selector-available h2, .selector-chosen h2 { background: #161b22; color: var(--body-quiet-color); }
|
|
.selector-filter input { background: #21262d; color: var(--body-fg); border-color: #2d3748; }
|