André B
GitHub
28
package.json
28
package.json
@ -1,7 +1,7 @@
|
||||
{
|
||||
"name": "@onwidget/astrowind",
|
||||
"description": "A template to make your website using Astro + Tailwind CSS.",
|
||||
"version": "1.0.0-beta.0",
|
||||
"version": "1.0.0-beta.1",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"dev": "astro dev",
|
||||
@ -13,40 +13,40 @@
|
||||
"lint:eslint": "eslint . --ext .js,.ts,.astro"
|
||||
},
|
||||
"dependencies": {
|
||||
"@astrojs/rss": "3.0.0-rc.2",
|
||||
"@astrojs/rss": "^3.0.0",
|
||||
"@astrolib/analytics": "^0.4.2",
|
||||
"@astrolib/seo": "^1.0.0-beta.4",
|
||||
"@fontsource-variable/inter": "^5.0.8",
|
||||
"astro": "^3.0.0-rc.7",
|
||||
"astro": "^3.0.1",
|
||||
"astro-icon": "^1.0.0-next.2",
|
||||
"limax": "2.1.0",
|
||||
"limax": "4.1.0",
|
||||
"lodash.merge": "^4.6.2",
|
||||
"unpic": "^3.10.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@astrojs/mdx": "1.0.0-rc.2",
|
||||
"@astrojs/partytown": "2.0.0-rc.1",
|
||||
"@astrojs/sitemap": "3.0.0-rc.1",
|
||||
"@astrojs/tailwind": "5.0.0-rc.1",
|
||||
"@astrojs/mdx": "^1.0.0",
|
||||
"@astrojs/partytown": "^2.0.0",
|
||||
"@astrojs/sitemap": "^3.0.0",
|
||||
"@astrojs/tailwind": "5.0.0",
|
||||
"@iconify-json/flat-color-icons": "^1.1.7",
|
||||
"@iconify-json/tabler": "^1.1.89",
|
||||
"@tailwindcss/typography": "^0.5.9",
|
||||
"@types/lodash.merge": "^4.6.7",
|
||||
"@typescript-eslint/eslint-plugin": "^6.4.1",
|
||||
"@typescript-eslint/parser": "^6.4.1",
|
||||
"@typescript-eslint/eslint-plugin": "^6.5.0",
|
||||
"@typescript-eslint/parser": "^6.5.0",
|
||||
"astro-compress": "^2.0.14",
|
||||
"eslint": "^8.47.0",
|
||||
"eslint-plugin-astro": "^0.28.0",
|
||||
"eslint": "^8.48.0",
|
||||
"eslint-plugin-astro": "^0.29.0",
|
||||
"eslint-plugin-jsx-a11y": "^6.7.1",
|
||||
"js-yaml": "^4.1.0",
|
||||
"mdast-util-to-string": "^4.0.0",
|
||||
"prettier": "^3.0.2",
|
||||
"prettier": "^3.0.3",
|
||||
"prettier-plugin-astro": "^0.12.0",
|
||||
"reading-time": "^1.5.0",
|
||||
"svgo": "3.0.2",
|
||||
"tailwind-merge": "^1.14.0",
|
||||
"tailwindcss": "^3.3.3",
|
||||
"typescript": "^5.1.6"
|
||||
"typescript": "^5.2.2"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=18.14.1"
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
---
|
||||
import { Icon } from 'astro-icon/components';
|
||||
import Image from '~/components/common/Image.astro';
|
||||
import CTA from '../ui/CTA.astro';
|
||||
|
||||
const {
|
||||
title = await Astro.slots.render('title'),
|
||||
@ -19,12 +19,14 @@ const {
|
||||
<div class="pt-0 md:pt-[76px] pointer-events-none"></div>
|
||||
<div class="py-12 md:py-20">
|
||||
<div class="text-center pb-10 md:pb-16 max-w-screen-lg mx-auto">
|
||||
{tagline && (
|
||||
<p
|
||||
class="text-base text-secondary dark:text-blue-200 font-bold tracking-wide uppercase"
|
||||
set:html={tagline}
|
||||
/>
|
||||
)}
|
||||
{
|
||||
tagline && (
|
||||
<p
|
||||
class="text-base text-secondary dark:text-blue-200 font-bold tracking-wide uppercase"
|
||||
set:html={tagline}
|
||||
/>
|
||||
)
|
||||
}
|
||||
{
|
||||
title && (
|
||||
<h1
|
||||
@ -42,14 +44,9 @@ const {
|
||||
{typeof callToAction === 'string' ? (
|
||||
<Fragment set:html={callToAction} />
|
||||
) : (
|
||||
<a class="btn btn-primary sm:mb-0 w-full" href={callToAction?.href} target="_blank" rel="noopener">
|
||||
{callToAction?.icon && (
|
||||
<>
|
||||
<Icon name={callToAction.icon} class="w-5 h-5 mr-1 -ml-1.5 rtl:-mr-1.5 rtl:ml-1" />
|
||||
</>
|
||||
)}
|
||||
{callToAction?.text}
|
||||
</a>
|
||||
<div class="btn btn-primary sm:mb-0 w-full">
|
||||
<CTA callToAction={callToAction} />
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
@ -60,15 +57,9 @@ const {
|
||||
{typeof callToAction2 === 'string' ? (
|
||||
<Fragment set:html={callToAction2} />
|
||||
) : (
|
||||
<a class="btn w-full" href={callToAction2?.href}>
|
||||
{callToAction2?.icon && (
|
||||
<>
|
||||
<Icon name={callToAction2.icon} class="w-5 h-5 mr-1 -ml-1.5" />
|
||||
|
||||
</>
|
||||
)}
|
||||
{callToAction2.text}
|
||||
</a>
|
||||
<div class="btn w-full">
|
||||
<CTA callToAction={callToAction2} />
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
---
|
||||
import { Icon } from 'astro-icon/components';
|
||||
import Image from '~/components/common/Image.astro';
|
||||
import type { CallToAction } from '~/types';
|
||||
import CTA from '../ui/CTA.astro';
|
||||
|
||||
export interface Props {
|
||||
title?: string;
|
||||
@ -30,12 +30,14 @@ const {
|
||||
<div class="pt-0 md:pt-[76px] pointer-events-none"></div>
|
||||
<div class="py-12 md:py-20 lg:py-0 lg:flex lg:items-center lg:h-screen lg:gap-8">
|
||||
<div class="basis-1/2 text-center lg:text-left pb-10 md:pb-16 mx-auto">
|
||||
{tagline && (
|
||||
<p
|
||||
class="text-base text-secondary dark:text-blue-200 font-bold tracking-wide uppercase"
|
||||
set:html={tagline}
|
||||
/>
|
||||
)}
|
||||
{
|
||||
tagline && (
|
||||
<p
|
||||
class="text-base text-secondary dark:text-blue-200 font-bold tracking-wide uppercase"
|
||||
set:html={tagline}
|
||||
/>
|
||||
)
|
||||
}
|
||||
{
|
||||
title && (
|
||||
<h1
|
||||
@ -55,14 +57,9 @@ const {
|
||||
{typeof callToAction === 'string' ? (
|
||||
<Fragment set:html={callToAction} />
|
||||
) : (
|
||||
<a class="btn btn-primary sm:mb-0 w-full" href={callToAction?.href} target="_blank" rel="noopener">
|
||||
{callToAction?.icon && (
|
||||
<>
|
||||
<Icon name={callToAction.icon} class="w-5 h-5 mr-1 -ml-1.5 rtl:-mr-1.5 rtl:ml-1" />{' '}
|
||||
</>
|
||||
)}
|
||||
{callToAction?.text}
|
||||
</a>
|
||||
<div class="btn btn-primary sm:mb-0 w-full">
|
||||
<CTA callToAction={callToAction} />
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
@ -73,14 +70,9 @@ const {
|
||||
{typeof callToAction2 === 'string' ? (
|
||||
<Fragment set:html={callToAction2} />
|
||||
) : (
|
||||
<a class="btn w-full" href={callToAction2?.href}>
|
||||
{callToAction2?.icon && (
|
||||
<>
|
||||
<Icon name={callToAction2.icon} class="w-5 h-5 mr-1 -ml-1.5" />{' '}
|
||||
</>
|
||||
)}
|
||||
{callToAction2.text}
|
||||
</a>
|
||||
<div class="btn w-full">
|
||||
<CTA callToAction={callToAction2} />
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
|
||||
@ -45,7 +45,7 @@ const {
|
||||
<Fragment set:html={image} />
|
||||
) : (
|
||||
<Image
|
||||
class="h-10 w-10 rounded-full border border-slate-200 dark:border-slate-600"
|
||||
class="h-10 w-10 rounded-full border border-slate-200 dark:border-slate-600 min-w-full min-h-full"
|
||||
width={40}
|
||||
height={40}
|
||||
widths={[400, 768]}
|
||||
|
||||
@ -13,9 +13,9 @@ In the vast digital landscape, standing out is more than a desire—it's a neces
|
||||
|
||||
## Landing Pages Unveiled
|
||||
|
||||
A **Landing Page** is a standalone web page, distinct from your main website, crafted with a singular objective: to convert visitors into actionable leads or sales. It's where a visitor "lands" post-clicking on a marketing link or ad.
|
||||
A **Landing Page** is a standalone web page, distinct from your main website. Crafted with a singular objective: to convert visitors into actionable leads or sales. It's where a visitor "lands" post-clicking on a marketing link or ad.
|
||||
|
||||
Imagine clicking on an ad for a limited-time discount on a popular shoe brand. Instead of landing on the brand's homepage, you're taken to a page showcasing the discounted shoes with a clear "Buy Now" button. That's a Landing Page in action, focusing your attention solely on the offer.
|
||||
Imagine clicking on an ad for a limited-time discount on a popular shoe brand. This action guides you to a page that showcases the discounted shoes, featuring a clear "Buy Now" button. That's a Landing Page in action, focusing your attention solely on the offer.
|
||||
|
||||
## The Power of Precision
|
||||
|
||||
@ -33,7 +33,7 @@ In today's digital rush, hoping customers stumble upon you is a strategy of the
|
||||
- **Boost ROI**: Maximizing returns on marketing investments.
|
||||
- **Personalize User Experience**: Tailoring content to specific audience segments.
|
||||
|
||||
For instance, if you're launching a new fitness app, a well-crafted Landing Page can target individuals interested in health and wellness, offering them a free trial. This targeted approach ensures that those genuinely interested in fitness are the ones you're engaging with.
|
||||
For instance, if you're launching a new fitness app. A well-crafted Landing Page can target individuals interested in health and wellness, offering them a free trial. This targeted approach ensures that those genuinely interested in fitness are the ones you're engaging with.
|
||||
|
||||
## Crafting the Perfect Landing Page
|
||||
|
||||
@ -44,7 +44,7 @@ Every element of your Landing Page should resonate with its core objective. Here
|
||||
- **Compelling Copy**: Clear, concise, and persuasive text that speaks directly to the visitor's needs.
|
||||
- **Clear Call-to-Action (CTA)**: A standout button or link urging the visitor to take action.
|
||||
- **Minimalist Design**: A clutter-free layout that emphasizes the offer. For example, using a Tailwind CSS web template like AstroWind.
|
||||
- **Trust Indicators**: Testimonials, reviews, and badges that bolster credibility.
|
||||
- **Trust Indicators**: Endorsements, reviews, and badges that bolster credibility.
|
||||
|
||||
Imagine browsing online for a writing course. You land on a page with a captivating headline: "Unlock the Writer Within." Below, there's an engaging image of a person writing, followed by persuasive text and a bright "Enroll Now" button. This Landing Page has effectively used its elements to entice you to sign up.
|
||||
|
||||
@ -55,29 +55,31 @@ While both are pivotal, they serve distinct roles:
|
||||
- **Homepage**: Offers a panoramic view of your brand, catering to diverse visitor intents.
|
||||
- **Landing Page**: Zeros in on a single, specific action, be it signing up, purchasing, or downloading.
|
||||
|
||||
Consider a popular online store. Their homepage might display various product categories, from electronics to clothing. However, if they're promoting a summer sale, the Landing Page would focus solely on summer products, urging visitors to "Shop the Summer Sale Now!"
|
||||
Consider a popular online store. Their homepage might display various product categories, from electronics to clothing. However, if they’re promoting a summer sale, the Landing Page would focus solely on summer products. This focused approach urges visitors to take action, encouraging them to "Shop the Summer Sale Now!"
|
||||
|
||||
## The Art of Optimization
|
||||
|
||||
The digital realm is ever-evolving. Regular tweaks based on analytics can ensure your Landing Page remains a conversion powerhouse. Embrace A/B testing to compare different versions and refine for optimal results.
|
||||
|
||||
Let's say you have a Landing Page for a new skincare product. Version A uses an image of the product, while Version B showcases a video testimonial. A/B testing might reveal that Version B, with the video, has a 20% higher conversion rate. Such insights can be invaluable for future campaigns.
|
||||
Let's say you have a Landing Page for a new skincare product. Version A uses an image of the product, while Version B showcases a video review. A/B testing might reveal that Version B, with the video, has a 20% higher conversion rate. Such insights can be invaluable for future campaigns.
|
||||
|
||||
## Landing Pages in Action
|
||||
|
||||
Whether promoting a product launch, capturing emails for a newsletter, or driving registrations for an event, Landing Pages are versatile tools in your marketing toolkit. They're not just about capturing leads but nurturing and converting them.
|
||||
Landing Pages are versatile tools in your marketing toolkit. They play a role in various scenarios: promoting a product launch, capturing emails for a newsletter, or driving event registrations. They’re not just about capturing leads but nurturing and converting them.
|
||||
|
||||
Presented below are several prevalent types of Landing Pages. Each link not only offers a prime example of its respective type but is also meticulously crafted in the form of a comprehensive guide. This ensures that you not only witness the best practices in action but also gain a step-by-step understanding of how to masterfully create each type.
|
||||
Presented below are several prevalent types of Landing Pages. Each link offers a prime example of its respective type. Additionally, we carefully craft each link in the form of a comprehensive guide.
|
||||
|
||||
This approach ensures that you observe the best practices in action. Also, it enables you to acquire a step-by-step understanding of how to skillfully create each type.
|
||||
|
||||
### [Lead Generation Landing Page](landing/lead-generation)
|
||||
|
||||
**Purpose**: Designed primarily to capture user data, such as email addresses or contact details.
|
||||
|
||||
**Content**: Typically features a form alongside a description of what the user will receive in return, be it an eBook, a webinar, or a free trial.
|
||||
**Content**: Usually includes a form where users can input their details. It also highlights what they'll get in return, such as an eBook, a webinar, or a free trial.
|
||||
|
||||
**Focus**: Enticing visitors to provide their personal details by offering something valuable in return.
|
||||
|
||||
**Key Differentiator**: Unlike "Click-through Landing Pages" that aim to lead users to another step, these aim to collect user data directly.
|
||||
**Key Differentiator**: Unlike “Click-through Landing Pages,” which guide users to another step, these directly gather user data.
|
||||
|
||||
**Example**: A digital marketing agency offering a free SEO audit in exchange for business contact details.
|
||||
|
||||
@ -85,17 +87,17 @@ Presented below are several prevalent types of Landing Pages. Each link not only
|
||||
|
||||
**Purpose**: Primarily designed to sell, aiming to persuade and convert visitors into customers.
|
||||
|
||||
**Content**: Extensive, providing a wealth of information including product details, benefits, testimonials, success stories, guarantees, and bonuses.
|
||||
**Content**: Extensive, providing a wealth of information including product details, benefits, user stories, success stories, guarantees, and bonuses.
|
||||
|
||||
**Focus**: Uses narrative to present a problem and then offers the product or service as the solution, aiming to emotionally connect with the visitor.
|
||||
**Focus**: Utilizes a narrative to present a problem and offer the product or service as the solution. The aim is to emotionally connect with the visitor.
|
||||
|
||||
**Key Differentiator**: Unlike "Click-through Landing Pages", which warm up the visitor for a bigger commitment, these aim to close the sale directly on the page.
|
||||
**Key Differentiator**: While 'Click-through Landing Pages' warm up the visitor for a bigger commitment. 'Long-form Sales Landing Pages' aim to close the sale directly on the page.
|
||||
|
||||
**Example**: A weight loss program detailing an individual's journey, challenges faced, how the program helped, and why it's the ideal solution for others.
|
||||
**Example**: A weight loss program detailing a person's journey and the challenges they've faced. It also highlights how the program assisted them and why it's an ideal solution for others.
|
||||
|
||||
### [Click-through Landing Page](landing/click-through)
|
||||
|
||||
**Purpose**: Acts as an intermediary step, warming up visitors for a bigger commitment.
|
||||
**Purpose**: Acts as a middle step, warming up visitors for a bigger commitment.
|
||||
|
||||
**Content**: Provides essential details and benefits of an offer, urging visitors to click through to another page.
|
||||
|
||||
@ -113,13 +115,13 @@ Presented below are several prevalent types of Landing Pages. Each link not only
|
||||
|
||||
**Focus**: Presents the product or service transparently and attractively.
|
||||
|
||||
**Key Differentiator**: While 'Long-form Sales Landing Pages' aim to persuade through narratives and overcoming objections, 'Product Details Landing Pages' focus on presenting the product or service in a clear and detailed manner.
|
||||
**Key Differentiator**: While 'Long-form Sales Landing Pages' aim to persuade through narratives and overcoming objections. 'Product Details Landing Pages' focus on presenting the product or service in a clear and detailed manner.
|
||||
|
||||
**Example**: A tech website detailing a new laptop's specifications, unique features, comparisons with previous models, and user reviews.
|
||||
|
||||
### [Coming Soon or Pre-Launch Landing Page](landing/pre-launch)
|
||||
|
||||
**Purpose**: Builds anticipation for an upcoming product, service, or event.
|
||||
**Purpose**: Creates excitement for an upcoming product, service, or event.
|
||||
|
||||
**Content**: Often includes a countdown timer, teaser content, and an option to sign up for notifications.
|
||||
|
||||
@ -143,6 +145,6 @@ Presented below are several prevalent types of Landing Pages. Each link not only
|
||||
|
||||
## Conclusion
|
||||
|
||||
In the digital marketing symphony, Landing Pages are the crescendo. They capture attention, evoke action, and drive results. As we sail into the future, ensuring your Landing Pages are optimized, relevant, and high-converting will be the key to digital success.
|
||||
In the digital marketing symphony, Landing Pages become the crescendo. They capture attention, evoke action, and drive results. As we move forward, an essential task is to optimize, maintain relevance, and create high-converting Landing Pages. These factors collectively hold the key to achieving digital success.
|
||||
|
||||
Picture a world where every online interaction is personalized and focused. That's the power of Landing Pages. Whether you're a startup trying to gain traction or an established brand launching a new product, Landing Pages can be the catalyst for digital growth and engagement.
|
||||
Imagine a world where every online interaction gets personalized and directed. This showcases the potential of Landing Pages. For startups seeking traction or established brands introducing new products, Landing Pages can serve as the catalyst. They possess the power to spur digital growth and boost engagement.
|
||||
|
||||
@ -10,12 +10,9 @@ const metadata = {
|
||||
---
|
||||
|
||||
<Layout metadata={metadata}>
|
||||
<!-- HeroText Widget ******************* -->
|
||||
<!-- HeroText Widget ******************* -->
|
||||
|
||||
<HeroText
|
||||
tagline="Contact"
|
||||
title="Let's Connect!"
|
||||
/>
|
||||
<HeroText tagline="Contact" title="Let's Connect!" />
|
||||
|
||||
<ContactUs
|
||||
title="Drop us a message today!"
|
||||
|
||||
@ -19,7 +19,12 @@ const metadata = {
|
||||
|
||||
<Hero2
|
||||
tagline="Mobile App Web Demo"
|
||||
callToAction={{ text: 'Download App', href: 'https://github.com/onwidget/astrowind', icon: 'tabler:download' }}
|
||||
callToAction={{
|
||||
targetBlank: true,
|
||||
text: 'Download App',
|
||||
href: 'https://github.com/onwidget/astrowind',
|
||||
icon: 'tabler:download',
|
||||
}}
|
||||
callToAction2={{ text: 'Learn more', href: '#features' }}
|
||||
image={{
|
||||
src: 'https://images.unsplash.com/photo-1535303311164-664fc9ec6532?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=987&q=80',
|
||||
@ -42,6 +47,7 @@ const metadata = {
|
||||
<!-- Features3 Widget ************** -->
|
||||
|
||||
<Features3
|
||||
id="features"
|
||||
title="How to use our app?"
|
||||
subtitle="Tired of spending hours crafting documents from scratch? Our app offers an innovative solution. With a wide array of professionally designed templates, you can now create stunning documents in minutes. Explore our templates now and experience the difference."
|
||||
tagline="Step-by-step guide"
|
||||
|
||||
@ -40,7 +40,12 @@ const metadata = {
|
||||
|
||||
<!-- Hero2 Widget ******************* -->
|
||||
|
||||
<Hero id="hero" title="Sarah Johnson" tagline="Personal Web Demo" callToAction={{ text: 'Hire me', href: '/' }}>
|
||||
<Hero
|
||||
id="hero"
|
||||
title="Sarah Johnson"
|
||||
tagline="Personal Web Demo"
|
||||
callToAction={{ targetBlank: true, text: 'Hire me', href: '/' }}
|
||||
>
|
||||
<Fragment slot="subtitle">
|
||||
I'm a Graphic Designer passionate about crafting visual stories. <br /> With 5 years of experience and a degree
|
||||
from New York University's School of Design. I infuse vitality into brands and designs, transforming concepts into
|
||||
|
||||
@ -41,7 +41,7 @@ const metadata = {
|
||||
|
||||
<Hero2
|
||||
tagline="SaaS Web Demo"
|
||||
callToAction={{ text: 'Get Started', href: 'https://github.com/onwidget/astrowind' }}
|
||||
callToAction={{ targetBlank: true, text: 'Get Started', href: 'https://github.com/onwidget/astrowind' }}
|
||||
callToAction2={{ text: 'Learn more', href: '#features' }}
|
||||
image={{
|
||||
src: 'https://images.unsplash.com/photo-1580481072645-022f9a6dbf27?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2070&q=80',
|
||||
|
||||
@ -21,7 +21,12 @@ const metadata = {
|
||||
|
||||
<Hero
|
||||
tagline="Startup Web Demo"
|
||||
callToAction={{ text: 'Get templates', href: 'https://github.com/onwidget/astrowind', icon: 'tabler:download' }}
|
||||
callToAction={{
|
||||
targetBlank: true,
|
||||
text: 'Get templates',
|
||||
href: 'https://github.com/onwidget/astrowind',
|
||||
icon: 'tabler:download',
|
||||
}}
|
||||
callToAction2={{ text: 'Learn more', href: '#features' }}
|
||||
>
|
||||
<Fragment slot="title">
|
||||
|
||||
@ -22,7 +22,12 @@ const metadata = {
|
||||
<!-- Hero Widget ******************* -->
|
||||
|
||||
<Hero
|
||||
callToAction={{ text: 'Get template', href: 'https://github.com/onwidget/astrowind', icon: 'tabler:download' }}
|
||||
callToAction={{
|
||||
targetBlank: true,
|
||||
text: 'Get template',
|
||||
href: 'https://github.com/onwidget/astrowind',
|
||||
icon: 'tabler:download',
|
||||
}}
|
||||
callToAction2={{ text: 'Learn more', href: '#features' }}
|
||||
image={{ src: '~/assets/images/hero.png', alt: 'AstroWind Hero Image' }}
|
||||
>
|
||||
@ -320,7 +325,7 @@ const metadata = {
|
||||
title="Frequently Asked Questions"
|
||||
subtitle="Dive into the following questions to gain insights into the powerful features that AstroWind offers and how it can elevate your web development journey."
|
||||
tagline="FAQs"
|
||||
classes={{ container: 'max-w-6xl'}}
|
||||
classes={{ container: 'max-w-6xl' }}
|
||||
items={[
|
||||
{
|
||||
title: 'Why AstroWind?',
|
||||
|
||||
@ -18,7 +18,7 @@ const metadata = {
|
||||
tagline="Services"
|
||||
title="Elevate your projects with our stunning templates"
|
||||
subtitle="Explore our meticulously crafted templates tailored to various industries and purposes. From captivating presentations to functional website designs, we offer the tools you need to succeed."
|
||||
callToAction={{ text: 'Start exploring', href: '/' }}
|
||||
callToAction={{ targetBlank: true, text: 'Start exploring', href: '/' }}
|
||||
image={{
|
||||
src: 'https://images.unsplash.com/photo-1519389950473-47ba0277781c?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1740&q=80',
|
||||
alt: 'AstroWind Hero Image',
|
||||
|
||||
Reference in New Issue
Block a user