diff --git a/public/itemPreview.png b/public/itemPreview.png new file mode 100644 index 0000000..7f9b750 Binary files /dev/null and b/public/itemPreview.png differ diff --git a/public/squared_item.png b/public/squared_item.png deleted file mode 100644 index fbe3cd1..0000000 Binary files a/public/squared_item.png and /dev/null differ diff --git a/src/components/HorizontalShopItem.astro b/src/components/HorizontalShopItem.astro index d082abd..b54c356 100644 --- a/src/components/HorizontalShopItem.astro +++ b/src/components/HorizontalShopItem.astro @@ -1,5 +1,18 @@ --- -const { title, img, desc, url, badge, tags, target = "_blank", pricing, oldPricing, checkoutUrl } = Astro.props; +const { + title, + img, + desc, + url, + badge, + target = "_blank", + pricing, + oldPricing, + checkoutUrl, + details = true, + custom_link = false, + custom_link_label = "", +} = Astro.props; ---
@@ -16,8 +29,21 @@ const { title, img, desc, url, badge, tags, target = "_blank", pricing, oldPrici

{desc}

- Buy Now - Details + Buy + { + custom_link && ( + + {custom_link_label} + + ) + } + { + details && ( + + Details + + ) + }
diff --git a/src/layouts/StoreItemLayout.astro b/src/layouts/StoreItemLayout.astro new file mode 100644 index 0000000..3d4cfb9 --- /dev/null +++ b/src/layouts/StoreItemLayout.astro @@ -0,0 +1,61 @@ +--- +import BaseHead from "../components/BaseHead.astro"; +import BaseLayout from "./BaseLayout.astro"; + +const { + content: { + title, + description, + pubDate, + updatedDate, + heroImage, + pricing, + oldPricing, + checkoutUrl, + badge, + custom_link, + custom_link_label, + }, +} = Astro.props; +--- + + +
+
+ {heroImage && {title}} +
+

+ {title} + {badge &&
{badge}
} +

+
+
+ {pricing} + {oldPricing} +
+
+ { + custom_link && ( + + {custom_link_label} + + ) + } + Buy Now +
+ +
+
+ { + updatedDate && ( +
+ {" "} + Last updated on {" "} +
+ ) + } +
+ +
+
+ diff --git a/src/pages/index.astro b/src/pages/index.astro index 2a7fb44..1d51107 100644 --- a/src/pages/index.astro +++ b/src/pages/index.astro @@ -17,7 +17,7 @@ const last_posts = posts.slice(0, 3);
Software Engineer and Entrepreneur
- I made this template for everyone who needs to create a personal website easily and quickly. This template includes Project Section, CV Section, Paginated Blog, RSS Feed, SEO Friendly, Responsive Desing and 29 Visual themes. I hope you find it useful! + I made this template for everyone who needs to create a personal website easily and quickly. This template includes Project Section, CV Section, Store, Paginated Blog, RSS Feed, SEO Friendly, Responsive Desing and 29 Visual themes. I hope you find it useful!
diff --git a/src/pages/store/[page].astro b/src/pages/store/[page].astro index 0ac600b..be66f93 100644 --- a/src/pages/store/[page].astro +++ b/src/pages/store/[page].astro @@ -24,8 +24,11 @@ const { page } = Astro.props; oldPricing={post.frontmatter.oldPricing} checkoutUrl={post.frontmatter.checkoutUrl} badge={post.frontmatter.badge} + details={post.frontmatter.details} tags={post.frontmatter.tags} url={post.url} + custom_link={post.frontmatter.custom_link} + custom_link_label={post.frontmatter.custom_link_label} target="_self" />
diff --git a/src/pages/store/item1.md b/src/pages/store/item1.md index ec93a95..72c3e28 100644 --- a/src/pages/store/item1.md +++ b/src/pages/store/item1.md @@ -1,13 +1,16 @@ --- -layout: "../../layouts/PostLayout.astro" +layout: "../../layouts/StoreItemLayout.astro" title: "Demo Item 1" description: "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua." -pubDate: "Sep 10 2022" +details: true +custom_link_label: "Live Preview" +custom_link: "https://demourl.com/" +pubDate: "Sep 15 2022" pricing: "$15" badge: "Featured" tags: ['Tag1','Tag2'] -checkoutUrl: "https://github.com/" -heroImage: "/squared_item.png" +checkoutUrl: "https://checkouturl.com/" +heroImage: "/itemPreview.png" --- Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Vitae ultricies leo integer malesuada nunc vel risus commodo viverra. Adipiscing enim eu turpis egestas pretium. Euismod elementum nisi quis eleifend quam adipiscing. In hac habitasse platea dictumst vestibulum. Sagittis purus sit amet volutpat. Netus et malesuada fames ac turpis egestas. Eget magna fermentum iaculis eu non diam phasellus vestibulum lorem. Varius sit amet mattis vulputate enim. Habitasse platea dictumst quisque sagittis. Integer quis auctor elit sed vulputate mi. Dictumst quisque sagittis purus sit amet. diff --git a/src/pages/store/item2.md b/src/pages/store/item2.md index 686af79..17cafbf 100644 --- a/src/pages/store/item2.md +++ b/src/pages/store/item2.md @@ -1,12 +1,15 @@ --- -layout: "../../layouts/PostLayout.astro" +layout: "../../layouts/StoreItemLayout.astro" title: "Demo Item 2" description: "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua." +details: false +custom_link_label: "Custom Btn" +custom_link: "https://customurl.com/" pubDate: "Sep 11 2022" pricing: "$10" oldPricing: "$25.5" -checkoutUrl: "https://github.com/" -heroImage: "/squared_item.png" +checkoutUrl: "https://checkouturl.com/" +heroImage: "/itemPreview.png" --- Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Vitae ultricies leo integer malesuada nunc vel risus commodo viverra. Adipiscing enim eu turpis egestas pretium. Euismod elementum nisi quis eleifend quam adipiscing. In hac habitasse platea dictumst vestibulum. Sagittis purus sit amet volutpat. Netus et malesuada fames ac turpis egestas. Eget magna fermentum iaculis eu non diam phasellus vestibulum lorem. Varius sit amet mattis vulputate enim. Habitasse platea dictumst quisque sagittis. Integer quis auctor elit sed vulputate mi. Dictumst quisque sagittis purus sit amet.