Skip to content

Guard storage access for delivery readiness #1

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
love19870821 wants to merge 1 commit into
base: master
Choose a base branch
from
Open

Guard storage access for delivery readiness #1

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
114 changes: 114 additions & 0 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,114 @@
<!doctype html>
<html lang="zh-Hant">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>語音記帳工具 | MiMi Voice Ledger</title>
<link rel="stylesheet" href="styles.css" />
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link
href="https://fonts.googleapis.com/css2?family=Baloo+2:wght@500;600;700&family=Noto+Sans+TC:wght@400;500;700&display=swap"
rel="stylesheet"
/>
</head>
<body>
<div class="app">
<header class="hero">
<div>
<p class="tag">✨ 智能語音記帳 ✨</p>
<h1>MiMi Voice Ledger</h1>
<p class="subtitle">跟著說一句，收入支出自動整理，記帳也可以很可愛。</p>
</div>
<div class="hero-card">
<div class="total">
<span>本月結餘</span>
<strong id="balance">$0</strong>
</div>
<div class="progress">
<div class="progress-bar" id="progressBar"></div>
</div>
<div class="summary">
<div>
<p>收入</p>
<strong id="income">$0</strong>
</div>
<div>
<p>支出</p>
<strong id="expense">$0</strong>
</div>
</div>
</div>
</header>

<main>
<section class="voice-panel">
<div class="mic-wrapper">
<button id="micButton" class="mic-button" aria-label="開始語音記帳">
<span class="mic-icon">🎙️</span>
<span id="micText">點擊開始</span>
</button>
<div class="pulse" id="pulse"></div>
</div>
<div class="speech-display">
<p class="label">即時辨識</p>
<p id="liveSpeech" class="speech">準備好說："早餐 80 元"</p>
<div class="chips">
<button class="chip" data-demo="早餐 80 元">早餐 80 元</button>
<button class="chip" data-demo="收到薪水 32000 元">收到薪水 32000 元</button>
<button class="chip" data-demo="咖啡 支出 120">咖啡 支出 120</button>
</div>
<p id="speechStatus" class="status"></p>
</div>
</section>

<section class="entry-panel">
<div class="panel-header">
<h2>今日記錄</h2>
<div class="filters">
<button class="filter active" data-filter="all">全部</button>
<button class="filter" data-filter="income">收入</button>
<button class="filter" data-filter="expense">支出</button>
</div>
</div>
<div class="input-row">
<input id="manualText" type="text" placeholder="輸入備註，例如：捷運 50 元" />
<input id="manualAmount" type="number" placeholder="金額" />
<select id="manualType">
<option value="expense">支出</option>
<option value="income">收入</option>
</select>
<button id="addEntry">加入</button>
</div>
<div id="entryList" class="entry-list"></div>
</section>

<section class="insight-panel">
<h2>甜甜圈分析</h2>
<div class="insight-card">
<div class="donut">
<svg viewBox="0 0 120 120">
<circle class="donut-track" cx="60" cy="60" r="46" />
<circle class="donut-fill" cx="60" cy="60" r="46" id="donutFill" />
</svg>
<div class="donut-center">
<span>支出佔比</span>
<strong id="expenseRatio">0%</strong>
</div>
</div>
<div class="insight-text">
<p id="insightMessage">今天的支出還很乖，繼續保持！</p>
<ul>
<li>可說出「收入」或「支出」關鍵字</li>
<li>說完立即加入記帳清單</li>
<li>所有資料都保存在你的裝置</li>
</ul>
</div>
</div>
</section>
</main>
</div>

<script src="script.js"></script>
</body>
</html>
Loading