/* ===================================================================== theme-vexus.css (Mobile) · 1.paithree.top 手机端统一主题（对齐 2 的 zcx/wap） keystone 产出 · 复用 Home 主题令牌（单一来源，避免色板漂移），再补手机端组件。 引入：经 Application/Mobile/View/Public/head.html 自动带入；或页面 手动： ===================================================================== */ /* --------------------------------------------------------------------- 设计令牌（深色）。原设计经 @import "/Public/Home/static/css/theme-vexus.css" 从 Home 主题统一引入，但本部署缺少该 Home 令牌文件，导致所有 var(--vx-*) 取不到值、整套手机端主题失效（输入框/卡片/按钮回退成透明无样式）。 这里改为本文件内联定义，保证自给自足、不再依赖缺失的同源文件。 ------------------------------------------------------------------- */ :root{ /* 背景 */ --vx-bg:#121420; /* 页面底色（与 base2.css 对齐） */ --vx-bg-grad:linear-gradient(180deg,#171a2b 0%,#0f1018 100%); /* 表面 / 卡片 */ --vx-surface:#1b1d2a; /* 卡片、面板、列表底 */ --vx-surface-2:#242741; /* 次级面：chip、按钮底、消息气泡 */ --vx-surface-3:#1f2230; /* 输入框底（比卡片略亮，便于辨识） */ /* 描边 / 分隔线 */ --vx-line:rgba(255,255,255,.08); /* 文字 */ --vx-text:#eaecf3; /* 主文字 */ --vx-text-2:#bcc1d4; /* 次文字（说明、提示） */ --vx-text-3:#878da0; /* 弱化文字（标签、占位） */ /* 主色（紫色渐变品牌色，对齐后台 vx-theme） */ --vx-primary:#6a4df0; --vx-primary-end:#c05eb0; --vx-primary-grad:linear-gradient(142deg,#3a3ff0 0%,#c05eb0 92%); /* 强调 / 涨跌 */ --vx-accent:#6a4df0; /* 强调色（统一为品牌紫，原金/黄 #f0b90b 已弃用） */ --vx-up:#16c784; /* 涨 / 成功（绿） */ --vx-down:#f6465d; /* 跌 / 失败（红） */ /* 圆角 */ --vx-radius-sm:8px; --vx-radius:12px; --vx-radius-lg:16px; /* 阴影 */ --vx-shadow-sm:0 2px 8px rgba(0,0,0,.25); --vx-shadow:0 10px 28px rgba(0,0,0,.38); /* 字体 */ --vx-font:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"PingFang SC","Microsoft YaHei",Helvetica,Arial,sans-serif; } /* 手机端基底：纯色底（性能优于 fixed 渐变），安全区适配 */ body.vx-theme{ background:var(--vx-bg)!important; color:var(--vx-text); font-family:var(--vx-font); padding-bottom:calc(56px + env(safe-area-inset-bottom,0)); } /* 顶部条 */ .vx-mhead{position:sticky;top:0;z-index:900;display:flex;align-items:center;justify-content:space-between; height:52px;padding:0 16px;background:rgba(17,18,20,.96);border-bottom:1px solid var(--vx-line);} .vx-mhead .vx-logo{font-size:18px;font-weight:800;color:#fff;display:flex;align-items:center;gap:8px;} /* 资产卡（对齐 2 的紫色渐变资产卡） */ .vx-asset-card{background:var(--vx-primary-grad);border-radius:var(--vx-radius-lg);padding:18px;color:#fff;margin:12px;} .vx-asset-card .vx-amt{font-size:26px;font-weight:800;letter-spacing:1px;} /* 快捷入口（充提/兑换/记录…） */ .vx-quick{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:12px;} .vx-quick a{display:flex;flex-direction:column;align-items:center;gap:6px;padding:14px 6px; background:var(--vx-surface);border:1px solid var(--vx-line);border-radius:var(--vx-radius);color:var(--vx-text);font-size:12px;} /* 手机行情行（全宽、左右分布） */ .vx-mrow{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid var(--vx-line);} .vx-mrow .vx-l .vx-sym{font-weight:700;color:#fff;} .vx-mrow .vx-l .vx-pair{font-size:12px;color:var(--vx-text-3);} .vx-mrow .vx-price{font-weight:600;color:#fff;text-align:right;margin-right:10px;} .vx-mrow .vx-pill{min-width:72px;height:34px;} /* 买涨/买跌大按钮（合约/秒合约下单） */ .vx-trade-actions{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:12px 16px;} .vx-trade-actions .vx-btn{height:48px;font-size:16px;} /* 行情涨跌统一样式（首页“行情”对齐“行情页”：价格绿涨红跌文本 + 24h涨跌为绿/红药丸徽章） */ .green{color:var(--vx-up);} .red{color:var(--vx-down);} .fcc{color:var(--vx-text-3);} .market-list-info{display:inline-block;min-width:72px;height:34px;line-height:34px;text-align:center;border-radius:6px;font-weight:600;} .bgreen{background:var(--vx-up);color:#fff;} .bred{background:var(--vx-down);color:#fff;} .bgfcc{background:var(--vx-surface-3);color:var(--vx-text);} /* 底部 tabbar（Home 主题已删除，布局规则改为本文件自给自足：吸底 + 五等分 + 图标竖排 + 选中高亮） */ .vx-tabbar{ position:fixed;left:0;right:0;bottom:0;z-index:950; display:flex;align-items:stretch; background:rgba(17,18,20,.98); border-top:1px solid var(--vx-line); height:calc(56px + env(safe-area-inset-bottom,0)); padding-bottom:env(safe-area-inset-bottom,0); } .vx-tabbar a{ flex:1 1 0;min-width:0; display:flex;flex-direction:column;align-items:center;justify-content:center; gap:3px;color:var(--vx-text-3);font-size:11px;line-height:1; } .vx-tabbar a span{font-size:11px;} .vx-tabbar a.active,.vx-tabbar a.active i{color:var(--vx-primary);} .vx-tabbar i{font-size:20px;line-height:1;} .vx-tabbar img{width:24px;height:24px;}