From 4bb638a2ecc89781b2ac03e485a6d05dbf7ec541 Mon Sep 17 00:00:00 2001 From: CyberMind-FR Date: Fri, 9 Jan 2026 16:15:27 +0100 Subject: [PATCH] fix: Dark theme for internal navigation bars in nDPId and Netifyd - Change nav bar background from rgba(255,255,255,0.05) to solid #141419 - Add subtle border for visual separation - Ensures proper dark theme appearance for navigation tabs Co-Authored-By: Claude Opus 4.5 --- .../htdocs/luci-static/resources/view/ndpid/dashboard.js | 4 ++-- .../htdocs/luci-static/resources/view/ndpid/flows.js | 4 ++-- .../htdocs/luci-static/resources/view/ndpid/settings.js | 4 ++-- .../resources/view/secubox-netifyd/applications.js | 2 +- .../luci-static/resources/view/secubox-netifyd/dashboard.js | 2 +- .../luci-static/resources/view/secubox-netifyd/devices.js | 2 +- .../luci-static/resources/view/secubox-netifyd/flows.js | 2 +- .../luci-static/resources/view/secubox-netifyd/settings.js | 2 +- 8 files changed, 11 insertions(+), 11 deletions(-) diff --git a/package/secubox/luci-app-ndpid/htdocs/luci-static/resources/view/ndpid/dashboard.js b/package/secubox/luci-app-ndpid/htdocs/luci-static/resources/view/ndpid/dashboard.js index 994b8045..fd4b2d7b 100644 --- a/package/secubox/luci-app-ndpid/htdocs/luci-static/resources/view/ndpid/dashboard.js +++ b/package/secubox/luci-app-ndpid/htdocs/luci-static/resources/view/ndpid/dashboard.js @@ -21,13 +21,13 @@ var NDPID_NAV = [ function renderNdpidNav(activeId) { return E('div', { 'class': 'sb-app-nav', - 'style': 'display:flex;gap:8px;margin-bottom:20px;padding:8px;background:rgba(255,255,255,0.05);border-radius:12px;' + 'style': 'display:flex;gap:8px;margin-bottom:20px;padding:12px 16px;background:#141419;border:1px solid rgba(255,255,255,0.08);border-radius:12px;' }, NDPID_NAV.map(function(item) { var isActive = activeId === item.id; return E('a', { 'href': L.url('admin', 'secubox', 'ndpid', item.id), 'style': 'display:flex;align-items:center;gap:8px;padding:10px 16px;border-radius:8px;text-decoration:none;font-size:14px;font-weight:500;transition:all 0.2s;' + - (isActive ? 'background:linear-gradient(135deg,#667eea,#764ba2);color:white;' : 'color:#a0a0b0;') + (isActive ? 'background:linear-gradient(135deg,#667eea,#764ba2);color:white;' : 'color:#a0a0b0;background:transparent;') }, [ E('span', {}, item.icon), E('span', {}, _(item.label)) diff --git a/package/secubox/luci-app-ndpid/htdocs/luci-static/resources/view/ndpid/flows.js b/package/secubox/luci-app-ndpid/htdocs/luci-static/resources/view/ndpid/flows.js index 3d1eae2e..38185d6f 100644 --- a/package/secubox/luci-app-ndpid/htdocs/luci-static/resources/view/ndpid/flows.js +++ b/package/secubox/luci-app-ndpid/htdocs/luci-static/resources/view/ndpid/flows.js @@ -21,13 +21,13 @@ var NDPID_NAV = [ function renderNdpidNav(activeId) { return E('div', { 'class': 'sb-app-nav', - 'style': 'display:flex;gap:8px;margin-bottom:20px;padding:8px;background:rgba(255,255,255,0.05);border-radius:12px;' + 'style': 'display:flex;gap:8px;margin-bottom:20px;padding:12px 16px;background:#141419;border:1px solid rgba(255,255,255,0.08);border-radius:12px;' }, NDPID_NAV.map(function(item) { var isActive = activeId === item.id; return E('a', { 'href': L.url('admin', 'secubox', 'ndpid', item.id), 'style': 'display:flex;align-items:center;gap:8px;padding:10px 16px;border-radius:8px;text-decoration:none;font-size:14px;font-weight:500;transition:all 0.2s;' + - (isActive ? 'background:linear-gradient(135deg,#667eea,#764ba2);color:white;' : 'color:#a0a0b0;') + (isActive ? 'background:linear-gradient(135deg,#667eea,#764ba2);color:white;' : 'color:#a0a0b0;background:transparent;') }, [ E('span', {}, item.icon), E('span', {}, _(item.label)) diff --git a/package/secubox/luci-app-ndpid/htdocs/luci-static/resources/view/ndpid/settings.js b/package/secubox/luci-app-ndpid/htdocs/luci-static/resources/view/ndpid/settings.js index ad0b8044..efb1869e 100644 --- a/package/secubox/luci-app-ndpid/htdocs/luci-static/resources/view/ndpid/settings.js +++ b/package/secubox/luci-app-ndpid/htdocs/luci-static/resources/view/ndpid/settings.js @@ -21,13 +21,13 @@ var NDPID_NAV = [ function renderNdpidNav(activeId) { return E('div', { 'class': 'sb-app-nav', - 'style': 'display:flex;gap:8px;margin-bottom:20px;padding:8px;background:rgba(255,255,255,0.05);border-radius:12px;' + 'style': 'display:flex;gap:8px;margin-bottom:20px;padding:12px 16px;background:#141419;border:1px solid rgba(255,255,255,0.08);border-radius:12px;' }, NDPID_NAV.map(function(item) { var isActive = activeId === item.id; return E('a', { 'href': L.url('admin', 'secubox', 'ndpid', item.id), 'style': 'display:flex;align-items:center;gap:8px;padding:10px 16px;border-radius:8px;text-decoration:none;font-size:14px;font-weight:500;transition:all 0.2s;' + - (isActive ? 'background:linear-gradient(135deg,#667eea,#764ba2);color:white;' : 'color:#a0a0b0;') + (isActive ? 'background:linear-gradient(135deg,#667eea,#764ba2);color:white;' : 'color:#a0a0b0;background:transparent;') }, [ E('span', {}, item.icon), E('span', {}, _(item.label)) diff --git a/package/secubox/luci-app-secubox-netifyd/htdocs/luci-static/resources/view/secubox-netifyd/applications.js b/package/secubox/luci-app-secubox-netifyd/htdocs/luci-static/resources/view/secubox-netifyd/applications.js index ff6c9e53..9322dafb 100644 --- a/package/secubox/luci-app-secubox-netifyd/htdocs/luci-static/resources/view/secubox-netifyd/applications.js +++ b/package/secubox/luci-app-secubox-netifyd/htdocs/luci-static/resources/view/secubox-netifyd/applications.js @@ -23,7 +23,7 @@ var NETIFYD_NAV = [ function renderNetifydNav(activeId) { return E('div', { 'class': 'sb-app-nav', - 'style': 'display:flex;gap:8px;margin-bottom:20px;padding:8px;background:rgba(255,255,255,0.05);border-radius:12px;flex-wrap:wrap;' + 'style': 'display:flex;gap:8px;margin-bottom:20px;padding:12px 16px;background:#141419;border:1px solid rgba(255,255,255,0.08);border-radius:12px;flex-wrap:wrap;' }, NETIFYD_NAV.map(function(item) { var isActive = activeId === item.id; return E('a', { diff --git a/package/secubox/luci-app-secubox-netifyd/htdocs/luci-static/resources/view/secubox-netifyd/dashboard.js b/package/secubox/luci-app-secubox-netifyd/htdocs/luci-static/resources/view/secubox-netifyd/dashboard.js index d6a6456b..9edca5e4 100644 --- a/package/secubox/luci-app-secubox-netifyd/htdocs/luci-static/resources/view/secubox-netifyd/dashboard.js +++ b/package/secubox/luci-app-secubox-netifyd/htdocs/luci-static/resources/view/secubox-netifyd/dashboard.js @@ -23,7 +23,7 @@ var NETIFYD_NAV = [ function renderNetifydNav(activeId) { return E('div', { 'class': 'sb-app-nav', - 'style': 'display:flex;gap:8px;margin-bottom:20px;padding:8px;background:rgba(255,255,255,0.05);border-radius:12px;flex-wrap:wrap;' + 'style': 'display:flex;gap:8px;margin-bottom:20px;padding:12px 16px;background:#141419;border:1px solid rgba(255,255,255,0.08);border-radius:12px;flex-wrap:wrap;' }, NETIFYD_NAV.map(function(item) { var isActive = activeId === item.id; return E('a', { diff --git a/package/secubox/luci-app-secubox-netifyd/htdocs/luci-static/resources/view/secubox-netifyd/devices.js b/package/secubox/luci-app-secubox-netifyd/htdocs/luci-static/resources/view/secubox-netifyd/devices.js index 0442b2b9..7cfc1f6f 100644 --- a/package/secubox/luci-app-secubox-netifyd/htdocs/luci-static/resources/view/secubox-netifyd/devices.js +++ b/package/secubox/luci-app-secubox-netifyd/htdocs/luci-static/resources/view/secubox-netifyd/devices.js @@ -23,7 +23,7 @@ var NETIFYD_NAV = [ function renderNetifydNav(activeId) { return E('div', { 'class': 'sb-app-nav', - 'style': 'display:flex;gap:8px;margin-bottom:20px;padding:8px;background:rgba(255,255,255,0.05);border-radius:12px;flex-wrap:wrap;' + 'style': 'display:flex;gap:8px;margin-bottom:20px;padding:12px 16px;background:#141419;border:1px solid rgba(255,255,255,0.08);border-radius:12px;flex-wrap:wrap;' }, NETIFYD_NAV.map(function(item) { var isActive = activeId === item.id; return E('a', { diff --git a/package/secubox/luci-app-secubox-netifyd/htdocs/luci-static/resources/view/secubox-netifyd/flows.js b/package/secubox/luci-app-secubox-netifyd/htdocs/luci-static/resources/view/secubox-netifyd/flows.js index 0e9fbdcd..a8deab2d 100644 --- a/package/secubox/luci-app-secubox-netifyd/htdocs/luci-static/resources/view/secubox-netifyd/flows.js +++ b/package/secubox/luci-app-secubox-netifyd/htdocs/luci-static/resources/view/secubox-netifyd/flows.js @@ -23,7 +23,7 @@ var NETIFYD_NAV = [ function renderNetifydNav(activeId) { return E('div', { 'class': 'sb-app-nav', - 'style': 'display:flex;gap:8px;margin-bottom:20px;padding:8px;background:rgba(255,255,255,0.05);border-radius:12px;flex-wrap:wrap;' + 'style': 'display:flex;gap:8px;margin-bottom:20px;padding:12px 16px;background:#141419;border:1px solid rgba(255,255,255,0.08);border-radius:12px;flex-wrap:wrap;' }, NETIFYD_NAV.map(function(item) { var isActive = activeId === item.id; return E('a', { diff --git a/package/secubox/luci-app-secubox-netifyd/htdocs/luci-static/resources/view/secubox-netifyd/settings.js b/package/secubox/luci-app-secubox-netifyd/htdocs/luci-static/resources/view/secubox-netifyd/settings.js index d5d95f0e..e9342255 100644 --- a/package/secubox/luci-app-secubox-netifyd/htdocs/luci-static/resources/view/secubox-netifyd/settings.js +++ b/package/secubox/luci-app-secubox-netifyd/htdocs/luci-static/resources/view/secubox-netifyd/settings.js @@ -24,7 +24,7 @@ var NETIFYD_NAV = [ function renderNetifydNav(activeId) { return E('div', { 'class': 'sb-app-nav', - 'style': 'display:flex;gap:8px;margin-bottom:20px;padding:8px;background:rgba(255,255,255,0.05);border-radius:12px;flex-wrap:wrap;' + 'style': 'display:flex;gap:8px;margin-bottom:20px;padding:12px 16px;background:#141419;border:1px solid rgba(255,255,255,0.08);border-radius:12px;flex-wrap:wrap;' }, NETIFYD_NAV.map(function(item) { var isActive = activeId === item.id; return E('a', {