diff --git a/.gitignore b/.gitignore index 8c9ddce..9677573 100644 --- a/.gitignore +++ b/.gitignore @@ -16,3 +16,5 @@ skills-lock.json .playwright-mcp/ dashboard-*.png scans-*.png +scan-*.png +dashboard-*.png diff --git a/guarddog_nexus/web/static/style.css b/guarddog_nexus/web/static/style.css index 3b7f515..73c74ff 100644 --- a/guarddog_nexus/web/static/style.css +++ b/guarddog_nexus/web/static/style.css @@ -3,16 +3,16 @@ /* ------------------------------------------------------------------ */ /* Status / severity colours */ /* ------------------------------------------------------------------ */ -.flagged { color: var(--pico-color-red-400); font-weight: bold; } -.clean { color: var(--pico-color-green-400); } +.flagged { color: #e04040; font-weight: bold; } +.clean { color: #4caf50; } -.status-pending { color: var(--pico-color-yellow-400); } -.status-scanning { color: var(--pico-color-blue-400); animation: pulse 1.5s ease-in-out infinite; } -.status-completed { color: var(--pico-color-green-400); } -.status-failed { color: var(--pico-color-red-400); } +.status-pending { color: #f0c000; } +.status-scanning { color: #2196f3; animation: pulse 1.5s ease-in-out infinite; } +.status-completed { color: #4caf50; } +.status-failed { color: #e04040; } -.severity-WARNING { color: var(--pico-color-yellow-400); } -.severity-ERROR { color: var(--pico-color-red-400); } +.severity-WARNING { color: #f0c000; } +.severity-ERROR { color: #e04040; } /* ------------------------------------------------------------------ */ /* Dashboard blocks */ @@ -29,7 +29,7 @@ } .dash-block-warn { - border-left: 3px solid var(--pico-color-red-400); + border-left: 3px solid #e04040; } /* ------------------------------------------------------------------ */ @@ -69,8 +69,8 @@ table.compact td { padding: 0.35rem 0.5rem; } .scan-error { margin-top: 0.75rem; padding: 0.5rem 0.75rem; - background: rgba(var(--pico-color-red-400), 0.1); - border-left: 3px solid var(--pico-color-red-400); + background: rgba(224, 64, 64, 0.1); + border-left: 3px solid #e04040; border-radius: 4px; font-size: 0.85rem; } @@ -79,32 +79,38 @@ table.compact td { padding: 0.35rem 0.5rem; } /* Finding blocks (replaces accordion details/summary) */ /* ------------------------------------------------------------------ */ .finding-block { - margin-bottom: 0.75rem; - border: 1px solid var(--pico-color-gray-600); + margin-bottom: 1rem; + border: 1px solid #202632 !important; + border-left: 3px solid #2a3140 !important; border-radius: 6px; overflow: hidden; } +.finding-block.finding-warning { border-left-color: #f0c000 !important; } +.finding-block.finding-error { border-left-color: #e04040 !important; } + .finding-summary { display: flex; align-items: center; gap: 0.5rem; - padding: 0.5rem 0.75rem; - background: var(--pico-color-gray-650); + padding: 0.6rem 0.85rem; + background: rgba(255, 255, 255, 0.04); font-size: 0.9rem; - border-bottom: 1px solid var(--pico-color-gray-600); + border-bottom: 1px solid #202632; } .finding-body { - padding: 0.75rem; + padding: 0.85rem 1rem; } -.finding-body p { - margin-bottom: 0.5rem; +.finding-body > p:first-child { + margin-bottom: 0.6rem; + padding-bottom: 0.6rem; + border-bottom: 1px solid rgba(255, 255, 255, 0.06); } .finding-body pre { - background: var(--pico-color-gray-700); + background: #141924; padding: 0.5rem; border-radius: 4px; overflow-x: auto; @@ -121,8 +127,8 @@ table.compact td { padding: 0.35rem 0.5rem; } border-radius: 6px; font-size: 0.85rem; line-height: 1.55; - border-left: 4px solid var(--pico-color-gray-500); - background: var(--pico-color-gray-750); + border-left: 4px solid #2a3140; + background: #1a1f2b; } .llm-header { @@ -146,9 +152,9 @@ table.compact td { padding: 0.35rem 0.5rem; } .llm-badge-suspicious { background: #5c4a1a; color: #facc15; } .llm-badge-malicious { background: #5c1a1a; color: #f87171; } -.llm-safe { border-left-color: var(--pico-color-green-400); background: rgba(74,222,128,0.06); } -.llm-suspicious { border-left-color: var(--pico-color-yellow-400); background: rgba(250,204,21,0.06); } -.llm-malicious { border-left-color: var(--pico-color-red-400); background: rgba(248,113,113,0.08); } +.llm-safe { border-left-color: #4caf50; background: rgba(74,222,128,0.06); } +.llm-suspicious { border-left-color: #f0c000; background: rgba(250,204,21,0.06); } +.llm-malicious { border-left-color: #e04040; background: rgba(248,113,113,0.08); } .llm-severity { font-size: 0.72rem; @@ -160,7 +166,7 @@ table.compact td { padding: 0.35rem 0.5rem; } .llm-summary { font-style: italic; margin-bottom: 0.4rem; - color: var(--pico-color-zinc-300); + color: #c2c7d0; } .llm-analysis { @@ -185,7 +191,7 @@ table.compact td { padding: 0.35rem 0.5rem; } font-size: 0.72rem; opacity: 0.5; font-style: italic; - border-top: 1px solid var(--pico-color-gray-600); + border-top: 1px solid #202632; padding-top: 0.4rem; } @@ -201,16 +207,16 @@ table.compact td { padding: 0.35rem 0.5rem; } .copy-btn { cursor: pointer; background: none; - border: 1px solid var(--pico-color-gray-500); + border: 1px solid #2a3140; padding: 0.15rem 0.5rem; font-size: 0.7rem; border-radius: 3px; - color: var(--pico-color-gray-300); + color: #c2c7d0; transition: background 0.2s; } -.copy-btn:hover { background: var(--pico-color-gray-600); } -.copy-btn.copied { color: var(--pico-color-green-400); border-color: var(--pico-color-green-400); } +.copy-btn:hover { background: #202632; } +.copy-btn.copied { color: #4caf50; border-color: #4caf50; } .htmx-indicator { display: inline; } @@ -218,7 +224,7 @@ table.compact td { padding: 0.35rem 0.5rem; } /* Nav / breadcrumbs / empty state */ /* ------------------------------------------------------------------ */ nav { margin-bottom: 1rem; } -nav.sticky { position: sticky; top: 0; z-index: 100; background: var(--pico-color-dark); padding: 0.5rem 0; border-bottom: 1px solid var(--pico-color-gray-500); } +nav.sticky { position: sticky; top: 0; z-index: 100; background: #13171f; padding: 0.5rem 0; border-bottom: 1px solid #2a3140; } .breadcrumbs { margin-bottom: 1rem; font-size: 0.85rem; opacity: 0.7; } .breadcrumbs a { text-decoration: none; } @@ -241,7 +247,7 @@ nav.sticky { position: sticky; top: 0; z-index: 100; background: var(--pico-c .filter-bar select { margin-bottom: 0; } th.sortable { cursor: pointer; user-select: none; } -th.sortable:hover { background: var(--pico-color-gray-600); } +th.sortable:hover { background: #202632; } th.sortable .sort-icon { margin-left: 0.25rem; opacity: 0.3; } th.sortable.active .sort-icon { opacity: 1; } @@ -252,7 +258,7 @@ th.sortable.active .sort-icon { opacity: 1; } display: inline-block; width: 12px; height: 12px; - border: 2px solid var(--pico-color-blue-400); + border: 2px solid #2196f3; border-top-color: transparent; border-radius: 50%; animation: spin 0.8s linear infinite; diff --git a/scan-68-card.png b/scan-68-card.png new file mode 100644 index 0000000..e810d93 Binary files /dev/null and b/scan-68-card.png differ diff --git a/scan-68-final.png b/scan-68-final.png new file mode 100644 index 0000000..0e343c9 Binary files /dev/null and b/scan-68-final.png differ diff --git a/scan-68-v2.png b/scan-68-v2.png new file mode 100644 index 0000000..70a5104 Binary files /dev/null and b/scan-68-v2.png differ diff --git a/scan-68-v3.png b/scan-68-v3.png new file mode 100644 index 0000000..70a5104 Binary files /dev/null and b/scan-68-v3.png differ diff --git a/scan-68.png b/scan-68.png new file mode 100644 index 0000000..124e30e Binary files /dev/null and b/scan-68.png differ