feat: improve responsive admin experience

This commit is contained in:
2026-08-04 16:47:14 +08:00
parent c71b1351d6
commit 631a362501
20 changed files with 522 additions and 801 deletions
+6 -4
View File
@@ -4,6 +4,8 @@
<title>{% block title %}供水管道健康评估系统{% endblock %}</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="theme-color" content="#005EB8" />
<link rel="icon" href="{{ url_for('static', filename='favicon.svg') }}" type="image/svg+xml" />
<link href="{{ url_for('static', filename='css/app.css') }}" rel="stylesheet" />
{% block head_extra %}{% endblock %}
</head>
@@ -37,8 +39,8 @@
</div>{% endif %}
</div>
</div>
<nav class="md:hidden border-t border-line bg-white">
<div class="mx-auto max-w-7xl px-2 flex overflow-x-auto text-sm font-semibold">
<nav class="md:hidden border-t border-line bg-white" aria-label="主导航">
<div class="mx-auto flex max-w-7xl gap-1 overflow-x-auto px-2 text-sm font-semibold">
<a href="{{ url_for('main.home') }}" class="whitespace-nowrap px-3 py-3 {{ 'text-primary' if active_page == 'home' else 'text-slate-500' }}">主页</a>
<a href="{{ url_for('main.result_page') }}" class="whitespace-nowrap px-3 py-3 {{ 'text-primary' if active_page == 'result' else 'text-slate-500' }}">结果</a>
<a href="{{ url_for('main.history_page') }}" class="whitespace-nowrap px-3 py-3 {{ 'text-primary' if active_page == 'history' else 'text-slate-500' }}">历史</a>
@@ -52,7 +54,7 @@
</header>
{% with flashed_messages = get_flashed_messages(with_categories=true) %}
<div id="alertBox" class="pointer-events-none fixed left-1/2 top-20 z-50 hidden w-[calc(100vw-2rem)] max-w-[430px] -translate-x-1/2 translate-y-3 rounded-lg border bg-white p-4 opacity-0 shadow-[0_18px_45px_rgba(15,23,42,.16)] transition-all duration-200 ease-out sm:top-24" role="status" aria-live="polite">
<div id="alertBox" class="pointer-events-none fixed left-1/2 top-20 z-50 hidden max-h-[calc(100dvh-2rem)] w-[calc(100vw-2rem)] max-w-[430px] -translate-x-1/2 translate-y-3 overflow-y-auto rounded-lg border bg-white p-4 opacity-0 shadow-[0_18px_45px_rgba(15,23,42,.16)] transition-all duration-200 ease-out sm:top-24" role="status" aria-live="polite">
<div class="flex items-start gap-3">
<span id="alertIconWrap" class="flex h-9 w-9 shrink-0 items-center justify-center rounded-md">
<span id="alertIcon" class="material-symbols-outlined text-xl">priority_high</span>
@@ -74,7 +76,7 @@
</div>
{% endwith %}
<main class="mx-auto w-full max-w-7xl flex-1 px-4 py-6 sm:px-6 lg:px-8 lg:py-8">
<main id="main-content" class="mx-auto w-full max-w-7xl flex-1 px-4 py-5 sm:px-6 sm:py-6 lg:px-8 lg:py-8">
{% block content %}{% endblock %}
</main>