184 lines
7.9 KiB
HTML
184 lines
7.9 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="ja">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>ブランチサマリー</title>
|
||
<script src="https://cdn.tailwindcss.com"></script>
|
||
<style>
|
||
body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Hiragino Sans', sans-serif; }
|
||
.line-clamp-2 {
|
||
display: -webkit-box;
|
||
-webkit-line-clamp: 2;
|
||
-webkit-box-orient: vertical;
|
||
overflow: hidden;
|
||
}
|
||
</style>
|
||
</head>
|
||
<body class="bg-white p-4">
|
||
<div class="w-[420px] h-[650px] mx-auto flex flex-col">
|
||
|
||
<!--
|
||
============================================================
|
||
ブランチサマリーは2パターンあります:
|
||
|
||
1. デフォルトブランチ（main等）: 緑
|
||
- 「今日反映された変更」セクション
|
||
- 累計情報は表示しない（意味がないため）
|
||
|
||
2. その他のブランチ（作業ブランチ）: 青
|
||
- 「今日の作業内容」セクション
|
||
- 累計/今日/開発者/日目を表示
|
||
|
||
判定方法:
|
||
DEFAULT_BRANCH=$(gh api repos/{owner}/{repo} --jq '.default_branch')
|
||
|
||
⚠️ ラベルは常にブランチ名をそのまま表示（main, feature/xxx, fix/xxx等）
|
||
============================================================
|
||
-->
|
||
|
||
<!-- Header -->
|
||
<div class="flex items-center justify-between mb-4">
|
||
<div class="flex items-center gap-2">
|
||
<!--
|
||
デフォルトブランチ: bg-green-500
|
||
その他: bg-blue-500
|
||
fix/*: bg-orange-500
|
||
-->
|
||
<div class="w-8 h-8 rounded-lg bg-green-500 flex items-center justify-center">
|
||
<svg class="w-4 h-4 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24" stroke-width="2">
|
||
<path stroke-linecap="round" stroke-linejoin="round" d="M7 21a4 4 0 01-4-4V5a2 2 0 012-2h4a2 2 0 012 2v12a4 4 0 01-4 4zm0 0h12a2 2 0 002-2v-4a2 2 0 00-2-2h-2.343M11 7.343l1.657-1.657a2 2 0 012.828 0l2.829 2.829a2 2 0 010 2.828l-8.486 8.485M7 17h.01"/>
|
||
</svg>
|
||
</div>
|
||
<div>
|
||
<h1 class="text-base font-semibold text-slate-900">{branch_name}</h1>
|
||
<p class="text-xs text-slate-500">{repository_name}</p>
|
||
</div>
|
||
</div>
|
||
<!--
|
||
色の決定（ラベルは常にブランチ名をそのまま表示）:
|
||
デフォルトブランチ: bg-green-100 text-green-700
|
||
その他: bg-blue-100 text-blue-700
|
||
fix/*: bg-orange-100 text-orange-700
|
||
|
||
⚠️ ラベルは常にブランチ名をそのまま表示
|
||
-->
|
||
<span class="px-2 py-1 bg-green-100 text-green-700 text-xs font-medium rounded">{branch_name}</span>
|
||
</div>
|
||
|
||
<!--
|
||
============================================================
|
||
【デフォルトブランチ用】今日反映された変更
|
||
- 「目的」ではなく「今日反映された内容」を表示
|
||
- 累計情報セクションは表示しない
|
||
============================================================
|
||
-->
|
||
<div class="p-3 mb-4 bg-gradient-to-r from-green-50 to-emerald-50 rounded-lg border border-green-100">
|
||
<div class="flex items-start gap-2">
|
||
<svg class="w-4 h-4 text-green-500 mt-0.5 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24" stroke-width="2">
|
||
<path stroke-linecap="round" stroke-linejoin="round" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"/>
|
||
</svg>
|
||
<div>
|
||
<p class="text-sm font-medium text-slate-700 mb-1">今日反映された変更</p>
|
||
<!-- 今日のコミット内容をまとめて表示 -->
|
||
<p class="text-sm text-slate-600">{today_changes_summary}</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- デフォルトブランチ: 今日のコミット数のみ表示 -->
|
||
<div class="flex items-center justify-center gap-6 py-3 mb-4 bg-slate-50 rounded-lg">
|
||
<div class="text-center">
|
||
<div class="text-xl font-bold text-green-600">+{today_commits}</div>
|
||
<div class="text-xs text-slate-500">今日の反映</div>
|
||
</div>
|
||
<div class="w-px h-8 bg-slate-200"></div>
|
||
<div class="text-center">
|
||
<div class="text-xl font-bold text-slate-900">{contributor_count}</div>
|
||
<div class="text-xs text-slate-500">コントリビューター</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!--
|
||
============================================================
|
||
【作業ブランチ用（その他）】今日の作業内容
|
||
- 以下はコメントアウトしてありますが、作業ブランチの場合はこちらを使用
|
||
============================================================
|
||
|
||
<div class="p-3 mb-4 bg-gradient-to-r from-blue-50 to-indigo-50 rounded-lg border border-blue-100">
|
||
<div class="flex items-start gap-2">
|
||
<svg class="w-4 h-4 text-blue-500 mt-0.5 flex-shrink-0" fill="currentColor" viewBox="0 0 24 24">
|
||
<path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-6h2v6zm0-8h-2V7h2v2z"/>
|
||
</svg>
|
||
<div>
|
||
<p class="text-sm font-medium text-slate-700 mb-1">今日の作業内容</p>
|
||
<p class="text-sm text-slate-600">{work_summary}</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="flex items-center justify-between gap-3 mb-4">
|
||
<div class="flex-1 p-3 bg-slate-50 rounded-lg text-center">
|
||
<div class="text-lg font-bold text-slate-900">{total_commits}</div>
|
||
<div class="text-xs text-slate-500">累計</div>
|
||
</div>
|
||
<div class="flex-1 p-3 bg-blue-50 rounded-lg text-center border border-blue-100">
|
||
<div class="text-lg font-bold text-blue-600">+{today_commits}</div>
|
||
<div class="text-xs text-slate-500">今日</div>
|
||
</div>
|
||
<div class="flex-1 p-3 bg-slate-50 rounded-lg text-center">
|
||
<div class="text-lg font-bold text-slate-900">{contributor_count}</div>
|
||
<div class="text-xs text-slate-500">開発者</div>
|
||
</div>
|
||
<div class="flex-1 p-3 bg-slate-50 rounded-lg text-center">
|
||
<div class="text-lg font-bold text-slate-900">{days_active}</div>
|
||
<div class="text-xs text-slate-500">日目</div>
|
||
</div>
|
||
</div>
|
||
-->
|
||
|
||
<!-- Today's Highlights (最大4件) -->
|
||
<div class="flex-1 overflow-hidden">
|
||
<div class="flex items-center gap-2 mb-3">
|
||
<svg class="w-5 h-5 text-amber-500" fill="currentColor" viewBox="0 0 24 24">
|
||
<path d="M12 2L15.09 8.26L22 9.27L17 14.14L18.18 21.02L12 17.77L5.82 21.02L7 14.14L2 9.27L8.91 8.26L12 2Z"/>
|
||
</svg>
|
||
<span class="text-sm font-semibold text-slate-900">今日のハイライト</span>
|
||
</div>
|
||
<div class="space-y-2">
|
||
<!--
|
||
ハイライトカード（繰り返し、最大4件）
|
||
種別タグ: 新機能(green), 改善(blue), 修正(purple)
|
||
-->
|
||
<div class="p-3 bg-amber-50 rounded-lg border border-amber-100">
|
||
<div class="flex items-center gap-2 mb-1.5">
|
||
<!-- 種別タグ: + 新機能 / ↑ 改善 / ~ 修正 -->
|
||
<div class="flex items-center gap-1.5 px-2 py-0.5 bg-blue-100 rounded text-xs text-blue-700">
|
||
<span>↑</span>
|
||
<span>改善</span>
|
||
</div>
|
||
</div>
|
||
<!-- ビジネス視点での説明（技術用語を避ける） -->
|
||
<div class="text-sm text-slate-800">{highlight_description}</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Footer -->
|
||
<div class="border-t border-slate-200 pt-3 mt-3">
|
||
<div class="flex items-center justify-between">
|
||
<div class="flex items-center gap-3 text-xs text-slate-500">
|
||
<!--
|
||
デフォルトブランチ: 「最終: {datetime}」のみ
|
||
作業ブランチ: 「開始: {date} • 最終: {datetime}」
|
||
-->
|
||
<span>最終: {last_commit_datetime}</span>
|
||
</div>
|
||
<div class="text-xs text-slate-400">Generated by Claude Code</div>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
</body>
|
||
</html>
|