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:
@@ -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>
|
||||
|
||||
Reference in New Issue
Block a user