Add platform icons and fix dark mode contrast on HTTPS config page

- Portal: replace placeholder brand icon with Icon_platform.png in topbar
- NetworkView: replace placeholder sidebar logo with Icon_networkView.png
- DigiServer: fix https_config.html dark mode contrast (hardcoded light colors
  replaced with body.dark-mode CSS overrides and CSS variables)
This commit is contained in:
ske087
2026-07-08 21:06:45 +03:00
parent 1f6217d347
commit 6034a62b08
7 changed files with 138 additions and 6 deletions
Binary file not shown.

After

Width:  |  Height:  |  Size: 28 KiB

@@ -102,7 +102,7 @@ export default function Sidebar() {
<aside className="sidebar">
<div className="sidebar-header">
<Link to="/" className="sidebar-logo">
<span className="logo-icon"></span>
<img src={`${import.meta.env.BASE_URL}Icon_networkView.png`} alt="NetworkView" className="logo-icon" />
<span className="logo-text">NetworkView</span>
</Link>
</div>
+1 -1
View File
@@ -91,7 +91,7 @@ a:hover { text-decoration: underline; }
font-size: 16px;
}
.logo-icon { font-size: 20px; }
.logo-icon { height: 28px; width: auto; vertical-align: middle; }
.logo-text { color: var(--accent); }
.sidebar-search { padding: 10px 12px; position: relative; }
@@ -45,7 +45,7 @@
<div class="status-disabled">
<span class="status-badge-inactive">⚠️ HTTPS DISABLED</span>
{% if is_https_active %}
<p style="color: #156b2e; background: #d1f0e0; padding: 10px; border-radius: 4px; margin: 10px 0;">
<p class="https-note-active">
<strong>Note:</strong> You are currently accessing this page via HTTPS, but the configuration shows as disabled.
This configuration will be automatically updated. Please refresh the page.
</p>
@@ -244,7 +244,7 @@
<div class="status-disabled">
<p>⚠️ <strong>Nginx configuration not accessible</strong></p>
<p>Error: {{ nginx_status.error|default('Unknown error') }}</p>
<p style="font-size: 12px; color: #666;">Path checked: {{ nginx_status.path }}</p>
<p style="font-size: 12px; color: var(--text-secondary);">Path checked: {{ nginx_status.path }}</p>
</div>
{% endif %}
</div>
@@ -635,6 +635,138 @@
width: 100%;
}
}
/* ── Dark mode overrides ── */
.https-note-active {
color: #156b2e;
background: #d1f0e0;
padding: 10px;
border-radius: 4px;
margin: 10px 0;
}
body.dark-mode .https-note-active {
color: #6ee7a0;
background: rgba(40, 167, 69, 0.15);
}
body.dark-mode .status-detection {
background: rgba(102, 126, 234, 0.1);
border-left-color: #7c8ef7;
}
body.dark-mode .badge-success {
background: rgba(40, 167, 69, 0.2);
color: #6ee7a0;
}
body.dark-mode .badge-warning {
background: rgba(255, 193, 7, 0.15);
color: #fcd34d;
}
body.dark-mode .status-enabled {
background: linear-gradient(135deg, rgba(40, 167, 69, 0.15) 0%, rgba(40, 167, 69, 0.1) 100%);
}
body.dark-mode .status-disabled {
background: linear-gradient(135deg, rgba(255, 193, 7, 0.12) 0%, rgba(255, 193, 7, 0.08) 100%);
}
body.dark-mode .status-badge-inactive {
color: #1a202c;
}
body.dark-mode .status-details code {
background: rgba(255, 255, 255, 0.08);
}
body.dark-mode .info-text {
background: rgba(102, 126, 234, 0.1);
border-left-color: #7c8ef7;
}
body.dark-mode .form-group label {
color: var(--text-color);
}
body.dark-mode .form-hint {
color: var(--text-secondary);
}
body.dark-mode .form-input {
background: var(--card-bg);
color: var(--text-color);
border-color: var(--border-color);
}
body.dark-mode .form-input:focus {
border-color: #7c8ef7;
box-shadow: 0 0 0 3px rgba(124, 142, 247, 0.15);
}
body.dark-mode .toggle-text {
color: var(--text-color);
}
body.dark-mode .preview-section {
background: rgba(102, 126, 234, 0.08);
border-color: #7c8ef7;
}
body.dark-mode .preview-section h3 {
color: #a5b4fc;
}
body.dark-mode .access-points li {
background: var(--card-bg);
border-left-color: #7c8ef7;
}
body.dark-mode .access-points code {
background: rgba(102, 126, 234, 0.15);
color: #a5b4fc;
}
body.dark-mode .form-actions {
border-top-color: var(--border-color);
}
body.dark-mode .info-card {
background: linear-gradient(135deg, rgba(102, 126, 234, 0.08) 0%, rgba(118, 75, 162, 0.08) 100%);
}
body.dark-mode .info-card h2,
body.dark-mode .info-section h3 {
color: #a5b4fc;
}
body.dark-mode .info-section li {
color: var(--text-secondary);
}
body.dark-mode .nginx-status-card {
background: linear-gradient(135deg, rgba(102, 126, 234, 0.08) 0%, rgba(118, 75, 162, 0.08) 100%);
border-left-color: #7c8ef7;
}
body.dark-mode .nginx-status-card h2 {
color: #a5b4fc;
}
body.dark-mode .status-item {
background: rgba(255, 255, 255, 0.04);
border-left-color: #7c8ef7;
}
body.dark-mode .status-item strong {
color: var(--text-color);
}
body.dark-mode .status-item code {
background: rgba(102, 126, 234, 0.15);
color: #a5b4fc;
}
</style>
<script>
Binary file not shown.

After

Width:  |  Height:  |  Size: 11 KiB

+1 -1
View File
@@ -62,7 +62,7 @@ code { font-family: 'SFMono-Regular', Consolas, monospace; font-size: 0.85em; }
flex-shrink: 0;
}
.brand-icon { font-size: 1.4rem; color: var(--accent-blue); }
.brand-icon { height: 2rem; width: auto; vertical-align: middle; }
.topbar-nav {
display: flex;
+1 -1
View File
@@ -10,7 +10,7 @@
{% if current_user.is_authenticated %}
<header class="topbar">
<div class="topbar-brand">
<span class="brand-icon"></span>
<img src="{{ url_for('static', filename='Icon_platform.png') }}" alt="Platform Icon" class="brand-icon" />
<span class="brand-name">Enterprise Digital Platform</span>
</div>
<nav class="topbar-nav">