wow

src/components/DDay.astro

@@ -0,0 +1,27 @@
+---
+export interface Props {
+  targetDate: string;
+  label: string;
+}
+
+const { targetDate, label } = Astro.props;
+---
+
+<div class="flex flex-col items-end text-right text-sm">
+  <span id="dday-label">D-Day</span>
+  <span class="text-muted-foreground">{label} | {new Date(targetDate).toDateString()}</span>
+</div>
+
+<script define:vars={{ targetDate }}>
+  const today = new Date();
+  const target = new Date(targetDate);
+  const diffTime = target.getTime() - today.getTime();
+  const diffDays = Math.ceil(diffTime / (1000 * 60 * 60 * 24));
+  
+  let label = "D-Day";
+  if (diffDays > 0) label = `D-${diffDays}`;
+  else if (diffDays < 0) label = `D+${Math.abs(diffDays)}`;
+  
+  const el = document.getElementById('dday-label');
+  if (el) el.textContent = label;
+</script>