173 lines
5.8 KiB
HTML
173 lines
5.8 KiB
HTML
<!doctype html>
|
|
<html lang="zh-CN" data-theme="ink">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta
|
|
name="viewport"
|
|
content="width=device-width, initial-scale=1.0, user-scalable=no"
|
|
/>
|
|
<meta name="apple-mobile-web-app-capable" content="yes" />
|
|
<meta name="theme-color" content="#1a1a2e" />
|
|
<title>梅子的成语填字</title>
|
|
<link rel="manifest" href="manifest.json" />
|
|
<link rel="apple-touch-icon" href="icons/icon-192.png?v=3" />
|
|
<link rel="stylesheet" href="style.css?v=3" />
|
|
</head>
|
|
<body>
|
|
<div class="header">
|
|
<a
|
|
href="https://m1ngdaxie.com"
|
|
class="icon-btn back-btn"
|
|
style="text-decoration: none"
|
|
>←</a
|
|
>
|
|
<div class="header-title">梅子的成语填字</div>
|
|
<div class="header-right">
|
|
<button class="icon-btn" id="btnSound">🔊</button>
|
|
<div class="theme-btn-wrap" id="themeBtnWrap">
|
|
<button class="icon-btn" id="btnTheme" title="切换主题">🌙</button>
|
|
<div class="theme-tooltip" id="themeTooltip">
|
|
新！点我切换白天/夜间模式 ✨
|
|
<div class="theme-tooltip-arrow"></div>
|
|
</div>
|
|
</div>
|
|
<button class="icon-btn" id="btnCheckin">📅</button>
|
|
</div>
|
|
</div>
|
|
<div class="info-bar">
|
|
<div class="info-item">今日 <span id="statScore">0</span>分</div>
|
|
<div class="info-divider"></div>
|
|
<div class="info-item">
|
|
<span id="flameIcon">🔥</span> <span id="statCombo">0</span> 连击
|
|
</div>
|
|
<div class="info-divider"></div>
|
|
<div class="info-item info-wb" id="btnWrongBook">
|
|
📖 错题本 <span class="wb-badge" id="wbBadge">0</span>
|
|
</div>
|
|
</div>
|
|
<div style="display: none">
|
|
<span id="statTotal">0</span><span id="statStreak">0</span>
|
|
</div>
|
|
<div class="diff-control">
|
|
<button class="diff-btn active" data-diff="1">简单</button>
|
|
<button class="diff-btn" data-diff="2">中等</button>
|
|
<button class="diff-btn" data-diff="3">困难</button>
|
|
</div>
|
|
<div class="game-area">
|
|
<div class="progress-bar" id="progressBar"></div>
|
|
<div id="comboDisplay" style="display: none"></div>
|
|
<div class="idiom-display" id="idiomDisplay"></div>
|
|
<div id="optLabel" style="display: none"></div>
|
|
<div class="options-grid" id="optionsGrid"></div>
|
|
<div class="action-bar">
|
|
<button class="action-btn secondary" id="btnHint">💡 提示</button>
|
|
<button class="action-btn secondary" id="btnSkip">⏭ 跳过</button>
|
|
<button class="action-btn primary" id="btnNext" style="display: none">
|
|
下一题 →
|
|
</button>
|
|
</div>
|
|
<div id="resultArea"></div>
|
|
</div>
|
|
<div class="combo-toast" id="comboToast"></div>
|
|
|
|
<div class="modal-overlay" id="wrongBookModal">
|
|
<div class="modal">
|
|
<div
|
|
class="modal-header"
|
|
style=""
|
|
>
|
|
<div class="streak-display" id="wbCount">0</div>
|
|
<div class="streak-label">道错题待复习 📖</div>
|
|
</div>
|
|
<div class="modal-body wb-body" id="wbList"></div>
|
|
<div class="wb-actions">
|
|
<button class="action-btn secondary" id="closeWrongBook">
|
|
继续答题
|
|
</button>
|
|
<button class="action-btn primary" id="btnStartReview">
|
|
练习错题 →
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="modal-overlay" id="whatsNewModal">
|
|
<div class="modal">
|
|
<div
|
|
class="modal-header"
|
|
style=""
|
|
>
|
|
<div style="font-size: 2.2rem">🎉</div>
|
|
<div
|
|
class="streak-label"
|
|
style="font-size: 1.1rem; font-weight: 900; margin-top: 6px"
|
|
>
|
|
新功能上线啦！
|
|
</div>
|
|
</div>
|
|
<div class="modal-body">
|
|
<div class="wn-item">
|
|
<span class="wn-icon">📖</span>
|
|
<div>
|
|
<b>错题本</b>
|
|
<div class="wn-desc">
|
|
答错的成语自动收录，随时可以回来专项练习，越练越强！
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="wn-item">
|
|
<span class="wn-icon">🎨</span>
|
|
<div>
|
|
<b>全新界面</b>
|
|
<div class="wn-desc">
|
|
更清爽的布局，手机上看更舒服，为妈妈优化 💕
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<button class="close-modal" id="closeWhatsNew">
|
|
知道了，开始答题！
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="modal-overlay" id="checkinModal">
|
|
<div class="modal">
|
|
<div class="modal-header">
|
|
<div class="streak-display" id="modalStreak">0</div>
|
|
<div class="streak-label">天连续打卡 🌸</div>
|
|
</div>
|
|
<div class="modal-body">
|
|
<div class="daily-goal">
|
|
<div class="daily-goal-label">
|
|
今日目标：<span id="modalTodayCount">0</span> / 5 题完成
|
|
</div>
|
|
<div class="daily-goal-bar">
|
|
<div
|
|
class="daily-goal-fill"
|
|
id="modalGoalFill"
|
|
style="width: 0%"
|
|
></div>
|
|
</div>
|
|
</div>
|
|
<div class="calendar" id="modalCalendar"></div>
|
|
<p
|
|
style="font-size: 0.75rem; color: var(--text2); text-align: center"
|
|
>
|
|
每日完成5题即可打卡 ✓
|
|
</p>
|
|
</div>
|
|
<button class="close-modal" id="closeModal">关闭</button>
|
|
</div>
|
|
</div>
|
|
|
|
<script src="data.js?v=3"></script>
|
|
<script src="app.js?v=3"></script>
|
|
<script>
|
|
if ('serviceWorker' in navigator) {
|
|
navigator.serviceWorker.register('/sw.js');
|
|
}
|
|
</script>
|
|
</body>
|
|
</html>
|