From d99257162f7efd06f9e8561709a058e4af0ed853 Mon Sep 17 00:00:00 2001
From: dylanbenzi <dylanbenzi@gmail.com>
Date: Sun, 12 Apr 2026 00:41:01 -0400
Subject: [PATCH] add layout for data tracking page

---
 app/ui.R | 93 +++++++++++++++++++++++++++++++++++++++++---------------
 1 file changed, 68 insertions(+), 25 deletions(-)

diff --git a/app/ui.R b/app/ui.R
index 2261c7b..2419216 100644
--- a/app/ui.R
+++ b/app/ui.R
@@ -44,32 +44,40 @@ ui <- page_navbar(
         '
         )
       ),
-      card(
-        HTML(
+      layout_columns(
+        col_widths = 12,
+        card(
+          HTML(
+            '
+          <h4>How to Use This App</h4>
+
+          <h6>1. Find a Storm &mdash; Storm Selector</h6>
+          <p>Browse and filter the full storm database. Use the search bar to find a storm by name, or narrow results by year range, available data types, and normalized cost or fatality thresholds. Click a row to preview storm statistics, then press <b>Load Storm</b> to explore it in detail.</p>
+
+          <h6>2. Explore Storm Data &mdash; Storm Explorer</h6>
+          <p>Once a storm is loaded, four analysis tabs become available:</p>
+          <ul>
+            <li><b>Track:</b> Interactive map of the storm\'s full HURDAT2 track with meteorological observations and a time-series chart of windspeed and pressure.</li>
+
+            <li><b>Cost Normalization:</b> View MMH24 and MMP24 normalized damage indices and losses over time for each landfall. Toggle between index and dollar values, linear and log scale, and individual landfalls.</li>
+
+            <li><b>Human Factors:</b> Animated county-level map showing population and housing unit growth in the affected area from the storm year through 2024.</li>
+
+            <li><b>Fatality Map:</b> State-level direct fatality breakdown by cause, with a category pie chart and state-by-cause heatmap.</li>
+          </ul>
+
+          <h6>Data Availability</h6>
+          <p>All storms include HURDAT2 track data. Cost normalization and fatality data are available for a subset of storms, indicated by the <span class="badge bg-success">Cost</span> and <span class="badge bg-danger">Fatality</span> badges in the Storm Selector.</p>
           '
-        <h4>How to Use This App</h4>
-
-        <h6>1. Find a Storm &mdash; Storm Selector</h6>
-        <p>Browse and filter the full storm database. Use the search bar to find a storm by name, or narrow results by year range, available data types, and normalized cost or fatality thresholds. Click a row to preview storm statistics, then press <b>Load Storm</b> to explore it in detail.</p>
-
-        <h6>2. Explore Storm Data &mdash; Storm Explorer</h6>
-        <p>Once a storm is loaded, four analysis tabs become available:</p>
-        <ul>
-          <li><b>Track:</b> Interactive map of the storm\'s full HURDAT2 track with meteorological observations and a time-series chart of windspeed and pressure.</li>
-
-          <li><b>Cost Normalization:</b> View MMH24 and MMP24 normalized damage indices and losses over time for each landfall. Toggle between index and dollar values, linear and log scale, and individual landfalls.</li>
-
-          <li><b>Human Factors:</b> Animated county-level map showing population and housing unit growth in the affected area from the storm year through 2024.</li>
-
-          <li><b>Fatality Map:</b> State-level direct fatality breakdown by cause, with a category pie chart and state-by-cause heatmap.</li>
-        </ul>
-
-        <h6>Data Availability</h6>
-        <p>All storms include HURDAT2 track data. Cost normalization and fatality data are available for a subset of storms, indicated by the <span class="badge bg-success">Cost</span> and <span class="badge bg-danger">Fatality</span> badges in the Storm Selector.</p>
-        '
+          )
+        ),
+        card(
+          "Contact Us",
+          card_body(
+            "CONTACT US INFO"
+          )
         )
-      )
-      # TODO: contact us information
+      ),
     )
   ),
   nav_panel(
@@ -387,7 +395,42 @@ ui <- page_navbar(
   ),
   nav_menu(
     "Data",
-    nav_panel("What We Track"),
+    nav_panel(
+      "What We Track",
+      layout_columns(
+        col_widths = 12,
+        layout_column_wrap(
+          width = 1 / 4,
+          card(),
+          card(),
+          card(),
+          card()
+        ),
+        layout_columns(
+          col_widths = 6,
+          layout_columns(
+            col_widths = 12,
+            card(card_header("HURDAT2 Integration")),
+            card(card_header("Economic Data")),
+            card(card_header("Population and Housing Growth")),
+            card(card_header("Social Vulnerability"))
+          ),
+          navset_card_tab(
+            height = 600,
+            title = "Geographic Data Coverage",
+            nav_panel(
+              "Cost"
+            ),
+            nav_panel(
+              "Fatality"
+            ),
+            nav_panel(
+              "SVI"
+            )
+          )
+        )
+      )
+    ),
     nav_panel("Export")
   ),
   nav_menu(