🐳🍭 ↝ We had to eat each other to survive! [ SGV2-6 ]

Signal-K · Mar 12, 2024 · 3dbcf7f · 3dbcf7f
1 parent ea91c2b
commit 3dbcf7f
Show file tree

Hide file tree

Showing 4 changed files with 258 additions and 225 deletions.
diff --git a/@/components/garden-dashboard.tsx b/@/components/garden-dashboard.tsx
@@ -1,8 +1,15 @@
 import Link from "next/link"
 import { Button } from "./ui/button"
 import { DashboardLogs, InventoryBlock } from "../../components/dashboard-logs";
+import { useState } from "react";
+import { Garden } from "../../components/Content/Planets/GalleryList";
 
 export function GardenDashboard() {
+  const [showGalaxy, setShowGalaxy] = useState(false);
+  const handleOpenGalaxy = () => {
+    setShowGalaxy(true);
+  };
+
   return (
     <div className="flex-col justify-center">
       <div className="flex-1 flex flex-col items-center justify-center text-center">
@@ -14,6 +21,18 @@ export function GardenDashboard() {
         {/* <QuickLook /> */}
         {/* <DashboardLogs /> */}
         <InventoryBlock />
+        <button onClick={handleOpenGalaxy} className="mt-4 px-4 py-2 bg-blue-500 text-white rounded">
+            Visit a planet
+        </button>
+        <div className="mt-20">
+          {showGalaxy &&
+            <>
+              <div className="mt-20">
+                <Garden onClose={() => setShowGalaxy(false)} />
+              </div>
+            </>
+          }
+          </div>
       </div>
     </div>
   );

diff --git a/components/Content/Planets/GalleryList.tsx b/components/Content/Planets/GalleryList.tsx
@@ -143,14 +143,47 @@ const PlanetGalleryWithSectors: React.FC = () => {
 
   if (!session) {
     return <Login />;
-  }
+  };
 
   if (loading) {
     return <div>Loading...</div>;
-  }
+  };
+
+  const hexagonStyle = {
+    width: '100px',
+    height: '115px', // Adjust this value to control the height of the hexagon
+    borderBottom: 'solid 2px white',
+    borderTop: 'solid 2px white',
+    position: 'relative',
+    cursor: 'pointer',
+  };
+
+  const hexagonBeforeStyle = {
+    content: '""',
+    position: 'absolute',
+    top: '-1px',
+    left: 0,
+    width: 0,
+    height: 0,
+    borderLeft: '50px solid transparent',
+    borderRight: '50px solid transparent',
+    borderBottom: 'solid 86.6px white', // Adjust this value to control the shape of the hexagon
+  };
+
+  const hexagonAfterStyle = {
+    content: '""',
+    position: 'absolute',
+    bottom: '-1px',
+    left: 0,
+    width: 0,
+    height: 0,
+    borderLeft: '50px solid transparent',
+    borderRight: '50px solid transparent',
+    borderTop: 'solid 86.6px white', // Adjust this value to control the shape of the hexagon
+  };
 
   return (
-    <div className="grid grid-cols-3 gap-4">
+    <div className="grid grid-cols-3 gap-4 mb-5 mt-5">
       {planets.map((planet) => (
         <Link legacyBehavior key={planet.id} href={`/planets/${planet.id}`}>
           <a className="sector-link">

diff --git a/components/Overlays/1-Feed.tsx b/components/Overlays/1-Feed.tsx
@@ -24,13 +24,13 @@ const FeedOverlay: React.FC<FeedOverlayProps> = ({ onClose }) => {
       <div className="bg-gradient-to-b from-gray-100 via-gray-200 to-blue-100 w-full sm:max-w-screen-lg sm:w-full max-h-60vh overflow-y-auto shadow-lg relative rounded-t-3xl">
         <div className="p-4">
           <h2 className="text-2xl font-bold">Feed Overlay</h2>
-          <button
+          <GardenDashboard />
+          <center><button
             onClick={handleClose}
             className="mt-2 px-4 py-2 bg-gray-200 text-gray-800 rounded"
           >
             Close
-          </button>
-          <GardenDashboard />
+          </button></center>
         </div>
       </div>
     </div>