Hackathons/Bitcamp-2025
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

boxes and buttons

Browse Source
This commit is contained in:
sameeranageshwar
2025-04-13 01:05:30 -04:00
parent 3af9ad2acc
commit b7ce205898
3 changed files with 31 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
src/app/(app)/guide/Info.tsx
View File

@@ -6,15 +6,17 @@ const InfoContent = () => {
return ( return (
<div> <div>
<h1 className="text-3xl dark:text-3xl font-bold mb-4"> <div className="bg-[color:var(--color-success-600)]/60 backdrop-blur-md rounded-xl px-6 py-5 my-6 shadow-sm">
Beverage Consumption Info! <h1 className="text-3xl dark:text-3xl font-bold mb-4">
</h1> Beverage Consumption Info!
<p className="mb-6 "> </h1>
Learn what's best for your body and how to earn points and win! Making <p className="mb-6 ">
informed drink choices supports hydration, energy regulation, and Learn what's best for your body and how to earn points and win! Making
overall health. Below are basic guidelines based on established public informed drink choices supports hydration, energy regulation, and
health recommendations. overall health. Below are basic guidelines based on established public
</p> health recommendations.
</p>
</div>
<div className="bg-[color:var(--color-surface-600)] rounded-xl px-6 py-5 my-6 shadow-sm"> <div className="bg-[color:var(--color-surface-600)] rounded-xl px-6 py-5 my-6 shadow-sm">
<h2 className="text-2xl font-semibold mt-0 mb-2 text-[color:var(--color-warning-300)]"> <h2 className="text-2xl font-semibold mt-0 mb-2 text-[color:var(--color-warning-300)]">

30
src/app/(app)/guide/PointGuide.tsx
View File

@@ -57,25 +57,27 @@ const PointGuide = () => {
return ( return (
<div> <div>
<h1 className="text-2xl sm:text-3xl font-bold mb-4 text-white"> <div className="bg-[color:var(--color-success-600)]/60 backdrop-blur-md rounded-xl px-6 py-5 my-6 shadow-sm">
Points Guide <h1 className="text-2xl sm:text-3xl font-bold mb-4 text-white">
</h1> Points Guide
<p className="mb-6 text-sm sm:text-base text-white"> </h1>
Learn how many points you receive for each drink! <p className="mb-6 text-sm sm:text-base text-white">
</p> Learn how many points you receive for each drink!
</p>
<ul> <div>
<span className="text-base sm:text-lg">Game Points System:</span> <span className="text-base sm:text-lg text-white">Game Points System:</span>
<ul className="list-disc pl-5 mt-1 space-y-1 text-sm sm:text-base"> <ul className="list-disc pl-5 mt-1 space-y-1 text-sm sm:text-base text-white">
<li> +150 points for drinking ≥100 oz of water </li> <li>+150 points for drinking ≥100 oz of water</li>
<li> +100 points for keeping caffeine &lt; 200 mg </li> <li>+100 points for keeping caffeine &lt; 200 mg</li>
<li> +150 points for staying under the sugar cap all day </li> <li>+150 points for staying under the sugar cap all day</li>
<li> <li>
Exceeding 400mg caffeine limit or 30.5g sugar limit = 0 pts logged for Exceeding 400mg caffeine limit or 30.5g sugar limit = 0 pts logged for
those drinks those drinks
</li> </li>
</ul> </ul>
</ul> </div>
</div>
<div className="bg-surface-700 rounded-xl px-4 py-4 my-6 shadow-sm"> <div className="bg-surface-700 rounded-xl px-4 py-4 my-6 shadow-sm">
<div className="overflow-x-auto rounded-xl scroll-auto"> <div className="overflow-x-auto rounded-xl scroll-auto">

8
src/app/(app)/guide/page.tsx
View File

@@ -14,8 +14,8 @@ export default function InfoPage() {
<button <button
className={`px-4 py-2 rounded ${ className={`px-4 py-2 rounded ${
activeComponent === "info" activeComponent === "info"
? "bg-primary-500 text-white" ? "bg-success-500 text-white"
: "bg-secondary-700 text-gray-300" : "bg-surface-700 text-gray-300"
}`} }`}
onClick={() => setActiveComponent("info")} onClick={() => setActiveComponent("info")}
> >
@@ -24,8 +24,8 @@ export default function InfoPage() {
<button <button
className={`px-4 py-2 rounded ${ className={`px-4 py-2 rounded ${
activeComponent === "points" activeComponent === "points"
? "bg-primary-500 text-white" ? "bg-success-500 text-white"
: "bg-secondary-700 text-gray-300" : "bg-surface-700 text-gray-300"
}`} }`}
onClick={() => setActiveComponent("points")} onClick={() => setActiveComponent("points")}
> >