kaimyo-management/src/app/pages/dashboard/dashboard.html

<app-header></app-header>

<div class="dashboard-page">
  <app-side-menu></app-side-menu>

  <main class="dashboard-main">
    <section class="dashboard-panel">
      <div class="dashboard-heading">
        <h1>ダッシュボード</h1>
        <p>今日よく使う操作</p>
      </div>

      <div class="summary-card-list">
        <a class="summary-card" href="#">
          <p class="summary-label">年次法要の対象</p>
          <p class="summary-main">12 名</p>
          <p class="summary-sub">対象年 2026 を表示中</p>
        </a>

        <a class="summary-card" href="#">
          <p class="summary-label">檀家（世帯）を探す</p>
          <p class="summary-main">一覧へ</p>
          <p class="summary-sub">氏名・住所・電話で確認</p>
        </a>

        <a class="summary-card" href="#">
          <p class="summary-label">まとめて検索</p>
          <p class="summary-main">検索へ</p>
          <p class="summary-sub">檀家・家族・過去帳を横断</p>
        </a>

        <a class="summary-card" href="#">
          <p class="summary-label">新規登録</p>
          <p class="summary-main">追加する</p>
          <p class="summary-sub">檀家・家族・故人を入力</p>
        </a>
      </div>

      <section class="recent-section">
        <div class="section-title-area">
          <h2>最近開いた檀家（世帯）</h2>
          <p>よく使う世帯は一覧からすぐ開けます。</p>
        </div>

        <div class="recent-table">
          <div class="recent-table-header">
            <div>世帯主</div>
            <div>ふりがな</div>
            <div>住所</div>
            <div>家族</div>
            <div>故人</div>
          </div>

          <a class="recent-table-row" href="#">
            <div class="strong">鈴木 太郎</div>
            <div>すずき</div>
            <div>市内 1-2-3</div>
            <div>4名</div>
            <div>2名</div>
          </a>

          <a class="recent-table-row" href="#">
            <div>佐藤 恒一</div>
            <div>さとう</div>
            <div>市内 2-8-1</div>
            <div>3名</div>
            <div>1名</div>
          </a>

          <a class="recent-table-row" href="#">
            <div>田中 雅子</div>
            <div>たなか</div>
            <div>市内 3-4-6</div>
            <div>2名</div>
            <div>0名</div>
          </a>
        </div>
      </section>

      <section class="quick-open-section">
        <h2>すぐ開く</h2>

        <div class="quick-button-list">
          <a class="quick-button" href="#">檀家一覧</a>
          <a class="quick-button" href="#">年次法要一覧</a>
          <a class="quick-button" href="#">まとめて検索</a>
          <a class="quick-button" href="#">家系図</a>
        </div>
      </section>
    </section>
  </main>
</div>