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

Add responsive mobile layout, records cards, and tablet settings fold fix.

Browse Source 
Mobile gets compact trade/records UI with detail modals; static assets are cache-busted and settings cards fold correctly on tablet grid layout.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
dekun
2026-06-29 16:42:38 +08:00
parent 44bec23296
commit c5262a0a54
14 changed files with 1465 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files
templates/base.html
+39 -8
View File
@@ -24,11 +24,32 @@
}
} catch (e) { /* ignore */ }
</script>
<script src="{{ url_for('static', filename='js/theme.js') }}"></script>
<link rel="stylesheet" href="{{ url_for('static', filename='css/base.css') }}">
<link rel="stylesheet" href="{{ url_for('static', filename='css/tech.css') }}">
<link rel="stylesheet" href="{{ url_for('static', filename='css/responsive.css') }}">
<script>
(function () {
var ua = navigator.userAgent || '';
var isIpad = /iPad/i.test(ua) || (navigator.platform === 'MacIntel' && navigator.maxTouchPoints > 1);
var isTabletUa = isIpad || (/Android/i.test(ua) && !/Mobile/i.test(ua));
var isPhoneUa = !isTabletUa && (/iPhone|iPod|Android.*Mobile|HarmonyOS|OpenHarmony|Mobile/i.test(ua));
var s = Math.min(window.screen.width || 0, window.screen.height || 0);
var coarse = window.matchMedia('(hover: none) and (pointer: coarse)').matches;
var layout = 'desktop';
if (isPhoneUa || (s > 0 && s < 600)) layout = 'phone';
else if (isTabletUa || (s >= 600 && s <= 1100 && coarse)) layout = 'tablet';
else if (window.innerWidth <= 767) layout = 'phone';
var root = document.documentElement;
root.dataset.layout = layout;
root.dataset.mobile = layout === 'phone' ? '1' : '0';
root.dataset.orientation = layout === 'phone' ? 'portrait' : (window.innerWidth >= window.innerHeight ? 'landscape' : 'portrait');
if (layout === 'phone') root.classList.add('layout-phone');
else if (layout === 'tablet') root.classList.add('layout-tablet');
})();
</script>
<script src="{{ url_for('static', filename='js/theme.js') }}?v={{ asset_v }}"></script>
<link rel="stylesheet" href="{{ url_for('static', filename='css/base.css') }}?v={{ asset_v }}">
<link rel="stylesheet" href="{{ url_for('static', filename='css/tech.css') }}?v={{ asset_v }}">
<link rel="stylesheet" href="{{ url_for('static', filename='css/responsive.css') }}?v={{ asset_v }}">
{% block extra_css %}{% endblock %}
<link rel="stylesheet" href="{{ url_for('static', filename='css/mobile.css') }}?v={{ asset_v }}">
</head>
<body>
<div class="tech-bg" aria-hidden="true">
@@ -43,6 +64,10 @@
<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>
<h1 class="site-title">
<span class="site-title-mobile">期货监控</span>
<span class="site-title-desktop">国内期货 · 交易复盘系统<span class="site-title-sub">Position Management · Disciplined Execution</span></span>
</h1>
<div class="header-tools">
<div class="theme-switch" role="group" aria-label="主题模式">
<button type="button" class="theme-switch-btn" data-theme-pick="dark">深色</button>
@@ -53,7 +78,6 @@
<div class="user-bar">{{ session.username or '用户' }}<a href="{{ url_for('logout') }}">退出</a></div>
</div>
<p class="pwa-ios-hint" id="pwa-ios-hint">iOS 安装：Safari 浏览器点击底部分享按钮，选择「添加到主屏幕」。</p>
<h1 class="site-title">国内期货 · 交易复盘系统<span class="site-title-sub">Position Management · Disciplined Execution</span></h1>
<button type="button" class="nav-backdrop" id="nav-backdrop" aria-label="关闭菜单" hidden></button>
<nav class="site-nav" id="site-nav">
<a href="{{ url_for('positions') }}" class="{% if request.endpoint in ('positions', 'trade_page', 'recommend_page') %}active{% endif %}">下单监控</a>
@@ -73,9 +97,16 @@
{% block content %}{% endblock %}
</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>
<div id="orientation-lock" class="orientation-lock" hidden>
<div class="orientation-lock-box">
<div class="orientation-lock-icon" aria-hidden="true">↻</div>
<p id="orientation-lock-msg">请旋转设备</p>
</div>
</div>
<script src="{{ url_for('static', filename='js/orientation.js') }}?v={{ asset_v }}"></script>
<script src="{{ url_for('static', filename='js/symbol.js') }}?v={{ asset_v }}"></script>
<script src="{{ url_for('static', filename='js/nav.js') }}?v={{ asset_v }}"></script>
<script src="{{ url_for('static', filename='js/pwa.js') }}?v={{ asset_v }}"></script>
{% block extra_js %}{% endblock %}
</body>
</html>