前幾天把抽卡和收藏功能接起來之後，今天先暫時離開收藏頁，開始往下一個原本就規劃好的功能前進：時間紀錄。
不過在真的開始記錄時間之前，我先回頭整理了一下目前的番茄鐘操作，再替後面的時間功能建立基本頁面。

先整理一下番茄鐘

原本番茄鐘頁面上有「開始、暫停、放棄」三個按鈕。

但從 TODAY'S GOALS 選擇任務進入番茄鐘後，倒數本來就會自動開始，所以「開始」按鈕其實沒有太大的作用。
因此這次把「開始」移除，並把暫停和繼續整合成同一顆按鈕：

倒數中 → 顯示「暫停」
暫停後 → 顯示「繼續」
繼續後 → 從剩餘時間接著倒數

另外也一起整理了番茄鐘頁面的視覺，移除原本最上方的 Header，重新調整返回、暫停和放棄按鈕的樣式，讓頁面和目前其他功能的視覺比較一致。

在記錄時間之前，先建立入口

番茄鐘整理完之後，接下來準備處理的是之前規劃過的「時間紀錄」。
除了記錄每一次實際投入的專注時間之外，後面還有「共同時間罐」的功能，所以我決定先建立一個獨立的時間頁面，把這兩個功能放在同一個地方。
原本首頁左上角有一個沒有實際功能的愛心圖示，這次把它改成時間圖示 ◷，並讓它成為時間頁的入口：

首頁 ◷
↓
時間頁 time.html

點擊之後，就可以從主畫面進入新的時間頁。

先把時間頁的骨架搭起來

這次新增了三個檔案：

time.html
time.css
time.js

頁面目前先分成兩個主要 Tab：

時間紀錄｜共同時間罐

兩個 Tab 下方也各自建立了對應的內容區，版面則延續前面收藏頁的設計方式，包括返回按鈕、Tab 和虛線內容框，不過目前兩個內容區都先保持空白。

今天先做到架構

目前還沒有真的把番茄鐘產生的時間資料放進來，也還沒有決定「時間紀錄」和「共同時間罐」裡最後要顯示哪些資訊，今天先把入口、頁面和兩個功能區的基本架構建立起來：

番茄鐘操作簡化 → 時間功能入口 → 時間頁骨架 → 兩個功能區的基本架構

下一步再開始處理真正的時間資料，讓番茄鐘不只記得「有沒有完成」，也能留下實際投入的時間。