dekun/qihuo
1
0
Fork 0
Code Issues Actions Packages Projects Releases Wiki Activity

三端自适应布局与 PWA 可安装支持

Browse Source 
新增响应式样式、手机侧滑导航、manifest 与 Service Worker；补充根路径重定向与安装 App 入口。

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
dekun
2026-06-15 16:58:13 +08:00
parent e8b4dbbaca
commit 28875078f1
11 changed files with 785 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files
templates/base.html
+27 -15
View File
@@ -2,7 +2,16 @@
<html lang="zh-CN" data-theme="dark">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover">
<meta name="theme-color" content="#050508" id="meta-theme-color">
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
<meta name="apple-mobile-web-app-title" content="期货监控">
<meta name="application-name" content="期货监控">
<link rel="manifest" href="{{ url_for('web_manifest') }}">
<link rel="icon" href="{{ url_for('static', filename='icons/icon.svg') }}" type="image/svg+xml">
<link rel="apple-touch-icon" href="{{ url_for('static', filename='icons/icon-192.png') }}">
<title>{% block title %}国内期货监控系统{% endblock %}</title>
<script>
try {
@@ -411,16 +420,9 @@
.split-grid{grid-template-columns:1fr}
.split-grid .card{min-height:auto}
}
@media(max-width:768px){
.site-header{padding:1.25rem .75rem 1rem}
.site-title{font-size:1.35rem;margin-bottom:.85rem}
.header-tools{position:static;justify-content:center;margin-bottom:.75rem}
.user-bar{position:static;text-align:center;margin-bottom:.75rem}
.site-nav{gap:.35rem}
.site-nav a{padding:.45rem .75rem;font-size:.82rem}
}
</style>
<link rel="stylesheet" href="{{ url_for('static', filename='css/tech.css') }}">
<link rel="stylesheet" href="{{ url_for('static', filename='css/responsive.css') }}">
{% block extra_css %}{% endblock %}
</head>
<body>
@@ -432,15 +434,23 @@
</div>
<div class="page-wrap">
<header class="site-header">
<div class="header-tools">
<div class="theme-switch" role="group" aria-label="主题模式">
<button type="button" class="theme-switch-btn" data-theme-pick="dark">深色</button>
<button type="button" class="theme-switch-btn" data-theme-pick="light">浅色</button>
<div class="header-bar">
<button type="button" class="nav-toggle" id="nav-toggle" aria-label="打开菜单" aria-expanded="false" aria-controls="site-nav">
<span></span><span></span><span></span>
</button>
<div class="header-tools">
<div class="theme-switch" role="group" aria-label="主题模式">
<button type="button" class="theme-switch-btn" data-theme-pick="dark">深色</button>
<button type="button" class="theme-switch-btn" data-theme-pick="light">浅色</button>
</div>
<button type="button" class="pwa-install-btn" id="pwa-install-btn" hidden>安装 App</button>
</div>
<div class="user-bar">{{ session.username or '用户' }}<a href="{{ url_for('logout') }}">退出</a></div>
</div>
<div class="user-bar">{{ session.username or '用户' }}<a href="{{ url_for('logout') }}">退出</a></div>
<p class="pwa-ios-hint" id="pwa-ios-hint">iOS 安装：Safari 浏览器点击底部分享按钮，选择「添加到主屏幕」。</p>
<h1 class="site-title">国内期货 · 交易监控 + 复盘<span class="site-title-sub">FUTURES MONITOR SYSTEM</span></h1>
<nav class="site-nav">
<button type="button" class="nav-backdrop" id="nav-backdrop" aria-label="关闭菜单" hidden></button>
<nav class="site-nav" id="site-nav">
<a href="{{ url_for('plans') }}" class="{% if request.endpoint == 'plans' %}active{% endif %}">开单计划</a>
<a href="{{ url_for('keys') }}" class="{% if request.endpoint == 'keys' %}active{% endif %}">关键位监控</a>
<a href="{{ url_for('positions') }}" class="{% if request.endpoint == 'positions' %}active{% endif %}">持仓监控</a>
@@ -457,6 +467,8 @@
</main>
</div>
<script src="{{ url_for('static', filename='js/symbol.js') }}"></script>
<script src="{{ url_for('static', filename='js/nav.js') }}"></script>
<script src="{{ url_for('static', filename='js/pwa.js') }}"></script>
{% block extra_js %}{% endblock %}
</body>
</html>
templates/login.html
+12 -2
View File
@@ -2,7 +2,15 @@
<html lang="zh-CN" data-theme="dark">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover">
<meta name="theme-color" content="#050508" id="meta-theme-color">
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
<meta name="apple-mobile-web-app-title" content="期货监控">
<link rel="manifest" href="{{ url_for('web_manifest') }}">
<link rel="icon" href="{{ url_for('static', filename='icons/icon.svg') }}" type="image/svg+xml">
<link rel="apple-touch-icon" href="{{ url_for('static', filename='icons/icon-192.png') }}">
<title>系统登录</title>
<script>
try {
@@ -157,8 +165,9 @@
}
</style>
<link rel="stylesheet" href="{{ url_for('static', filename='css/tech.css') }}">
<link rel="stylesheet" href="{{ url_for('static', filename='css/responsive.css') }}">
</head>
<body>
<body class="login-page">
<div class="tech-bg" aria-hidden="true">
<div class="tech-grid"></div>
<div class="tech-glow"></div>
@@ -191,5 +200,6 @@
</form>
</div>
</div>
<script src="{{ url_for('static', filename='js/pwa.js') }}"></script>
</body>
</html>