From c8e5d89c0422fb5965bd065092e196fd3158ae8e Mon Sep 17 00:00:00 2001 From: Emil Gulamov <125820963+mearashadowfax@users.noreply.github.com> Date: Sat, 17 Feb 2024 08:15:15 +0400 Subject: [PATCH] Update product display and blog contents functionality Replaced the image components with card components in the product section to enhance product display. Modified the grid layout for enhanced product representation. Also, implemented the complete functionality of the blog section by defining the blog collection, adding blog cards and content, and refining meta data in MainLayout for SEO optimization. Adjusted animation timeline and script paths for better load performance. --- src/content/config.ts | 24 ++++-- src/pages/blog/index.astro | 128 ++++++++++++++++++++++++++++- src/pages/products/[...slug].astro | 38 +++++---- src/pages/products/index.astro | 12 +-- 4 files changed, 172 insertions(+), 30 deletions(-) diff --git a/src/content/config.ts b/src/content/config.ts index 969a837..77581b8 100644 --- a/src/content/config.ts +++ b/src/content/config.ts @@ -52,13 +52,25 @@ const productsCollection = defineCollection({ }), }); -// const blogCollection = defineCollection({ -// type: 'content', -// schema: z.object({}) -// }); +const blogCollection = defineCollection({ + type: "content", + schema: ({ image }) => z.object ({ + title: z.string(), + description: z.string(), + contents: z.array(z.string()), + author: z.string(), + role: z.string().optional(), + authorImage: image(), + authorImageAlt: z.string(), + pubDate: z.date(), + cardImage: image(), + cardImageAlt: z.string(), + readTime: z.number(), + tags: z.array(z.string()).optional(), + }), +}); -// 3. Export a single `collections` object to register your collection(s) export const collections = { 'products': productsCollection, - // 'blog': blogCollection, + 'blog': blogCollection, }; \ No newline at end of file diff --git a/src/pages/blog/index.astro b/src/pages/blog/index.astro index ba009be..ec06b80 100644 --- a/src/pages/blog/index.astro +++ b/src/pages/blog/index.astro @@ -1,7 +1,133 @@ --- // Import section components import MainLayout from "../../layouts/MainLayout.astro"; +import CardBlog from "../../components/ui/cards/CardBlog.astro"; +import CardBlogRecent from "../../components/ui/cards/CardBlogRecent.astro"; + +import { getCollection } from "astro:content"; +import type { CollectionEntry } from "astro:content"; + +const blogPosts: CollectionEntry<"blog">[] = ( + await getCollection("blog") +).sort((a: CollectionEntry<"blog">, b: CollectionEntry<"blog">) => b.data.pubDate.valueOf() - a.data.pubDate.valueOf()); + +const mostRecentPost: CollectionEntry<"blog"> = blogPosts[0]; +const otherPosts: CollectionEntry<"blog">[] = blogPosts.slice(1); + +const title: string = "Your Gateway to Construction Excellence"; + +const subTitle: string = + "Explore the latest news, tips, and insights from ScrewFast to enhance your construction projects. From product spotlights to project management strategies, our blog is your go-to resource for all things hardware and construction."; + +const secondTitle: string = "Insights"; + +const secondSubTitle: string = + "Stay up-to-date with the latest trends and developments in the construction industry with insights from ScrewFast's team of industry experts. "; --- - + + + +
+ + +
+

+ {title} +

+ +

{subTitle}

+
+ + +
+ +
+ +
+ + {otherPosts.map(blogEntry => ( + + ))} +
+
+ +
+ + +
+ + + +
diff --git a/src/pages/products/[...slug].astro b/src/pages/products/[...slug].astro index edbd11c..bb1f5a9 100644 --- a/src/pages/products/[...slug].astro +++ b/src/pages/products/[...slug].astro @@ -24,7 +24,7 @@ export async function getStaticPaths() { const { product } = Astro.props; --- - +
@@ -166,32 +166,36 @@ const { product } = Astro.props; - + diff --git a/src/pages/products/index.astro b/src/pages/products/index.astro index e3d2979..f0a72fe 100644 --- a/src/pages/products/index.astro +++ b/src/pages/products/index.astro @@ -2,8 +2,8 @@ // Import section components import MainLayout from "../../layouts/MainLayout.astro"; import PrimaryCTA from "../../components/ui/buttons/PrimaryCTA.astro"; -import ImgSmall from "../../components/ui/images/ImgSmall.astro"; -import ImgWide from "../../components/ui/images/ImgWide.astro"; +import CardSmall from "../../components/ui/cards/CardSmall.astro"; +import CardWide from "../../components/ui/cards/CardWide.astro"; import FeaturesStats2 from "../../components/FeaturesStats2.astro"; import TestimonialsSection2 from "../../components/TestimonialsSection2.astro"; @@ -14,7 +14,7 @@ const product: CollectionEntry<"products">[] = ( await getCollection("products") ).sort( (a: CollectionEntry<"products">, b: CollectionEntry<"products">) => - a.data.main.id - b.data.main.id, + a.data.main.id - b.data.main.id ); const title: string = "Products"; @@ -47,14 +47,14 @@ const subTitle: string = -
+
{ product.map((product, index) => { const position = index % 4; if (position === 0 || position === 3) { - return ; + return ; } else { - return ; + return ; } }) }