From a5bcb6473a5814e130be77af4b979e29c9f529fd Mon Sep 17 00:00:00 2001
From: GamerBoss101 <adithcool.5@gmail.com>
Date: Sat, 12 Apr 2025 21:25:34 -0400
Subject: [PATCH] Background Image Added

---
 src/app/(app)/info/page.tsx |  4 ++--
 src/app/(app)/layout.tsx    |  4 ++--
 src/lib/css/globals.css     | 10 ++++++++++
 3 files changed, 14 insertions(+), 4 deletions(-)

diff --git a/src/app/(app)/info/page.tsx b/src/app/(app)/info/page.tsx
index f9d5da8..16e45ea 100644
--- a/src/app/(app)/info/page.tsx
+++ b/src/app/(app)/info/page.tsx
@@ -3,10 +3,10 @@
 export default function InfoPage() {
 	return (
 		<div className="px-6 py-10 max-w-full lg:max-w-1/2 mx-auto font-sans text-neutral-100">
-			<h1 className="text-3xl font-bold mb-4 text-[color:var(--color-warning-600)] dark:text-3xl font-bold mb-4 text-[color:var(--color-warning-300)]">
+			<h1 className="text-3xl dark:text-3xl font-bold mb-4">
 				Beverage Consumption Info!
 			</h1>
-			<p className="text-neutral-500 dark: mb-6 text-neutral-300">
+			<p className="mb-6 ">
 				Learn what's best for your body and how to earn points and win! Making
 				informed drink choices supports hydration, energy regulation, and
 				overall health. Below are basic guidelines based on established public
diff --git a/src/app/(app)/layout.tsx b/src/app/(app)/layout.tsx
index 6e1304a..f0ee87f 100644
--- a/src/app/(app)/layout.tsx
+++ b/src/app/(app)/layout.tsx
@@ -13,9 +13,9 @@ export default function RootLayout({
 }>) {
 	const { isMobile, isSafari } = useDevice();
 	return (
-		<main suppressHydrationWarning={true}>
+		<main className="max-h-screen max-w-screen bg-img overflow-hidden" suppressHydrationWarning={true}>
 			{!isMobile && !isSafari ? <NavBar /> : null}
-			<section className="min-h-screen max-w-screen space-x-2 gap-4 flex flex-col">
+			<section className="space-x-2 gap-4 flex flex-col overflow-y-auto h-screen p-4 lg:p-6 lg:rounded-xl lg:shadow-sm">
 				<img src="/drinkhappylogo.png" alt="Drink Happy Logo Image" className="h-auto mx-auto w-3/4 lg:w-1/4" />
 				{children}
 			</section>
diff --git a/src/lib/css/globals.css b/src/lib/css/globals.css
index 34bc4de..5ada454 100644
--- a/src/lib/css/globals.css
+++ b/src/lib/css/globals.css
@@ -19,3 +19,13 @@
 body {
 	font-family: Arial, Helvetica, sans-serif;
 }
+
+.bg-img {
+	/* Repeat Background Image on the y axis */
+	background-repeat: repeat-y;
+
+	background-size: cover;
+	background-position: center;
+	height: 100vh;
+	@apply dark:bg-[url('/darkmodebackground.png')] bg-[url('/lightmodebackground.png')];
+}
\ No newline at end of file