deploy

Author: nimr77

src/pages/components/section/index.astro

@@ -6,7 +6,7 @@ interface Props {
   maxWidth?: string; // Optional max-width to prevent full-screen width
 }
 
-const { id, title, padding = "3rem", maxWidth = "800px" } = Astro.props;
+const { id, title, padding = "3rem", maxWidth = "1200px" } = Astro.props;
 ---
 
 <style>
@@ -26,7 +26,7 @@ const { id, title, padding = "3rem", maxWidth = "800px" } = Astro.props;
 
   :root {
     --section-padding: 3rem;
-    --section-max-width: 800px;
+    --section-max-width: 1000px;
   }
 </style>
 

src/pages/index.astro

@@ -5,20 +5,24 @@ import Layout from "./components/layout/index.astro";
 import NavigationMenu from "./components/menu/index.astro";
 import Section from "./components/section/index.astro";
 
-const menuItems = [
-  ...data.sections.map((section, index) => ({
-    title: section.title,
-    index: section.title,
-    href: `#${section.title}`,
-  })),
-];
+//Safely access data.sections and use an empty array as a fallback
+const menuItems = data.sections
+  ? data.sections.map((section, index) => ({
+      title: section.title,
+      index: section.title,
+      href: `#${section.title}`,
+    }))
+  : [];
 
-const sectionsData = data.sections.map((section) => ({
-  title: section.title,
-  description: section.description,
-  image: section.image,
-  subSections: section.subSections,
-}));
+//Safely access data.sections and use an empty array as a fallback
+const sectionsData = data.sections
+  ? data.sections.map((section) => ({
+      title: section.title,
+      description: section.description,
+      image: section.image,
+      subSections: section.subSections,
+    }))
+  : [];
 ---
 
 <Layout title="Laundry Admin App Documents">