From 02487794e97aef55c81bc2706446adbf29f5ee92 Mon Sep 17 00:00:00 2001
From: Emil Gulamov <125820963+mearashadowfax@users.noreply.github.com>
Date: Fri, 22 Mar 2024 04:44:38 +0400
Subject: [PATCH] Add image and JSON data imports to index.astro

This commit includes importing several image files and JSON data files in 'index.astro'. It adds unique data imports for FAQ, features, and several feature images. It also modifies existing component props to use imported data, enhancing code reusability and maintainability.
---
 src/pages/index.astro | 48 ++++++++++++++++++++++++++++++++++++++++---
 1 file changed, 45 insertions(+), 3 deletions(-)

diff --git a/src/pages/index.astro b/src/pages/index.astro
index 2b93dc2..d5a259a 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -11,6 +11,12 @@ import PricingSection from "../components/sections/pricing/PricingSection.astro"
 import FAQ from "../components/sections/FAQ.astro";
 import AnnouncementBanner from "../components/ui/banners/AnnouncementBanner.astro";
 import heroImage from "../images/hero-image.avif";
+import faqs from "../data_files/faqs.json";
+import features from "../data_files/features.json";
+import featureImage from "../images/features-image.avif";
+import construction from "../images/construction-image.avif";
+import tools from "../images/automated-tools.avif";
+import dashboard from "../images/dashboard-image.avif";
 
 const avatarSrcs: Array<string> = [
   "https://images.unsplash.com/photo-1568602471122-7832951cc4c5?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=facearea&facepad=2&w=300&h=300&q=80",
@@ -49,9 +55,45 @@ const avatarSrcs: Array<string> = [
     subTitle="Experience the reliability chosen by industry giants."
   />
 
-  <FeaturesGeneral />
+  <FeaturesGeneral
+    title="Meeting Industry Demands"
+    subTitle="At ScrewFast, we tackle the unique challenges encountered in the hardware and construction sectors. From cutting-edge tools to expert services, we're dedicated to helping you overcome obstacles and achieve your goals."
+    src={featureImage}
+    alt="ScrewFast products in floating boxes"
+    features={features}
+  />
 
-  <FeaturesNavs />
+  <FeaturesNavs
+    title=`Customize <span class="text-yellow-500 dark:text-yellow-400">ScrewFast</span>'s offerings to perfectly suit your hardware and construction needs.`
+    tabs={[
+      {
+        heading: "Cutting-Edge Tools",
+        content:
+          "Empower your projects with ScrewFast's cutting-edge tools. Experience enhanced efficiency in construction management with our sophisticated automated solutions.",
+        svg: "tools",
+        src: tools,
+        alt: "Yellow and black heavy equipment on brown grass field",
+        first: true,
+      },
+      {
+        heading: "Intuitive Dashboards",
+        content:
+          "Navigate with ease using ScrewFast's intuitive dashboards. Set up and oversee your projects seamlessly, with user-friendly interfaces designed for quick and effective workflow management.",
+        svg: "dashboard",
+        src: dashboard,
+        alt: "A screenshot or graphic representation of the intuitive dashboard",
+        second: true,
+      },
+      {
+        heading: "Robust Features",
+        content:
+          "Minimize complexity, maximize productivity. ScrewFast's robust features are engineered to streamline your construction process, delivering results that stand out for their excellence.",
+        svg: "house",
+        src: construction,
+        alt: "Gray metal building frame near tower crane during daytime",
+      },
+    ]}
+  />
 
   <TestimonialsSection
     title="Fast-Track Your Projects"
@@ -92,7 +134,7 @@ const avatarSrcs: Array<string> = [
 
   <PricingSection />
 
-  <FAQ />
+  <FAQ title="Frequently<br />asked questions" faqs={faqs} />
 
   <HeroSectionAlt
     title="Let's Build Together"