clean up

app/globals.css

@@ -306,17 +306,17 @@ a, .link {
 
 
 .description-text {
-  white-space: pre-wrap; /* Allows text to wrap and preserves whitespace */
-  word-wrap: break-word; /* Breaks long words if necessary to fit within the container */
-  overflow-wrap: break-word; /* Similar to word-wrap, ensures the text breaks to prevent overflow */
-  max-width: 100%; /* Ensures the text does not exceed the width of its container */
-  margin-bottom: 1em; /* Adjust as needed for your design */
-  line-height: 1.5; /* Adjust as needed for your design */
+  white-space: pre-wrap;
+  word-wrap: break-word;
+  overflow-wrap: break-word;
+  max-width: 100%;
+  margin-bottom: 1em;
+  line-height: 1.5;
 }
 
 
 .ais-SearchBox {
-  width: 100%; /* Full width */
+  width: 100%; 
 }
 
 .ais-SearchBox-input {
@@ -333,10 +333,6 @@ a, .link {
   display: none;
 }
 
-.ais-SearchBox-input::placeholder {
-  color: #a0aec0; /* Placeholder text color, choose a color that is visible on white background */
-}
-
 /* Used for Grower Table */
 .table-cell-spacing {
   border-bottom: 6px solid transparent;

app/page.js

@@ -6,7 +6,7 @@ import OTTWeightTracking from '../components/OTTWeightTracking';
 import Search from '../src/components/GrowerStatsProfile/Search';
 
 // Placeholder component for the Suspense fallback
-const LoadingSearch = () => <div>Loading search...</div>; 
+const LoadingSearch = () => <div>Loading search...</div>;
 
 export default function Home() {
     return (
@@ -48,7 +48,6 @@ export default function Home() {
                                 Find any grower, pumpkin, or site and get a comprehensive overview, rankings, and stats for each search result.
                             </p>
                         </div>
-                        {/* Wrap the Search Component with Suspense */}
                         <Suspense fallback={<LoadingSearch />}>
                             <Search />
                         </Suspense>
@@ -122,13 +121,13 @@ export default function Home() {
             <section className="py-24">
                 <div className="mx-auto px-4 sm:px-6 lg:px-8">
                     <div className="text-center mb-6">
-                    <div className="space-y-2">
-                        <h2 className="text-3xl font-bold tracking-tighter sm:text-5xl">Private & Secure</h2>
-                        <p className="mx-auto max-w-[700px] text-gray-500 md:text-xl dark:text-gray-400">
-                            Rest easy, your pumpkin data is locked up tighter than your diary. 
-                            Imagine a vault within a vault, that's the level of security we're talking about.
-                        </p>
-                    </div>
+                        <div className="space-y-2">
+                            <h2 className="text-3xl font-bold tracking-tighter sm:text-5xl">Private & Secure</h2>
+                            <p className="mx-auto max-w-[700px] text-gray-500 md:text-xl dark:text-gray-400">
+                                Rest easy, your pumpkin data is locked up tighter than your diary.
+                                Imagine a vault within a vault, that's the level of security we're talking about.
+                            </p>
+                        </div>
                     </div>
                     <div className="flex flex-col items-center justify-center space-y-4">
                         <Link href="/register" className="px-8 py-2 green-button rounded text-white text-lg hover:text-white focus:outline-none focus:ring-0 underline-none no-underline">Join Now</Link>
@@ -142,7 +141,7 @@ export default function Home() {
 
             {/* Footer Section */}
             <div className="App-footer w-full py-12 px-4 md:px-8 lg:px-16">
-                <p className="mb-2">This project is open source. Check it out on 
+                <p className="mb-2">This project is open source. Check it out on
                     <Link
                         href="https://github.com/ryanmio/PumpkinPal"
                         passHref

app/search/page.js

@@ -23,7 +23,6 @@ const GrowerIcon = () => (
   <img src="/icons/grower_icon.svg" className="h-9 w-9" alt="Grower Icon" />
 );
 
-// Define the Right Arrow Icon Component
 const RightArrowIcon = () => (
   <svg xmlns="http://www.w3.org/2000/svg" className="h-6 w-6 ml-auto" fill="none" viewBox="0 0 24 24" stroke="currentColor">
     <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9 5l7 7-7 7" />
@@ -44,7 +43,7 @@ const Hit = ({ hit }) => {
       case 'Stats_Growers':
         return <GrowerIcon />;
       default:
-        return null; // Or a default icon if you have one
+        return null;
     }
   };
 

components/OTTWeightTracking.jsx

@@ -10,7 +10,7 @@ const CustomTooltip = ({ point }) => {
         background: 'white',
         padding: '9px 12px',
         border: '1px solid #ccc',
-        boxShadow: '0px 3px 6px rgba(0, 0, 0, 0.1)', // Optional: added for a subtle shadow effect
+        boxShadow: '0px 3px 6px rgba(0, 0, 0, 0.1)', 
       }}
     >
       <div style={{ fontStyle: 'italic', color: '#666' }}>
@@ -83,7 +83,7 @@ function LineChart(props) {
                 ],
               },
             ]}
-            margin={{ top: 10, right: 10, bottom: 50, left: 40 }} // Increased bottom margin for mobile
+            margin={{ top: 10, right: 10, bottom: 50, left: 40 }}
             xScale={{
               type: "point",
             }}