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.
This commit is contained in:
Emil Gulamov 2024-03-22 04:44:38 +04:00
parent af314f187c
commit 02487794e9

View file

@ -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"