diff --git a/src/components/FAQ.astro b/src/components/FAQ.astro index 9162e0a..f1f2329 100644 --- a/src/components/FAQ.astro +++ b/src/components/FAQ.astro @@ -1,55 +1,42 @@ --- -// import necessary dependencies + import AccordionItem from "./ui/blocks/AccordionItem.astro"; -/* `subTitle` variable used to customise the sub-heading text. */ + const subTitle: string = "Ask us anything about our brand and products, and get factual responses."; -/* - In the above, the subTitle attribute is a variables part of the FAQ component. -*/ +// Define a helper function to generate ids +const makeId = (base, index) => `${base}${index + 1}`; const faqs = [ { - id: "hs-basic-with-title-and-arrow-stretched-heading-one", - collapseId: "hs-basic-with-title-and-arrow-stretched-collapse-one", heading: "What types of tools are included in the Starter Kit?", content: "The Starter Kit features essential hand and power tools for diverse DIY projects, including hammers, drills, screwdrivers, and a variety of fasteners. It's a curated selection to help beginners and experienced DIYers alike tackle most home improvement tasks.", }, { - id: "hs-basic-with-title-and-arrow-stretched-heading-two", - collapseId: "hs-basic-with-title-and-arrow-stretched-collapse-two", heading: "Can I upgrade from the Starter Kit to the Professional Toolbox?", content: "Absolutely! You can upgrade to the Professional Toolbox at any time to access a wider range of high-quality tools, enjoy priority customer support, and receive exclusive content. Contact our support team for a seamless transition.", }, { - id: "hs-basic-with-title-and-arrow-stretched-heading-three", - collapseId: "hs-basic-with-title-and-arrow-stretched-collapse-three", heading: "What discounts are available for bulk orders through the Professional Toolbox plan?", content: "Professional Toolbox members are entitled to exclusive discounts on bulk orders, the percentage of which may vary depending on the order volume. Get in touch with us to discuss your needs, and we'll provide a tailored discount structure.", }, { - id: "hs-basic-with-title-and-arrow-stretched-heading-four", - collapseId: "hs-basic-with-title-and-arrow-stretched-collapse-four", heading: "What kind of customer support can I expect?", content: "All our customers receive dedicated email support. With the Starter Kit, you'll receive our standard support, while the Professional Toolbox plan upgrades you to priority support, meaning faster response times and specialized assistance.", }, { - id: "hs-basic-with-title-and-arrow-stretched-heading-five", - collapseId: "hs-basic-with-title-and-arrow-stretched-collapse-five", heading: "How current are the online resources and tutorials?", content: "We regularly update our online resources and tutorials to reflect the latest trends in DIY and construction, as well as introductions to new tools and techniques. Our material aims to be comprehensive and user-friendly for all skill levels.", }, { - id: "hs-basic-with-title-and-arrow-stretched-heading-six", - collapseId: "hs-basic-with-title-and-arrow-stretched-collapse-six", heading: "Does ScrewFast offer services for large-scale construction projects?", content: @@ -77,7 +64,13 @@ const faqs = [
- {faqs.map((faq, i) => )} + {faqs.map((question, i) => { + // Generate ids dynamically + let id = makeId("hs-basic-with-title-and-arrow-stretched-heading-", i); + let collapseId = makeId("hs-basic-with-title-and-arrow-stretched-collapse", i); + + return + })}
diff --git a/src/components/FeaturesStats.astro b/src/components/FeaturesStats.astro index 89f3418..ed18326 100644 --- a/src/components/FeaturesStats.astro +++ b/src/components/FeaturesStats.astro @@ -53,19 +53,18 @@ const stats: Stat[] = [ title="96%" subTitle="of our clients rate their experience with ScrewFast as exceptional" /> - + +
-
- { - stats.map((stat) => ( - - )) - } -
+ { + stats.map((stat) => ( + + )) + }
diff --git a/src/components/HeroSection2.astro b/src/components/HeroSection2.astro index 56ec313..35e86a6 100644 --- a/src/components/HeroSection2.astro +++ b/src/components/HeroSection2.astro @@ -9,11 +9,12 @@ const title: string = "Let's Build Together"; // Sub-heading text const subTitle: string = "ScrewFast is an open-source template, meticulously crafted with Astro, Tailwind CSS, and Preline UI frameworks."; - ---
-
+
-
+
-

{subTitle}

+

+ {subTitle} +

diff --git a/src/components/Meta.astro b/src/components/Meta.astro index f132269..005a412 100644 --- a/src/components/Meta.astro +++ b/src/components/Meta.astro @@ -1,10 +1,18 @@ --- +// Assign a description using the `meta` prop passed from the parent component, +// `meta` is used as a variable on each individual page by passing it as a prop to this component. +// For example, you can pass a meta description to the MainLayout component like this: +const { meta: description } = Astro.props; + +interface Props { + meta?: string; +} + // Customize the following metadata for your landing page const title: string = "ScrewFast"; // Replace with your website title const ogTitle: string = "ScrewFast: Hardware Tools & Construction Services"; // Replace with your Open Graph title const author:string = "Emil Gulamov" // Replace with the author's name -const description:string = "ScrewFast offers top-tier hardware tools and expert construction services to meet all your project needs. Start exploring and contact our sales team for superior quality and reliability."; // Replace with your site description const ogDescription: string = "Equip your projects with ScrewFast's top-quality hardware tools and expert construction services. Trusted by industry leaders, ScrewFast offers simplicity, affordability, and reliability. Experience the difference with user-centric design and cutting-edge tools. Start exploring now!"; // Replace with your site description for social media const URL:string = "https://screw-fast.vercel.app"; // Replace with your website URL const socialImage:string = "https://screw-fast.vercel.app/social.png"; // Replace with the URL to your social media image diff --git a/src/components/TestimonialsSection.astro b/src/components/TestimonialsSection.astro index f1af0c6..d8e784b 100644 --- a/src/components/TestimonialsSection.astro +++ b/src/components/TestimonialsSection.astro @@ -23,7 +23,7 @@ const testimonials: Testimonial[] = [ author: "Samantha Ruiz", role: "Chief Operating Officer | ConstructIt Inc.", avatarSrc: - "https://images.unsplash.com/photo-1669837401587-f9a4cfe3126e?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=facearea&facepad=2&w=320&h=320&q=80", + "https://images.unsplash.com/photo-1593104547489-5cfb3839a3b5?q=80&w=1453&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D8&auto=format&fit=facearea&facepad=2&w=320&h=320&q=80", }, ]; diff --git a/src/components/ui/avatars/Avatar.astro b/src/components/ui/avatars/Avatar.astro index 4e58577..d39b6ff 100644 --- a/src/components/ui/avatars/Avatar.astro +++ b/src/components/ui/avatars/Avatar.astro @@ -1,9 +1,9 @@ --- -const { src, alt = "Image Description" } = Astro.props; +const { src, alt } = Astro.props; interface Props { - src?: string; - alt?: string; + src: string; + alt: string; } --- diff --git a/src/components/ui/blocks/AccordionItem.astro b/src/components/ui/blocks/AccordionItem.astro index 20b67e6..39701d1 100644 --- a/src/components/ui/blocks/AccordionItem.astro +++ b/src/components/ui/blocks/AccordionItem.astro @@ -8,11 +8,18 @@ interface Props { content: string; first?: boolean; } +const ACCORDION_CLASS_DEFAULT = "hs-accordion pb-3 active"; +const ACCORDION_CLASS_COLLAPSED = "hs-accordion pt-6 pb-3"; +const ACCORDION_CONTENT_CLASS = "hs-accordion-content w-full overflow-hidden transition-[height] duration-300"; +function getAccordionClass(first: boolean) { + return first ? ACCORDION_CLASS_DEFAULT : ACCORDION_CLASS_COLLAPSED; +} +const SVG_PARAMS = { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", "stroke": "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }; ---