From e080d368cc4c99b79caba5733d73b86614dfc7da Mon Sep 17 00:00:00 2001
From: Jaron <jaron@fishhat.dev>
Date: Sat, 22 Feb 2025 23:50:08 -0600
Subject: [PATCH] added hydration section

---
 website/src/app/page.module.css               | 14 +++++++-------
 website/src/app/page.tsx                      | 10 ++--------
 website/src/components/CodeExample.module.css |  2 +-
 3 files changed, 10 insertions(+), 16 deletions(-)

diff --git a/website/src/app/page.module.css b/website/src/app/page.module.css
index 27d2ede..a300ada 100644
--- a/website/src/app/page.module.css
+++ b/website/src/app/page.module.css
@@ -156,7 +156,7 @@
 }
 
 .pillars {
-    padding: 6rem 15em;
+    padding: 6rem 12em;
     background: var(--gray-alpha-100);
     min-height: 50vh;
     display: flex;
@@ -207,10 +207,10 @@
 }
 
 .hydrationSection {
-    padding: 6rem 15em;
+    padding: 6rem 12em;
     min-height: 50vh;
     display: flex;
-    align-items: center;
+    align-items: space;
     justify-content: center;
     position: relative;
     border-top: 1px solid var(--gray-alpha-200);
@@ -222,17 +222,17 @@
     justify-content: space-between;
     align-items: center;
     width: 100%;
-    max-width: 1200px;
 }
 
 .hydrationCode {
-    flex: 1;
-    min-width: 45%;
+    flex: 2;
+    width: 100%;
+    max-width: 800px;
 }
 
 .hydrationText {
     flex: 1;
-    padding: 2rem;
+    /* padding: 2rem; */
 }
 
 .hydrationText h2 {
diff --git a/website/src/app/page.tsx b/website/src/app/page.tsx
index b8ab9c9..fda0a04 100644
--- a/website/src/app/page.tsx
+++ b/website/src/app/page.tsx
@@ -2,8 +2,7 @@ import styles from "./page.module.css";
 import dynamic from 'next/dynamic';
 
 const CodeExample = dynamic(
-  () => import('../components/CodeExample'),
-  { ssr: false }
+  () => import('../components/CodeExample')
 );
 
 import { simpleExample, hydrationExample } from '../components/CodeExample';
@@ -55,7 +54,7 @@ export default function Home() {
                 <div className={styles.hydrationSection}>
                     <div className={styles.hydrationContainer}>
                         <div className={styles.hydrationCode}>
-                            <CodeExample code={hydrationExample} height={400} />
+                            <CodeExample code={hydrationExample} height={260} />
                         </div>
                         <div className={styles.hydrationText}>
                             <h2>Smart Hydration</h2>
@@ -65,11 +64,6 @@ export default function Home() {
                                 like messages, users, and guilds, ensuring your bot stays efficient while 
                                 keeping your code clean and predictable.
                             </p>
-                            <p>
-                                In this example, we're hydrating a message object to calculate ping times, 
-                                demonstrating how Unicord handles complex Discord API interactions with 
-                                simple, intuitive code.
-                            </p>
                         </div>
                     </div>
                 </div>
diff --git a/website/src/components/CodeExample.module.css b/website/src/components/CodeExample.module.css
index 9c73adf..caee5e3 100644
--- a/website/src/components/CodeExample.module.css
+++ b/website/src/components/CodeExample.module.css
@@ -1,7 +1,7 @@
 .editorContainer {
     width: 100%;
     height: 100%;
-    min-height: 300px;
+    /* min-height: 300px; */
     border-radius: 8px;
     overflow: hidden;
     /* margin: 20px 0; */