From 71b07c488b80098069ff7cfb5f8b71f3bc9c20ab Mon Sep 17 00:00:00 2001
From: Glen Maddern <glen@glenmaddern.com>
Date: Mon, 23 Jun 2025 21:29:22 +1000
Subject: [PATCH] Make gradient background repeat every 100vh

- Add background-size: 100% 100vh to fix gradient height to viewport
- Add background-repeat: repeat-y to tile gradient vertically
- Gradient pattern now repeats down the page as content grows
- Animation applies consistently to all repeated background tiles
- Creates seamless repeating pattern while maintaining hue rotation
---
 examples/chat-ui/src/index.css | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/examples/chat-ui/src/index.css b/examples/chat-ui/src/index.css
index 647e290..f649baa 100644
--- a/examples/chat-ui/src/index.css
+++ b/examples/chat-ui/src/index.css
@@ -23,6 +23,8 @@
   right: 0;
   bottom: 0;
   background: linear-gradient(135deg, #fdf2f8, #faf5ff, #eef2ff);
+  background-size: 100% 100vh;
+  background-repeat: repeat-y;
   animation: hue-rotate 60s linear infinite;
   animation-delay: var(--random-delay, 0s);
   z-index: -1;