顶栏上下留白按 1.1 倍标题高度,标题、导航与页面内容间距统一。

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
dekun
2026-10-04 20:33:07 +08:00
parent 55b2a48026
commit 2c0e25eaf8
2 changed files with 14 additions and 12 deletions
+13 -11
View File
@@ -18,6 +18,10 @@
--radius: 14px; --radius: 14px;
--font: "IBM Plex Sans", "Segoe UI", sans-serif; --font: "IBM Plex Sans", "Segoe UI", sans-serif;
--font-display: "Orbitron", "IBM Plex Sans", sans-serif; --font-display: "Orbitron", "IBM Plex Sans", sans-serif;
--hub-title-size: 1.75rem;
--hub-title-lh: 1.25;
--hub-title-h: calc(var(--hub-title-size) * var(--hub-title-lh));
--hub-title-gap: calc(var(--hub-title-h) * 1.1);
} }
* { box-sizing: border-box; } * { box-sizing: border-box; }
html, body { min-height: 100%; } html, body { min-height: 100%; }
@@ -50,14 +54,15 @@ a:hover { color: #7dd3fc; }
.topbar-brand { .topbar-brand {
display: block; display: block;
margin: 0 auto 12px; margin: 0 auto var(--hub-title-gap);
padding-top: var(--hub-title-gap);
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
font-size: 1.75rem; font-size: var(--hub-title-size);
font-weight: 700; font-weight: 700;
letter-spacing: 0; letter-spacing: 0;
text-indent: 0; text-indent: 0;
color: #dbe4ff; color: #dbe4ff;
line-height: 1.25; line-height: var(--hub-title-lh);
text-align: center; text-align: center;
} }
.topbar-brand:hover { .topbar-brand:hover {
@@ -68,7 +73,7 @@ a:hover { color: #7dd3fc; }
grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
align-items: center; align-items: center;
gap: 10px 12px; gap: 10px 12px;
margin: 0 0 12px; margin: 0 0 var(--hub-title-gap);
} }
.topbar-nav { .topbar-nav {
grid-column: 2; grid-column: 2;
@@ -186,10 +191,7 @@ a:hover { color: #7dd3fc; }
} }
} }
@media (max-width: 720px) { @media (max-width: 720px) {
.topbar-brand { :root { --hub-title-size: 1rem; }
margin-bottom: 12px;
font-size: 1rem;
}
.topbar-nav a { .topbar-nav a {
padding: 8px 12px; padding: 8px 12px;
font-size: 0.78rem; font-size: 0.78rem;
@@ -204,7 +206,7 @@ a:hover { color: #7dd3fc; }
width: 100%; width: 100%;
max-width: 1200px; max-width: 1200px;
margin: 0 auto; margin: 0 auto;
padding: 14px clamp(6px, 1vw, 14px) 16px; padding: 0 clamp(6px, 1vw, 14px) 16px;
} }
/* 总览/实例与客户端一致: 铺满,带鱼屏锁 1800 */ /* 总览/实例与客户端一致: 铺满,带鱼屏锁 1800 */
body.page-dashboard .main, body.page-dashboard .main,
@@ -212,7 +214,7 @@ body.page-instances .main {
max-width: none; max-width: none;
width: 100%; width: 100%;
margin: 0 auto; margin: 0 auto;
padding: 14px clamp(6px, 1vw, 14px) 16px; padding: 0 clamp(6px, 1vw, 14px) 16px;
} }
@media (min-aspect-ratio: 21/9) { @media (min-aspect-ratio: 21/9) {
body.page-dashboard .main, body.page-dashboard .main,
@@ -224,7 +226,7 @@ body.page-desk .main {
max-width: none; max-width: none;
width: 100%; width: 100%;
margin: 0; margin: 0;
padding: 10px 12px 14px; padding: 0 12px 14px;
} }
body.page-login { body.page-login {
min-height: 100vh; min-height: 100vh;
+1 -1
View File
@@ -4,7 +4,7 @@
<meta charset="utf-8"> <meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
<title>{% block title %}加密货币|OKX 期权中控{% endblock %}</title> <title>{% block title %}加密货币|OKX 期权中控{% endblock %}</title>
<link rel="stylesheet" href="{{ url_for('static', filename='hub.css') }}?v=27"> <link rel="stylesheet" href="{{ url_for('static', filename='hub.css') }}?v=29">
</head> </head>
<body class="{% if request.path.startswith('/login') %}page-login{% elif request.path.startswith('/desk') %}page-desk{% elif request.path.startswith('/stats') %}page-stats{% elif request.path.startswith('/instances') %}page-instances{% elif request.path == '/' %}page-dashboard{% endif %}"> <body class="{% if request.path.startswith('/login') %}page-login{% elif request.path.startswith('/desk') %}page-desk{% elif request.path.startswith('/stats') %}page-stats{% elif request.path.startswith('/instances') %}page-instances{% elif request.path == '/' %}page-dashboard{% endif %}">
{% if session.get('logged_in') %} {% if session.get('logged_in') %}