# 今日の気分ログ

![今日の気分ログ バナー](./assets/banner.png)

今日の気分を **色・ラベル・ひとこと** で気軽に残せる、ブラウザだけで完結するセルフログアプリです。

> **公開 URL**: https://jun76-app365.pages.dev/001-kibun-log/

---

## 使い方

### 1. 今日の気分を記録する（ホームタブ）

1. **気分カラー**（8色）を選ぶ
2. **気分ラベル**（すっきり / おだやか / 集中 / たのしい / つかれた / もやもや / 不安 / 回復中）を選ぶ
3. 任意で **エネルギー**（★1〜5）とひとこと（70文字以内）を入力
4. 「保存する」をタップ

同じ日に既に記録がある場合は「上書き」か「追記」かを選べます。

### 2. 月間カレンダーで振り返る（カレンダータブ）

- 月ごとにカレンダーを表示。記録のある日には気分カラーの点が付きます。
- 日付をタップするとその日の記録詳細が表示されます。
- ‹ › ボタンで月を切り替えられます。

### 3. 記録一覧を見る（一覧タブ）

- すべての記録を時系列で表示します。
- 色別・ラベル別のフィルタで絞り込めます。

### 4. X（Twitter）に投稿する

- ホームの「今日の記録」から「X に投稿」ボタンをタップすると、投稿テキストが自動生成されます。
- 投稿文には気分ラベル・ひとこと・気分カラー名・`#今日の気分ログ`・公開 URL が含まれます。
- 公開 URL のプレビューで `assets/banner.png` が表示されるよう、OGP / Twitter Card メタデータを設定しています。

---

## データ保存仕様

| 項目 | 内容 |
|------|------|
| 保存先 | ブラウザの `localStorage` |
| キー | `kibun-log-v1` |
| 形式 | JSON 配列 |
| サーバー送信 | なし（ローカルのみ） |

### レコード例

```json
{
  "id": "2026-06-24T08:15:00.000Z",
  "date": "2026-06-24",
  "moodColor": "sky",
  "moodLabel": "おだやか",
  "energy": 4,
  "note": "冷たい風で少し落ち着いた",
  "schemaVersion": 1,
  "createdAt": "2026-06-24T08:15:00.000Z",
  "updatedAt": "2026-06-24T08:15:00.000Z"
}
```

### 気分カラー一覧

| ID | 名前 | カラーコード |
|----|------|-------------|
| sky | 空 | #87CEEB |
| sunshine | 陽 | #FFE082 |
| coral | サンゴ | #FFAB91 |
| mint | ミント | #A5D6A7 |
| lavender | ラベンダー | #CE93D8 |
| peach | モモ | #FFCC80 |
| mist | 霧 | #B0BEC5 |
| indigo | 藍 | #9FA8DA |

---

## データの管理

設定タブからエクスポート（JSON ダウンロード）・インポート・全削除が行えます。

---

## 技術構成

- 素の HTML / CSS / JavaScript（外部依存ゼロ）
- データは `localStorage` に保存（バックエンド不要）
- Cloudflare Pages でホスト
- 1 サイト配下のサブディレクトリ `/001-kibun-log/` として公開
