This commit is contained in:
widgeter
2023-08-16 16:57:01 +02:00
23 changed files with 334 additions and 202 deletions

View File

@ -49,7 +49,7 @@ const {
)}
</div>
<div
class={`max-w-md pt-1 ${
class={`pt-1 ${
index !== items.length - 1 ? "pb-8" : ""
}`}
>

View File

@ -11,6 +11,8 @@ const {
items = [],
columns = 2,
defaultIcon,
id,
isDark = false,
classes = {},
@ -33,6 +35,7 @@ const {
<ItemGrid
items={items}
columns={columns}
defaultIcon={defaultIcon}
classes={{
container: "",
title: "md:text-[1.3rem]",

View File

@ -10,6 +10,7 @@ const {
tagline = await Astro.slots.render("tagline"),
items = [],
columns = 3,
defaultIcon,
id,
isDark = false,
@ -33,6 +34,7 @@ const {
<ItemGrid2
items={items}
columns={columns}
defaultIcon={defaultIcon}
classes={{
container: "gap-4 md:gap-6",
panel:

View File

@ -12,6 +12,7 @@ const {
image,
items = [],
columns,
defaultIcon,
isBeforeContent,
isAfterContent,
@ -56,6 +57,7 @@ const {
<ItemGrid
items={items}
columns={columns}
defaultIcon={defaultIcon}
classes={{
container: 'mt-12',
panel: 'max-w-full sm:max-w-md',

View File

@ -0,0 +1,80 @@
---
import { Icon } from 'astro-icon/components';
const {
title = await Astro.slots.render('title'),
subtitle = await Astro.slots.render('subtitle'),
tagline,
content = await Astro.slots.render('content'),
callToAction = await Astro.slots.render('callToAction'),
callToAction2 = await Astro.slots.render('callToAction2'),
} = Astro.props;
---
<section class="relative md:-mt-[76px] not-prose">
<div class="absolute inset-0 pointer-events-none" aria-hidden="true"></div>
<div class="relative max-w-7xl mx-auto px-4 sm:px-6">
<div class="pt-0 md:pt-[76px] pointer-events-none"></div>
<div class="py-12 md:py-20 pb-8 md:pb-8">
<div class="text-center 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}
/>
)}
{
title && (
<h1
class="text-5xl md:text-6xl font-bold leading-tighter tracking-tighter mb-4 font-heading dark:text-gray-200"
set:html={title}
/>
)
}
<div class="max-w-3xl mx-auto">
{subtitle && <p class="text-xl text-muted mb-6 dark:text-slate-300" set:html={subtitle} />}
<div class="max-w-xs sm:max-w-md m-auto flex flex-nowrap flex-col sm:flex-row sm:justify-center gap-4">
{
callToAction && (
<div class="flex w-full sm:w-auto">
{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>
)
}
{
callToAction2 && (
<div class="flex w-full sm:w-auto">
{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" />
&nbsp;
</>
)}
{callToAction2.text}
</a>
)}
</div>
)
}
</div>
</div>
{content && <Fragment set:html={content} />}
</div>
</div>
</div>
</section>

View File

@ -1,40 +1,44 @@
---
import WidgetWrapper from "~/components/ui/WidgetWrapper.astro";
import Timeline from "~/components/ui/Timeline.astro";
import Headline from "~/components/ui/Headline.astro";
import WidgetWrapper from '~/components/ui/WidgetWrapper.astro';
import Timeline from '~/components/ui/Timeline.astro';
import Headline from '~/components/ui/Headline.astro';
import Image from '~/components/common/Image.astro';
import type { Steps } from "~/types";
import type { Steps } from '~/types';
const {
title = await Astro.slots.render("title"),
subtitle = await Astro.slots.render("subtitle"),
tagline = await Astro.slots.render("tagline"),
title = await Astro.slots.render('title'),
subtitle = await Astro.slots.render('subtitle'),
tagline = await Astro.slots.render('tagline'),
items = [],
image = await Astro.slots.render("image"),
image = await Astro.slots.render('image'),
isReversed = false,
id,
isDark = false,
classes = {},
bg = await Astro.slots.render("bg"),
bg = await Astro.slots.render('bg'),
} = Astro.props as Steps;
---
<WidgetWrapper id={id} isDark={isDark} containerClass={`max-w-5xl ${classes?.container ?? ""}`} bg={bg}>
<div class:list={["flex flex-col gap-8 md:gap-12 md:flex-row", { "md:flex-row-reverse": isReversed }]}>
<div class="md:py-4 md:basis-1/2 md:self-center">
<WidgetWrapper id={id} isDark={isDark} containerClass={`max-w-5xl ${classes?.container ?? ''}`} bg={bg}>
<div class:list={['flex flex-col gap-8 md:gap-12', { 'md:flex-row-reverse': isReversed }, { 'md:flex-row': image}]}>
<div class:list={["md:py-4 md:self-center", { 'md:basis-1/2': image }, { "w-full": !image}]}>
<Headline
title={title}
subtitle={subtitle}
tagline={tagline}
classes={{ container: "text-left rtl:text-right", title: "text-3xl lg:text-4xl", ...((classes?.headline as {}) ?? {}) }}
classes={{
container: 'text-left rtl:text-right',
title: 'text-3xl lg:text-4xl',
...((classes?.headline as {}) ?? {}),
}}
/>
<Timeline items={items} classes={classes?.items as {}} />
</div>
<div class="relative md:basis-1/2">
{
image &&
(typeof image === 'string' ? (
image && (
<div class="relative md:basis-1/2">
{(typeof image === 'string' ? (
<Fragment set:html={image} />
) : (
<Image
@ -45,10 +49,11 @@ const {
height={768}
layout="cover"
src={image?.src}
alt={image?.alt || ""}
alt={image?.alt || ''}
/>
))
))}
</div>
)
}
</div>
</div>
</WidgetWrapper>

View File

@ -14,7 +14,7 @@ export const headerData = {
href: getPermalink('/homes/startup'),
},
{
text: 'App Download',
text: 'Mobile App',
href: getPermalink('/homes/mobile-app'),
},
{
@ -71,10 +71,6 @@ export const headerData = {
text: 'Click-Through',
href: getPermalink('/landing/click-through'),
},
{
text: 'Squeeze',
href: getPermalink('/landing/squeeze'),
},
{
text: 'Product Details (or Services)',
href: getPermalink('/landing/product'),
@ -83,6 +79,10 @@ export const headerData = {
text: 'Coming Soon or Pre-Launch',
href: getPermalink('/landing/pre-launch'),
},
{
text: 'Subscription',
href: getPermalink('/landing/subscription'),
},
],
},
{

View File

@ -15,6 +15,7 @@ const metadata = {
<!-- Hero Widget ******************* -->
<Hero
tagline="About us"
image={{
src: 'https://images.unsplash.com/photo-1559136555-9303baea8ebd?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2070&q=80',
alt: 'Caos Image',

View File

@ -1,7 +1,7 @@
---
import Layout from '~/layouts/PageLayout.astro';
import HeroText from '~/components/widgets/HeroText.astro';
import ContactUs from '~/components/widgets/Contact.astro';
import FAQs from '~/components/widgets/FAQs.astro';
import Features2 from '~/components/widgets/Features2.astro';
const metadata = {
@ -10,6 +10,13 @@ const metadata = {
---
<Layout metadata={metadata}>
<!-- HeroText Widget ******************* -->
<HeroText
tagline="Contact"
title="Let's Connect!"
/>
<ContactUs
title="Drop us a message today!"
subtitle="For quicker answers, explore our FAQs section. You may find the solution you're looking for right there! If not, our support team is delighted to help you."
@ -71,41 +78,4 @@ const metadata = {
},
]}
/>
<!-- FAQs Widget ******************* -->
<FAQs
title="Frequently Asked Questions"
items={[
{
title: 'Do you provide instructions on how to use and edit the templates?',
description:
'Absolutely! We understand the importance of providing clear guidance. Each template comes with comprehensive instructions on how to use and customize it effectively.',
},
{
title: 'How can I download the templates after purchasing?',
description:
"Downloading your purchased templates is a simple process. Once you've completed the purchase, you'll receive an email containing a link to your personal download area.",
},
{
title: 'Are updates included with the templates?',
description:
'Yes, we are committed to continually improving and enhancing our templates to ensure they meet the latest design standards and technological advancements.',
},
{
title: 'How often do you release new templates?',
description:
'The exact frequency of releases may vary, our team works diligently to introduce new templates every quarter, depending on design trends, industry developments, and customer demand.',
},
{
title: 'Can I request custom templates to be developed?',
description: `Absolutely, we offer a custom template development service to cater to your specific needs. If you have a particular design idea, concept, or functionality in mind, we'd be more than happy to discuss creating a custom template for you.`,
},
{
title: 'What payment methods do you accept?',
description:
'Currently, we accept major credit and debit cards, including Visa, MasterCard, American Express, and Discover. Additionally, we facilitate payments through trusted online payment platforms such as PayPal and Apple Pay.',
},
]}
/>
</Layout>

View File

@ -18,6 +18,7 @@ const metadata = {
<!-- Hero2 Widget ******************* -->
<Hero2
tagline="Mobile App Web Demo"
callToAction={{ text: 'Download App', href: 'https://github.com/onwidget/astrowind', icon: 'tabler:download' }}
callToAction2={{ text: 'Learn more', href: '#features' }}
image={{

View File

@ -16,6 +16,7 @@ const metadata = {
---
<Layout metadata={metadata}>
<Fragment slot="announcement"></Fragment>
<Fragment slot="header">
<Header
links={[
@ -28,23 +29,18 @@ const metadata = {
]}
actions={[
{
type: 'ghost',
text: 'Login',
href: '#',
},
{
type: 'primary',
text: 'Sign Up',
text: 'Hire me',
href: '#',
},
]}
isSticky
showToggleTheme
/>
</Fragment>
<!-- Hero2 Widget ******************* -->
<Hero id="hero" title="Sarah Johnson" callToAction={{ text: 'Hire me', href: '/' }}>
<Hero id="hero" title="Sarah Johnson" tagline="Personal Web Demo" callToAction={{ 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
@ -100,7 +96,6 @@ const metadata = {
<Steps
id="resume"
title="Work experience"
isReversed={true}
items={[
{
title:
@ -115,10 +110,7 @@ const metadata = {
icon: 'tabler:briefcase',
},
]}
image={{
src: 'https://images.unsplash.com/photo-1557672172-298e090bd0f1?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=774&q=80',
alt: 'Steps image',
}}
classes={{ container: 'max-w-3xl' }}
/>
<!-- Steps Widget ****************** -->
@ -136,10 +128,7 @@ const metadata = {
icon: 'tabler:school',
},
]}
image={{
src: 'https://images.unsplash.com/photo-1557672172-298e090bd0f1?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=774&q=80',
alt: 'Steps image',
}}
classes={{ container: 'max-w-3xl' }}
/>
<!-- Features3 Widget ************** -->
@ -148,51 +137,43 @@ const metadata = {
title="Skills"
subtitle="Discover the proficiencies that allow me to bring imagination to life through design."
columns={3}
defaultIcon="tabler:point-filled"
items={[
{
title: 'Graphic design',
description: 'Proficient in crafting visually appealing designs that convey messages effectively.',
icon: 'tabler:point-filled',
},
{
title: 'Branding and identity',
description: 'Skilled at developing cohesive brand identities, including logos and brand guidelines.',
icon: 'tabler:point-filled',
},
{
title: 'User-centered design',
description: 'Experienced in creating user-friendly interfaces and optimizing user experiences.',
icon: 'tabler:point-filled',
},
{
title: 'Adobe Creative Suite',
description: 'Skilled in using Photoshop, Illustrator, and InDesign to create and edit visual elements.',
icon: 'tabler:point-filled',
},
{
title: 'Typography',
description: 'Adept in selecting and manipulating typefaces to enhance design aesthetics.',
icon: 'tabler:point-filled',
},
{
title: 'Color theory',
description: 'Proficient in using color to evoke emotions and enhance visual harmony.',
icon: 'tabler:point-filled',
},
{
title: 'Print and digital design',
description: 'Knowledgeable in designing for both print materials and digital platforms.',
icon: 'tabler:point-filled',
},
{
title: 'Attention to detail',
description: 'Diligent in maintaining precision and quality in all design work.',
icon: 'tabler:point-filled',
},
{
title: 'Adaptability',
description: 'Quick to adapt to new design trends, technologies, and client preferences.',
icon: 'tabler:point-filled',
},
]}
/>
@ -380,4 +361,11 @@ const metadata = {
href: '/',
}}
/>
<!-- BlogLatestPost Widget **************** -->
<BlogLatestPosts id="blog" title="My blog">
<Fragment slot="bg">
<div class="absolute inset-0 bg-blue-50 dark:bg-transparent"></div>
</Fragment>
</BlogLatestPosts>
</Layout>

View File

@ -38,6 +38,7 @@ const metadata = {
<!-- Hero2 Widget ******************* -->
<Hero2
tagline="SaaS Web Demo"
callToAction={{ text: 'Get template', href: 'https://github.com/onwidget/astrowind', icon: 'tabler:download' }}
callToAction2={{ text: 'Learn more', href: '#features' }}
image={{

View File

@ -19,6 +19,7 @@ const metadata = {
<!-- Hero Widget ******************* -->
<Hero
tagline="Startup Web Demo"
callToAction={{ text: 'Get templates', href: 'https://github.com/onwidget/astrowind', icon: 'tabler:download' }}
callToAction2={{ text: 'Learn more', href: '#features' }}
>

View File

@ -2,6 +2,7 @@
import Layout from '~/layouts/LandingLayout.astro';
import Hero2 from '~/components/widgets/Hero2.astro';
import CallToAction from "~/components/widgets/CallToAction.astro"
const metadata = {
title: 'Click-through Landing Page Demo',
@ -12,14 +13,24 @@ const metadata = {
<!-- Hero2 Widget ******************* -->
<Hero2
tagline="Click-through Landing Demo"
title="Unlock the Secrets to an Effective Lead Generation Landing"
subtitle="Where every click is a potential lead waiting to happen. Your Hero should grab attention instantly. Use a powerful headline that speaks directly to your target audience."
callToAction={{ text: 'Download App', href: 'https://github.com/onwidget/astrowind', icon: 'tabler:download' }}
callToAction2={{ text: 'Learn more', href: '#features' }}
tagline="Click-through Demo"
title="Click-through Landing Page: The Perfect Bridge to Conversion!"
subtitle="Learn how to design a Click-Through Landing Page that seamlessly guides visitors to your main offer."
callToAction={{ text: 'Call to Action', href: '#', icon: 'tabler:square-rounded-arrow-right' }}
callToAction2={{ text: 'Learn more', href: '#' }}
image={{
src: 'https://images.unsplash.com/photo-1516321497487-e288fb19713f?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2070&q=80',
alt: 'AstroWind Hero Image',
alt: 'Click-through Landing Page Hero Image',
}}
/>
<CallToAction
title="Coming soon"
subtitle="We are working on the content of these demo pages. You will see them very soon. Stay tuned Stay tuned!"
callToAction={{
text: 'Get template',
href: 'https://github.com/onwidget/astrowind',
icon: 'tabler:download',
}}
/>
</Layout>

View File

@ -1,7 +1,8 @@
---
import Layout from '~/layouts/LandingLayout.astro';
import Hero2 from '~/components/widgets/Hero2.astro';
import Hero from '~/components/widgets/Hero.astro';
import CallToAction from '~/components/widgets/CallToAction.astro';
const metadata = {
title: 'Lead Generation Landing Page Demo',
@ -11,15 +12,25 @@ const metadata = {
<Layout metadata={metadata}>
<!-- Hero2 Widget ******************* -->
<Hero2
<Hero
tagline="Lead Generation Landing Demo"
title="Unlock the Secrets to an Effective Lead Generation Landing"
subtitle="Where every click is a potential lead waiting to happen. Your Hero should grab attention instantly. Use a powerful headline that speaks directly to your target audience."
callToAction={{ text: 'Download App', href: 'https://github.com/onwidget/astrowind', icon: 'tabler:download' }}
callToAction2={{ text: 'Learn more', href: '#features' }}
title="Effective Lead Generation Landing Page: Unlock the Secrets"
subtitle="Discover the secrets to creating a Landing Page that turns curious visitors into eager leads. (Your Hero should grab attention instantly. Use a powerful headline that speaks directly to your target audience.)"
callToAction={{ text: 'Call to Action', href: '#', icon: 'tabler:square-rounded-arrow-right' }}
callToAction2={{ text: 'Learn more', href: '#' }}
image={{
src: 'https://images.unsplash.com/photo-1516321497487-e288fb19713f?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2070&q=80',
alt: 'AstroWind Hero Image',
src: 'https://images.unsplash.com/photo-1597423498219-04418210827d?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1674&q=80',
alt: 'Magnet attracting screws. Lead generation landing page demo',
}}
/>
<CallToAction
title="Coming soon"
subtitle="We are working on the content of these demo pages. You will see them very soon. Stay tuned Stay tuned!"
callToAction={{
text: 'Get template',
href: 'https://github.com/onwidget/astrowind',
icon: 'tabler:download',
}}
/>
</Layout>

View File

@ -2,9 +2,10 @@
import Layout from '~/layouts/LandingLayout.astro';
import Hero2 from '~/components/widgets/Hero2.astro';
import CallToAction from '~/components/widgets/CallToAction.astro';
const metadata = {
title: 'Coming Soon Landing Page',
title: 'Pre-Launch Landing Page',
};
---
@ -12,14 +13,24 @@ const metadata = {
<!-- Hero2 Widget ******************* -->
<Hero2
tagline="Coming Soon Landing Demo"
title="Unlock the Secrets to an Effective Lead Generation Landing"
subtitle="Where every click is a potential lead waiting to happen. Your Hero should grab attention instantly. Use a powerful headline that speaks directly to your target audience."
callToAction={{ text: 'Download App', href: 'https://github.com/onwidget/astrowind', icon: 'tabler:download' }}
callToAction2={{ text: 'Learn more', href: '#features' }}
tagline="Pre-launch Demo"
title="Pre-launch Landing Page: Build the Hype Before the Big Reveal!"
subtitle="Craft a tantalizing Coming Soon or Pre-Launch Landing Page that leaves visitors eagerly awaiting your launch."
callToAction={{ text: 'Call to Action', href: '#', icon: 'tabler:square-rounded-arrow-right' }}
callToAction2={{ text: 'Learn more', href: '#' }}
image={{
src: 'https://images.unsplash.com/photo-1516321497487-e288fb19713f?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2070&q=80',
alt: 'AstroWind Hero Image',
src: 'https://images.unsplash.com/photo-1558803116-c1b4ac867b31?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2069&q=80',
alt: 'Store with a Coming Soon sign. Pre-launch Landing Page',
}}
/>
<CallToAction
title="Coming soon"
subtitle="We are working on the content of these demo pages. You will see them very soon. Stay tuned Stay tuned!"
callToAction={{
text: 'Get template',
href: 'https://github.com/onwidget/astrowind',
icon: 'tabler:download',
}}
/>
</Layout>

View File

@ -1,7 +1,8 @@
---
import Layout from '~/layouts/LandingLayout.astro';
import Hero2 from '~/components/widgets/Hero2.astro';
import Hero from '~/components/widgets/Hero.astro';
import CallToAction from '~/components/widgets/CallToAction.astro';
const metadata = {
title: 'Product Details Landing Page Demo',
@ -11,15 +12,25 @@ const metadata = {
<Layout metadata={metadata}>
<!-- Hero2 Widget ******************* -->
<Hero2
tagline="Product Details Landing Demo"
title="Unlock the Secrets to an Effective Lead Generation Landing"
subtitle="Where every click is a potential lead waiting to happen. Your Hero should grab attention instantly. Use a powerful headline that speaks directly to your target audience."
callToAction={{ text: 'Download App', href: 'https://github.com/onwidget/astrowind', icon: 'tabler:download' }}
callToAction2={{ text: 'Learn more', href: '#features' }}
<Hero
tagline="Product Details Demo"
title="Product Landing Page: Showcase with Precision and Passion!"
subtitle="Step-by-step guide to designing a Landing Page that highlights every facet of your product or service."
callToAction={{ text: 'Call to Action', href: '#', icon: 'tabler:square-rounded-arrow-right' }}
callToAction2={{ text: 'Learn more', href: '#' }}
image={{
src: 'https://images.unsplash.com/photo-1516321497487-e288fb19713f?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2070&q=80',
alt: 'AstroWind Hero Image',
src: 'https://images.unsplash.com/photo-1473188588951-666fce8e7c68?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2174&q=80',
alt: 'A spotlight on a product. Product Details Landing Page Demo',
}}
/>
<CallToAction
title="Coming soon"
subtitle="We are working on the content of these demo pages. You will see them very soon. Stay tuned Stay tuned!"
callToAction={{
text: 'Get template',
href: 'https://github.com/onwidget/astrowind',
icon: 'tabler:download',
}}
/>
</Layout>

View File

@ -2,6 +2,7 @@
import Layout from '~/layouts/LandingLayout.astro';
import Hero2 from '~/components/widgets/Hero2.astro';
import CallToAction from '~/components/widgets/CallToAction.astro';
const metadata = {
title: 'Sales Landing Page Demo',
@ -12,14 +13,24 @@ const metadata = {
<!-- Hero2 Widget ******************* -->
<Hero2
tagline="Sales Landing Demo"
title="Unlock the Secrets to an Effective Lead Generation Landing"
subtitle="Where every click is a potential lead waiting to happen. Your Hero should grab attention instantly. Use a powerful headline that speaks directly to your target audience."
callToAction={{ text: 'Download App', href: 'https://github.com/onwidget/astrowind', icon: 'tabler:download' }}
callToAction2={{ text: 'Learn more', href: '#features' }}
tagline="Long-form Sales Demo"
title="Long-form Sales: Sell with a Story: The Long-form Way!"
subtitle="Dive deep into crafting a Landing Page that narrates, persuades, and converts."
callToAction={{ text: 'Call to Action', href: '#', icon: 'tabler:square-rounded-arrow-right' }}
callToAction2={{ text: 'Learn more', href: '#' }}
image={{
src: 'https://images.unsplash.com/photo-1516321497487-e288fb19713f?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2070&q=80',
alt: 'AstroWind Hero Image',
src: 'https://images.unsplash.com/photo-1621452773781-0f992fd1f5cb?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1626&q=80',
alt: 'Children telling a story. Long-form Sales Landing Page demo',
}}
/>
<CallToAction
title="Coming soon"
subtitle="We are working on the content of these demo pages. You will see them very soon. Stay tuned Stay tuned!"
callToAction={{
text: 'Get template',
href: 'https://github.com/onwidget/astrowind',
icon: 'tabler:download',
}}
/>
</Layout>

View File

@ -1,25 +0,0 @@
---
import Layout from '~/layouts/LandingLayout.astro';
import Hero2 from '~/components/widgets/Hero2.astro';
const metadata = {
title: 'Squeeze Landing Page Demo',
};
---
<Layout metadata={metadata}>
<!-- Hero2 Widget ******************* -->
<Hero2
tagline="Squeeze Landing Demo"
title="Unlock the Secrets to an Effective Lead Generation Landing"
subtitle="Where every click is a potential lead waiting to happen. Your Hero should grab attention instantly. Use a powerful headline that speaks directly to your target audience."
callToAction={{ 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-1516321497487-e288fb19713f?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2070&q=80',
alt: 'AstroWind Hero Image',
}}
/>
</Layout>

View File

@ -0,0 +1,36 @@
---
import Layout from '~/layouts/LandingLayout.astro';
import Hero2 from '~/components/widgets/Hero2.astro';
import CallToAction from '~/components/widgets/CallToAction.astro';
const metadata = {
title: 'Subscription Landing Page Demo',
};
---
<Layout metadata={metadata}>
<!-- Hero2 Widget ******************* -->
<Hero2
tagline="Subscription Landing Demo"
title="Subscription Landing Page: Turn Casual Browsers into Loyal Subscribers!"
subtitle="Unlock the formula for a Subscription Landing Page that keeps your audience coming back for more."
callToAction={{ text: 'Call to Action', href: '#', icon: 'tabler:square-rounded-arrow-right' }}
callToAction2={{ text: 'Learn more', href: '#' }}
image={{
src: 'https://images.unsplash.com/photo-1593510987046-1f8fcfc512a0?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2070&q=80',
alt: 'Ironic image associated with canceling a subscription. Subscription Landing Page Demo',
}}
/>
<CallToAction
title="Coming soon"
subtitle="We are working on the content of these demo pages. You will see them very soon. Stay tuned Stay tuned!"
callToAction={{
text: 'Get template',
href: 'https://github.com/onwidget/astrowind',
icon: 'tabler:download',
}}
/>
</Layout>

View File

@ -1,5 +1,6 @@
---
import Layout from '~/layouts/PageLayout.astro';
import HeroText from '~/components/widgets/HeroText.astro';
import Prices from '~/components/widgets/Pricing.astro';
import FAQs from '~/components/widgets/FAQs.astro';
import Steps from '~/components/widgets/Steps.astro';
@ -12,6 +13,14 @@ const metadata = {
---
<Layout metadata={metadata}>
<!-- HeroText Widget ******************* -->
<HeroText
tagline="Pricing"
title="Stellar Pricing for Every Journey"
subtitle="Choose the perfect plan that aligns with your cosmic goals."
/>
<!-- Pricing Widget ******************* -->
<Prices
@ -106,7 +115,7 @@ const metadata = {
<Features3
title="Price-related features"
subtitle="Discover the advantages of choosing our plans"
columns={3}
columns={2}
items={[
{
title: 'Tiered Pricing Plans',
@ -139,6 +148,7 @@ const metadata = {
icon: 'tabler:headset',
},
]}
classes={{ container: "max-w-5xl"}}
/>
<!-- Steps Widget ****************** -->

View File

@ -15,6 +15,7 @@ const metadata = {
<!-- Hero Widget ******************* -->
<Hero
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: '/' }}

1
src/types.d.ts vendored
View File

@ -239,6 +239,7 @@ export interface Features extends Headline, Widget {
video?: Video;
items: Array<Item>;
columns: number;
defaultIcon?: string;
callToAction1?: CallToAction;
callToAction2?: CallToAction;
isReversed?: boolean;