陈世睿
75 lines
4.7 KiB
HTML
75 lines
4.7 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="zh-CN">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<link rel="stylesheet" href="../shared/fonts.css">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover">
|
||
<title>活动规则 · 傻瓜比价</title>
|
||
<style>
|
||
* { margin: 0; padding: 0; box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
|
||
/* WebView 是 MATCH_PARENT，height:100% 链即可拿到真实视口高；页面本身不滚动，内部 .body 才滚。 */
|
||
html, body { height: 100%; overflow: hidden; }
|
||
body { font-family: 'PuHuiTi', -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Helvetica Neue', sans-serif; background: #FAFAFA; color: #1A1A1A; }
|
||
|
||
/* 【去框】原型 .device 375x812 预览框 → 全屏自适应容器（无 min-height:100vh，避免顶栏下移） */
|
||
.device { position: relative; width: 100%; height: 100%; background: #FAFAFA; overflow: hidden; }
|
||
.screen { position: absolute; inset: 0; display: flex; flex-direction: column; }
|
||
|
||
/* header —— 与设置/记录等已改造页统一：48px 高、返回居左、标题居中 */
|
||
.hdr { height: 48px; flex-shrink: 0; display: flex; align-items: center; padding: 0 8px; position: relative; background: #FAFAFA; }
|
||
.hdr-back { width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; background: none; border: none; cursor: pointer; padding: 0; }
|
||
.hdr-back:active { opacity: .5; }
|
||
.hdr-back svg { width: 24px; height: 24px; display: block; }
|
||
.hdr-title { position: absolute; left: 50%; transform: translateX(-50%); font-size: 17px; font-weight: 600; color: #1A1A1A; }
|
||
|
||
/* body 内容区可滚 */
|
||
.body { flex: 1; min-height: 0; overflow-y: auto; -webkit-overflow-scrolling: touch; padding: 12px 16px calc(24px + env(safe-area-inset-bottom, 0px)); }
|
||
.body::-webkit-scrollbar { display: none; }
|
||
|
||
/* 规则卡片 */
|
||
.card { background: #FFFFFF; border-radius: 14px; padding: 16px; box-shadow: 0 4px 14px rgba(0,0,0,.04); }
|
||
.card-title { font-size: 18px; font-weight: 600; color: #1A1A1A; margin-bottom: 12px; }
|
||
.rules-list { display: flex; flex-direction: column; gap: 12px; }
|
||
.rule-item { display: grid; grid-template-columns: 20px 1fr; gap: 8px; }
|
||
.rule-no { width: 20px; height: 20px; border-radius: 50%; background: #FFF3C4; color: #8B6914; font-size: 11px; font-weight: 600; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
|
||
.rule-text { font-size: 13px; line-height: 20px; font-weight: 400; color: #666666; }
|
||
.rule-text strong { display: block; font-size: 14px; font-weight: 700; color: #1A1A1A; margin-bottom: 2px; line-height: 20px; }
|
||
</style>
|
||
</head>
|
||
<body>
|
||
|
||
<div class="device">
|
||
<div class="screen">
|
||
<div class="hdr">
|
||
<button class="hdr-back" onclick="onBack()" aria-label="返回">
|
||
<svg viewBox="0 0 24 24" fill="none"><path d="M15 6L9 12L15 18" stroke="#1A1A1A" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"/></svg>
|
||
</button>
|
||
<div class="hdr-title">活动规则</div>
|
||
</div>
|
||
|
||
<div class="body">
|
||
<div class="card">
|
||
<div class="card-title">活动规则</div>
|
||
<div class="rules-list">
|
||
<div class="rule-item"><span class="rule-no">1</span><div class="rule-text"><strong>金币获取</strong>用户可通过签到、观看视频、打开消息提醒等任务获得金币，具体奖励以页面展示为准。</div></div>
|
||
<div class="rule-item"><span class="rule-no">2</span><div class="rule-text"><strong>任务发放</strong>完成任务后，金币通常会即时到账；如遇网络延迟或系统审核，到账可能会稍有延迟。</div></div>
|
||
<div class="rule-item"><span class="rule-no">3</span><div class="rule-text"><strong>兑换说明</strong>金币可按页面展示比例兑换现金，当前按 10000 金币 = 1 元展示，实际兑换以活动页说明为准。</div></div>
|
||
<div class="rule-item"><span class="rule-no">4</span><div class="rule-text"><strong>邀请奖励</strong>邀请好友奖励按元/现金展示，需好友完成有效注册或指定任务后发放，同一设备、同一账号重复参与不重复计奖。</div></div>
|
||
<div class="rule-item"><span class="rule-no">5</span><div class="rule-text"><strong>异常处理</strong>如发现刷奖励、虚假邀请、异常设备等违规行为，平台有权取消对应奖励和提现资格。</div></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<script src="../shared/bridge.js"></script>
|
||
<script>
|
||
// 返回：交给原生关闭本 H5 路由（回到来源页：赚钱中心 / 邀请页）。系统返回键也走这里。
|
||
window.onBack = function () {
|
||
if (window.SGBridge && SGBridge.closePage) { SGBridge.closePage(); }
|
||
else if (history.length > 1) { history.back(); }
|
||
};
|
||
</script>
|
||
</body>
|
||
</html>
|