@ -27,17 +27,15 @@ const metadata = {
|
|||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<Fragment slot="title">
|
<Fragment slot="title">
|
||||||
Free template for <span class="hidden lg:inline">create your website <br />with</span>
|
AstroWind <span class="text-accent dark:text-white highlight">App</span>: <br /> building professional websites
|
||||||
<span class="text-accent dark:text-white highlight"> Astro 2.0</span> + Tailwind CSS
|
made easy
|
||||||
</Fragment>
|
</Fragment>
|
||||||
|
|
||||||
<Fragment slot="subtitle">
|
<Fragment slot="subtitle">
|
||||||
<span class="hidden sm:inline">
|
<span class="hidden sm:inline">
|
||||||
<span class="font-semibold">AstroWind</span> is a free, customizable and production-ready template for Astro 2.0
|
Unlock boundless creativity at your fingertips: your gateway to innovative design.
|
||||||
+ Tailwind CSS.</span
|
</span>
|
||||||
>
|
Download now and embark on a journey to elevate your projects like never before.
|
||||||
<span class="block mb-1 sm:hidden font-bold text-blue-600">AstroWind: Production-ready.</span> Suitable for
|
|
||||||
Startups, Small Business, Sass Websites, Professional Portfolios, Marketing Websites, Landing Pages & Blogs.
|
|
||||||
</Fragment>
|
</Fragment>
|
||||||
</Hero2>
|
</Hero2>
|
||||||
|
|
||||||
|
@ -351,7 +351,12 @@ const metadata = {
|
|||||||
/>
|
/>
|
||||||
|
|
||||||
<!-- BlogLatestPost Widget **************** -->
|
<!-- BlogLatestPost Widget **************** -->
|
||||||
<BlogLatestPosts id="blog" title="My blog">
|
|
||||||
|
<BlogLatestPosts
|
||||||
|
id="blog"
|
||||||
|
title="Explore my insightful articles on my blog"
|
||||||
|
information={`Dive into a realm of design wisdom and creative inspiration, where you'll find invaluable insights, practical tips, and captivating narratives that elevate and enrich your creative journey.`}
|
||||||
|
>
|
||||||
<Fragment slot="bg">
|
<Fragment slot="bg">
|
||||||
<div class="absolute inset-0 bg-blue-50 dark:bg-transparent"></div>
|
<div class="absolute inset-0 bg-blue-50 dark:bg-transparent"></div>
|
||||||
</Fragment>
|
</Fragment>
|
||||||
|
@ -7,8 +7,10 @@ import Features from '~/components/widgets/Features.astro';
|
|||||||
import Steps2 from '~/components/widgets/Steps2.astro';
|
import Steps2 from '~/components/widgets/Steps2.astro';
|
||||||
import Content from '~/components/widgets/Content.astro';
|
import Content from '~/components/widgets/Content.astro';
|
||||||
import CallToAction from '~/components/widgets/CallToAction.astro';
|
import CallToAction from '~/components/widgets/CallToAction.astro';
|
||||||
|
import Pricing from '~/components/widgets/Pricing.astro';
|
||||||
|
|
||||||
import { headerData } from '~/navigation';
|
import { headerData } from '~/navigation';
|
||||||
|
import FAQs from '~/components/widgets/FAQs.astro';
|
||||||
|
|
||||||
const metadata = {
|
const metadata = {
|
||||||
title: 'Saas Landing Page',
|
title: 'Saas Landing Page',
|
||||||
@ -41,64 +43,65 @@ const metadata = {
|
|||||||
tagline="SaaS Web Demo"
|
tagline="SaaS Web Demo"
|
||||||
callToAction={{ text: 'Get template', href: 'https://github.com/onwidget/astrowind', icon: 'tabler:download' }}
|
callToAction={{ text: 'Get template', href: 'https://github.com/onwidget/astrowind', icon: 'tabler:download' }}
|
||||||
callToAction2={{ text: 'Learn more', href: '#features' }}
|
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', alt: 'AstroWind Hero Image' }}
|
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',
|
||||||
|
alt: 'AstroWind Hero Image',
|
||||||
|
}}
|
||||||
>
|
>
|
||||||
<Fragment slot="title">
|
<Fragment slot="title">
|
||||||
Free template for <br />
|
Simplify web design with Astrowind: <br /> your ultimate <span class="text-accent dark:text-white highlight"
|
||||||
<span class="text-accent dark:text-white highlight"> Astro 2.0</span> + Tailwind CSS
|
>SaaS</span
|
||||||
|
> companion<br />
|
||||||
</Fragment>
|
</Fragment>
|
||||||
|
|
||||||
<Fragment slot="subtitle">
|
<Fragment slot="subtitle">
|
||||||
<span class="hidden sm:inline">
|
<span class="hidden sm:inline">
|
||||||
<span class="font-semibold">AstroWind</span> is a free, customizable and production-ready template for Astro 2.0
|
Elevate your website creation process with <span class="font-semibold">AstroWind</span>'s SaaS solutions.</span
|
||||||
+ Tailwind CSS.</span
|
|
||||||
>
|
>
|
||||||
<span class="block mb-1 sm:hidden font-bold text-blue-600">AstroWind: Production-ready.</span> Suitable for
|
Seamlessly blend the power of Astro 2.0 and Tailwind CSS to craft websites that resonate with your brand and
|
||||||
Startups, Small Business, Sass Websites, Professional Portfolios, Marketing Websites, Landing Pages & Blogs.
|
audience.
|
||||||
</Fragment>
|
</Fragment>
|
||||||
</Hero2>
|
</Hero2>
|
||||||
|
|
||||||
<!-- Features Widget *************** -->
|
<!-- Features Widget *************** -->
|
||||||
|
|
||||||
<Features
|
<Features
|
||||||
id="features"
|
id="features"
|
||||||
tagline="Features"
|
title="Why choose AstroWind?"
|
||||||
title="Main features of our templates"
|
subtitle="Each of the following features enhances AstroWind's value proposition."
|
||||||
subtitle="Possess several key characteristics to effectively cater to the needs of startups and entrepreneurs."
|
columns={2}
|
||||||
columns={3}
|
|
||||||
items={[
|
items={[
|
||||||
{
|
{
|
||||||
title: 'Modern and Professional Design',
|
title: 'Integration of Astro 2.0 and Tailwind CSS',
|
||||||
description:
|
description:
|
||||||
'Have a contemporary design that reflects current design trends and gives a professional impression.',
|
'Offers a powerful combination that enhances both the development process and the end-user experience. Also, allows to build dynamic and visually stunning websites with optimized performance.',
|
||||||
|
icon: 'tabler:layers-union',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: 'Versatile design for startups, small businesses, and more',
|
||||||
|
description: `Easily customize AstroWind to harmonize with the unique branding and identity of your venture. AstroWind's versatile design adapts to suit your needs.`,
|
||||||
icon: 'tabler:artboard',
|
icon: 'tabler:artboard',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: 'Responsive and Mobile-Friendly',
|
title: 'Effortless customization for portfolios and marketing sites',
|
||||||
description: 'Adapt seamlessly to different screen sizes and devices to ensure a consistent experience.',
|
|
||||||
icon: 'tabler:picture-in-picture',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: 'Customizability',
|
|
||||||
description:
|
description:
|
||||||
'Easily customizable, allowing users to adapt the design, colors, typography, and content to match their brand identity.',
|
'With intuitive customization, easily showcase portfolio pieces, case studies, project highlights, and relevant content. Ideal for creative professionals and businesses looking to highlight their expertise.',
|
||||||
icon: 'tabler:adjustments-horizontal',
|
icon: 'tabler:writing',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: 'Fast Loading Times',
|
title: 'Optimized landing pages and engaging blogs',
|
||||||
description: 'Optimized for speed to ensure a smooth user experience and favorable search engine rankings.',
|
description: `Landing pages are strategically designed to captivate visitors and prompt specific actions. Additionally, the blog creation feature empowers sharing insights, engaging the audience.`,
|
||||||
|
icon: 'tabler:podium',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: 'Fast loading times and production-ready code',
|
||||||
|
description: `Using Astro 2.0 ensures fast loading and seamless rendering, enhancing browsing. The code follows best practices, improving user experience, SEO, and reducing bounce rates.`,
|
||||||
icon: 'tabler:rocket',
|
icon: 'tabler:rocket',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: 'Search Engine Optimization (SEO)',
|
title: 'SEO-optimized structure for enhanced visibility',
|
||||||
description:
|
description: `Follows SEO best practices with clean code, semantic HTML markup, and fast loading, enhancing search engine rankings. AstroWind's SEO structure ensures visibility to potential customers and clients.`,
|
||||||
'Incorporate SEO best practices in template structure and code to improve visibility in search engine results.',
|
icon: 'tabler:eyeglass',
|
||||||
icon: 'tabler:arrows-right-left',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: 'Compatibility',
|
|
||||||
description: 'The templates work seamlessly across various content management systems and website builders.',
|
|
||||||
icon: 'tabler:plug-connected',
|
|
||||||
},
|
},
|
||||||
]}
|
]}
|
||||||
/>
|
/>
|
||||||
@ -215,6 +218,83 @@ const metadata = {
|
|||||||
</Fragment>
|
</Fragment>
|
||||||
</Content>
|
</Content>
|
||||||
|
|
||||||
|
<!-- Pricing Widget ******************* -->
|
||||||
|
|
||||||
|
<Pricing
|
||||||
|
title="Flexible pricing plans for AstroWind"
|
||||||
|
prices={[
|
||||||
|
{
|
||||||
|
title: 'free',
|
||||||
|
subtitle: 'Access to core features and a wide range of templates',
|
||||||
|
price: '0',
|
||||||
|
period: '/ month',
|
||||||
|
callToAction: {
|
||||||
|
targetBlank: true,
|
||||||
|
text: 'Get Started for Free',
|
||||||
|
href: '#',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: 'pro',
|
||||||
|
subtitle: 'Premium templates and advanced customization',
|
||||||
|
price: 15,
|
||||||
|
period: '/ Month',
|
||||||
|
callToAction: {
|
||||||
|
targetBlank: true,
|
||||||
|
text: 'Upgrade to Pro',
|
||||||
|
href: '#',
|
||||||
|
},
|
||||||
|
hasRibbon: true,
|
||||||
|
ribbonTitle: 'popular',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: 'Enterprise',
|
||||||
|
subtitle: 'Tailored solutions for large-scale projects',
|
||||||
|
price: 45,
|
||||||
|
period: '/ Month',
|
||||||
|
callToAction: {
|
||||||
|
targetBlank: true,
|
||||||
|
text: 'Unlock Enterprise Features',
|
||||||
|
href: '#',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
|
||||||
|
<!-- FAQs Widget ******************* -->
|
||||||
|
|
||||||
|
<FAQs
|
||||||
|
title="Frequently Asked Questions"
|
||||||
|
items={[
|
||||||
|
{
|
||||||
|
title: 'Is AstroWind compatible with the latest versions of Astro and Tailwind CSS?',
|
||||||
|
description:
|
||||||
|
'Yes, AstroWind is designed to be compatible with the latest versions of both Astro and Tailwind CSS. This ensures that you can harness the full capabilities of these technologies while benefiting from the features offered by AstroWind.',
|
||||||
|
icon: 'tabler:chevrons-right',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: 'Can I use AstroWind for both personal and commercial projects?',
|
||||||
|
description: `Certainly! AstroWind is versatile and can be used for a wide range of projects, including both personal and commercial endeavors. Whether you're building a professional portfolio, launching a startup, or creating a marketing website, AstroWind has you covered.`,
|
||||||
|
icon: 'tabler:chevrons-right',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: 'What level of coding knowledge is required to use AstroWind?',
|
||||||
|
description:
|
||||||
|
'While some familiarity with HTML, CSS, and web development concepts is helpful, the user-friendly interface and customization options allow those with limited coding experience to create impressive websites. For more advanced users, AstroWind offers extensive customization capabilities.',
|
||||||
|
icon: 'tabler:chevrons-right',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: 'Is customer support available for AstroWind users seeking guidance?',
|
||||||
|
description: `Absolutely, our dedicated customer support team is here to assist you with any questions or challenges you may encounter. Feel free to reach out to us through our support channels, and we'll be happy to provide the help you need.`,
|
||||||
|
icon: 'tabler:chevrons-right',
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
>
|
||||||
|
<Fragment slot="bg">
|
||||||
|
<div class="absolute inset-0 bg-blue-50 dark:bg-transparent"></div>
|
||||||
|
</Fragment>
|
||||||
|
</FAQs>
|
||||||
|
|
||||||
<!-- Steps2 Widget ****************** -->
|
<!-- Steps2 Widget ****************** -->
|
||||||
|
|
||||||
<Steps2
|
<Steps2
|
||||||
|
@ -20,21 +20,22 @@ const metadata = {
|
|||||||
|
|
||||||
<Hero
|
<Hero
|
||||||
tagline="Startup Web Demo"
|
tagline="Startup Web Demo"
|
||||||
callToAction={{ text: 'Get template', href: 'https://github.com/onwidget/astrowind', icon: 'tabler:download' }}
|
callToAction={{ text: 'Get templates', href: 'https://github.com/onwidget/astrowind', icon: 'tabler:download' }}
|
||||||
callToAction2={{ text: 'Learn more', href: '#features' }}
|
callToAction2={{ text: 'Learn more', href: '#features' }}
|
||||||
>
|
>
|
||||||
<Fragment slot="title">
|
<Fragment slot="title">
|
||||||
Free template for <span class="hidden lg:inline">create your website <br />with</span>
|
<!-- Astrowind: <span class="hidden sm:inline">empowering</span> your website with <span
|
||||||
<span class="text-accent dark:text-white highlight"> Astro 2.0</span> + Tailwind CSS
|
class="text-accent dark:text-white highlight">Astro 2.0</span
|
||||||
|
> + Tailwind CSS <span class="hidden sm:inline">templates</span> -->
|
||||||
|
|
||||||
|
Improve <span class="hidden sm:inline">the online presence of</span> your <span
|
||||||
|
class="text-accent dark:text-white highlight">Startup</span
|
||||||
|
> with Astrowind templates
|
||||||
</Fragment>
|
</Fragment>
|
||||||
|
|
||||||
<Fragment slot="subtitle">
|
<Fragment slot="subtitle">
|
||||||
<span class="hidden sm:inline">
|
Step into the spotlight with <span class="font-semibold">Astrowind</span> templates, your pathway to fortifying
|
||||||
<span class="font-semibold">AstroWind</span> is a free, customizable and production-ready template for Astro 2.0
|
your startup's digital footprint, fostering credibility, and expanding your reach.
|
||||||
+ Tailwind CSS.</span
|
|
||||||
>
|
|
||||||
<span class="block mb-1 sm:hidden font-bold text-blue-600">AstroWind: Production-ready.</span> Suitable for
|
|
||||||
Startups, Small Business, Sass Websites, Professional Portfolios, Marketing Websites, Landing Pages & Blogs.
|
|
||||||
</Fragment>
|
</Fragment>
|
||||||
|
|
||||||
<Fragment slot="image">
|
<Fragment slot="image">
|
||||||
|
@ -110,46 +110,46 @@ const metadata = {
|
|||||||
]}
|
]}
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<!-- Features3 Widget ************** -->
|
<!-- Features3 Widget ************** -->
|
||||||
|
|
||||||
<Features3
|
<Features3
|
||||||
title="Price-related features"
|
title="Price-related features"
|
||||||
subtitle="Discover the advantages of choosing our plans"
|
subtitle="Discover the advantages of choosing our plans"
|
||||||
columns={2}
|
columns={2}
|
||||||
items={[
|
items={[
|
||||||
{
|
{
|
||||||
title: 'Tiered Pricing Plans',
|
title: 'Tiered Pricing Plans',
|
||||||
description: 'Choose from a range of pricing plans designed to accommodate different budgets and requirements.',
|
description: 'Choose from a range of pricing plans designed to accommodate different budgets and requirements.',
|
||||||
icon: 'tabler:stairs',
|
icon: 'tabler:stairs',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: 'Transparent Pricing',
|
title: 'Transparent Pricing',
|
||||||
description: 'Clearly displayed pricing details for each plan, with no hidden costs or unexpected charges.',
|
description: 'Clearly displayed pricing details for each plan, with no hidden costs or unexpected charges.',
|
||||||
icon: 'tabler:flip-vertical',
|
icon: 'tabler:flip-vertical',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: 'Secure Payment Methods',
|
title: 'Secure Payment Methods',
|
||||||
description: 'Secure payment gateways to protect your financial information during transactions.',
|
description: 'Secure payment gateways to protect your financial information during transactions.',
|
||||||
icon: 'tabler:shield-lock',
|
icon: 'tabler:shield-lock',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: 'Instant Access',
|
title: 'Instant Access',
|
||||||
description: `Immediate access to your chosen plan's features and templates upon subscription.`,
|
description: `Immediate access to your chosen plan's features and templates upon subscription.`,
|
||||||
icon: 'tabler:accessible',
|
icon: 'tabler:accessible',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: 'Upgrade Value',
|
title: 'Upgrade Value',
|
||||||
description: 'Upgrade to higher-tier plans to unlock more features and benefits for an enhanced experience.',
|
description: 'Upgrade to higher-tier plans to unlock more features and benefits for an enhanced experience.',
|
||||||
icon: 'tabler:chevrons-up',
|
icon: 'tabler:chevrons-up',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '24H support',
|
title: '24H support',
|
||||||
description: 'Questions answered via live chat, email or phone, every calendar day.',
|
description: 'Questions answered via live chat, email or phone, every calendar day.',
|
||||||
icon: 'tabler:headset',
|
icon: 'tabler:headset',
|
||||||
},
|
},
|
||||||
]}
|
]}
|
||||||
classes={{ container: "max-w-5xl"}}
|
classes={{ container: 'max-w-5xl' }}
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<!-- Steps Widget ****************** -->
|
<!-- Steps Widget ****************** -->
|
||||||
|
|
||||||
|
Reference in New Issue
Block a user