ui: вынести CSS в отдельный файл, добавить sticky nav и title block

- Создать guarddog_nexus/web/static/style.css со всеми стилями
- Убрать inline <style> из base.html
- Добавить sticky header для навигации
- Добавить title block для кастомных заголовков страниц
- Добавить базовые анимации (pulse, spin, hover effects)
This commit is contained in:
Marker689
2026-05-10 03:05:55 +03:00
parent 42dcfe33b5
commit 18d33cdfd7
2 changed files with 423 additions and 20 deletions

View File

@@ -3,31 +3,14 @@
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>GuardDog Nexus</title>
<title>{% block title %}GuardDog Nexus{% endblock %}</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@picocss/pico@2/css/pico.min.css">
<script src="https://unpkg.com/htmx.org@2.0.4"></script>
<style>
.flagged { color: var(--pico-color-red-400); font-weight: bold; }
.clean { color: var(--pico-color-green-400); }
.status-pending { color: var(--pico-color-yellow-400); }
.status-scanning { color: var(--pico-color-blue-400); }
.status-completed { color: var(--pico-color-green-400); }
.status-failed { color: var(--pico-color-red-400); }
.severity-WARNING { color: var(--pico-color-yellow-400); }
.severity-ERROR { color: var(--pico-color-red-400); }
.finding-card { margin-bottom: 0.5rem; padding: 0.5rem; border-left: 3px solid; }
.finding-card.WARNING { border-left-color: var(--pico-color-yellow-400); }
.finding-card.ERROR { border-left-color: var(--pico-color-red-400); }
.finding-card.INFO { border-left-color: var(--pico-color-blue-400); }
table { font-size: 0.9rem; }
nav { margin-bottom: 1rem; }
.stats-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 1rem; margin-bottom: 2rem; }
.stat-card { text-align: center; padding: 1rem; }
</style>
<link rel="stylesheet" href="/static/style.css">
</head>
<body>
<main class="container">
<nav>
<nav class="sticky">
<ul><li><strong><a href="/">GuardDog Nexus</a></strong></li></ul>
<ul>
<li><a href="/">Dashboard</a></li>
@@ -35,6 +18,7 @@
<li><a href="/packages">Packages</a></li>
</ul>
</nav>
{% block breadcrumbs %}{% endblock %}
{% block content %}{% endblock %}
</main>
</body>