From cd5eeb1782df46c2b139146f586264aebfe4f06c Mon Sep 17 00:00:00 2001
From: Vijay Janapa Reddi <vj@eecs.harvard.edu>
Date: Sun, 16 Nov 2025 23:09:03 -0500
Subject: [PATCH] Fix carousel arrows overlapping GIF - move outside
 carousel-track

Changes to HTML:
- Move carousel-nav outside carousel-track container
- Navigation now appears as separate element below the carousel

Changes to CSS:
- Remove absolute positioning (no longer needed)
- Use simple flexbox layout with margin-top: 1rem
- Remove bottom/left/right positioning properties

This fixes the overlap issue where arrows were positioned at the bottom
of the carousel-track, overlapping the GIF content. Arrows now appear
cleanly below the entire carousel as a separate row.
---
 site/intro.md | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/site/intro.md b/site/intro.md
index 747923c0..1468128c 100644
--- a/site/intro.md
+++ b/site/intro.md
@@ -57,11 +57,11 @@ Build a complete machine learning (ML) framework from tensors to systems—under
         <h4>Validate with History</h4>
       </div>
     </div>
+  </div>
 
-    <div class="carousel-nav">
-      <button class="nav-arrow prev" onclick="moveCarousel(-1)">←</button>
-      <button class="nav-arrow next" onclick="moveCarousel(1)">→</button>
-    </div>
+  <div class="carousel-nav">
+    <button class="nav-arrow prev" onclick="moveCarousel(-1)">←</button>
+    <button class="nav-arrow next" onclick="moveCarousel(1)">→</button>
   </div>
 </div>
 ```