Format all files with prettier: npm run format

This commit is contained in:
prototypa
2024-04-29 17:51:55 -04:00
parent 2b8672612e
commit a606b34a19
47 changed files with 298 additions and 340 deletions

View File

@@ -1,12 +1,6 @@
{
"css.customData": ["./vscode.tailwind.json"],
"eslint.validate": [
"javascript",
"javascriptreact",
"astro",
"typescript",
"typescriptreact"
],
"eslint.validate": ["javascript", "javascriptreact", "astro", "typescript", "typescriptreact"],
"files.associations": {
"*.mdx": "markdown"
},

View File

@@ -12,17 +12,17 @@ import compress from '@playform/compress';
import astrowind from './vendor/integration';
import { readingTimeRemarkPlugin, responsiveTablesRehypePlugin, lazyImagesRehypePlugin } from './src/utils/frontmatter.mjs';
import {
readingTimeRemarkPlugin,
responsiveTablesRehypePlugin,
lazyImagesRehypePlugin,
} from './src/utils/frontmatter.mjs';
const __dirname = path.dirname(fileURLToPath(import.meta.url));
const hasExternalScripts = false;
const whenExternalScripts = (items = []) =>
hasExternalScripts
? Array.isArray(items)
? items.map((item) => item())
: [items()]
: [];
hasExternalScripts ? (Array.isArray(items) ? items.map((item) => item()) : [items()]) : [];
export default defineConfig({
output: 'static',
@@ -70,13 +70,13 @@ export default defineConfig({
}),
astrowind({
config: "./src/config.yaml"
config: './src/config.yaml',
}),
],
image: {
service: squooshImageService(),
domains: ["cdn.pixabay.com"],
domains: ['cdn.pixabay.com'],
},
markdown: {

22
package-lock.json generated
View File

@@ -1,6 +1,6 @@
{
"name": "@onwidget/astrowind",
"version": "1.0.0-beta.32",
"version": "1.0.0-beta.33",
"lockfileVersion": 3,
"requires": true,
"packages": {
@@ -29,6 +29,7 @@
"@iconify-json/tabler": "^1.1.110",
"@playform/compress": "0.0.3",
"@tailwindcss/typography": "^0.5.13",
"@types/eslint__js": "^8.42.3",
"@types/js-yaml": "^4.0.9",
"@types/lodash.merge": "^4.6.9",
"@typescript-eslint/eslint-plugin": "^7.7.1",
@@ -2571,6 +2572,25 @@
"@types/ms": "*"
}
},
"node_modules/@types/eslint": {
"version": "8.56.10",
"resolved": "https://registry.npmjs.org/@types/eslint/-/eslint-8.56.10.tgz",
"integrity": "sha512-Shavhk87gCtY2fhXDctcfS3e6FdxWkCx1iUZ9eEUbh7rTqlZT0/IzOkCOVt0fCjcFuZ9FPYfuezTBImfHCDBGQ==",
"dev": true,
"dependencies": {
"@types/estree": "*",
"@types/json-schema": "*"
}
},
"node_modules/@types/eslint__js": {
"version": "8.42.3",
"resolved": "https://registry.npmjs.org/@types/eslint__js/-/eslint__js-8.42.3.tgz",
"integrity": "sha512-alfG737uhmPdnvkrLdZLcEKJ/B8s9Y4hrZ+YAdzUeoArBlSUERA2E87ROfOaS4jd/C45fzOoZzidLc1IPwLqOw==",
"dev": true,
"dependencies": {
"@types/eslint": "*"
}
},
"node_modules/@types/estree": {
"version": "1.0.5",
"license": "MIT"

View File

@@ -1,6 +1,6 @@
{
"name": "@onwidget/astrowind",
"version": "1.0.0-beta.32",
"version": "1.0.0-beta.33",
"description": "AstroWind: A free template using Astro 4.0 and Tailwind CSS. Astro starter theme.",
"type": "module",
"private": true,
@@ -38,6 +38,7 @@
"@iconify-json/tabler": "^1.1.110",
"@playform/compress": "0.0.3",
"@tailwindcss/typography": "^0.5.13",
"@types/eslint__js": "^8.42.3",
"@types/js-yaml": "^4.0.9",
"@types/lodash.merge": "^4.6.9",
"@typescript-eslint/eslint-plugin": "^7.7.1",

View File

@@ -17,7 +17,6 @@ import '@fontsource-variable/inter';
// Oswald
// 'Space Grotesk'
// Urbanist
---
<style is:inline>

View File

@@ -2,6 +2,8 @@
import { SITE } from 'astrowind:config';
---
<span class="self-center ml-2 rtl:ml-0 rtl:mr-2 text-2xl md:text-xl font-bold text-gray-900 whitespace-nowrap dark:text-white">
<span
class="self-center ml-2 rtl:ml-0 rtl:mr-2 text-2xl md:text-xl font-bold text-gray-900 whitespace-nowrap dark:text-white"
>
🚀 {SITE?.name}
</span>

View File

@@ -7,13 +7,12 @@ import Image from '~/components/common/Image.astro';
import { findImage } from '~/utils/images';
import { getPermalink } from '~/utils/permalinks';
export interface Props {
post: Post;
}
const { post } = Astro.props;
const image = (await findImage(post.image));
const image = await findImage(post.image);
---
<article class="mb-6 transition">

View File

@@ -53,8 +53,7 @@ const link = APP_BLOG?.post?.isEnabled ? getPermalink(post.permalink, 'post') :
post.author && (
<>
{' '}
·{' '}
<Icon name="tabler:user" class="w-3.5 h-3.5 inline-block -mt-0.5 dark:text-gray-400" />
· <Icon name="tabler:user" class="w-3.5 h-3.5 inline-block -mt-0.5 dark:text-gray-400" />
<span>{post.author.replaceAll('-', ' ')}</span>
</>
)
@@ -70,7 +69,6 @@ const link = APP_BLOG?.post?.isEnabled ? getPermalink(post.permalink, 'post') :
</>
)
}
</span>
</div>
<h2 class="text-xl sm:text-2xl font-bold leading-tight mb-2 font-heading dark:text-slate-300">

View File

@@ -18,7 +18,11 @@ const { tags, class: className = 'text-sm', title = undefined, isCategory = fals
tags && Array.isArray(tags) && (
<>
<>
{title !== undefined && <span class="align-super font-normal underline underline-offset-4 decoration-2 dark:text-slate-400">{title}</span>}
{title !== undefined && (
<span class="align-super font-normal underline underline-offset-4 decoration-2 dark:text-slate-400">
{title}
</span>
)}
</>
<ul class={className}>
{tags.map((tag) => (
@@ -27,7 +31,7 @@ const { tags, class: className = 'text-sm', title = undefined, isCategory = fals
tag.title
) : (
<a
href={getPermalink(tag.slug, (isCategory ? 'category' : 'tag'))}
href={getPermalink(tag.slug, isCategory ? 'category' : 'tag')}
class="text-muted dark:text-slate-300 hover:text-primary dark:hover:text-gray-200"
>
{tag.title}

View File

@@ -5,6 +5,9 @@ import { ANALYTICS } from 'astrowind:config';
{
ANALYTICS?.vendors?.googleAnalytics?.id ? (
<GoogleAnalytics id={String(ANALYTICS.vendors.googleAnalytics.id)} partytown={ANALYTICS?.vendors?.googleAnalytics?.partytown} />
<GoogleAnalytics
id={String(ANALYTICS.vendors.googleAnalytics.id)}
partytown={ANALYTICS?.vendors?.googleAnalytics?.partytown}
/>
) : null
}

View File

@@ -1,33 +1,33 @@
---
import { UI } from "astrowind:config";
import { UI } from 'astrowind:config';
// TODO: This code is temporary
---
<script is:inline define:vars={{ defaultTheme: UI.theme || "system" }}>
<script is:inline define:vars={{ defaultTheme: UI.theme || 'system' }}>
function applyTheme(theme) {
if (theme === "dark") {
document.documentElement.classList.add("dark");
if (theme === 'dark') {
document.documentElement.classList.add('dark');
} else {
document.documentElement.classList.remove("dark");
document.documentElement.classList.remove('dark');
}
const matches = document.querySelectorAll("[data-aw-toggle-color-scheme] > input");
const matches = document.querySelectorAll('[data-aw-toggle-color-scheme] > input');
if (matches && matches.length) {
matches.forEach((elem) => {
elem.checked = theme !== "dark";
elem.checked = theme !== 'dark';
});
}
}
if ((defaultTheme && defaultTheme.endsWith(":only")) || (!localStorage.theme && defaultTheme !== "system")) {
applyTheme(defaultTheme.replace(":only", ""));
if ((defaultTheme && defaultTheme.endsWith(':only')) || (!localStorage.theme && defaultTheme !== 'system')) {
applyTheme(defaultTheme.replace(':only', ''));
} else if (
localStorage.theme === "dark" ||
(!("theme" in localStorage) && window.matchMedia("(prefers-color-scheme: dark)").matches)
localStorage.theme === 'dark' ||
(!('theme' in localStorage) && window.matchMedia('(prefers-color-scheme: dark)').matches)
) {
applyTheme("dark");
applyTheme('dark');
} else {
applyTheme("light");
applyTheme('light');
}
</script>

View File

@@ -1,5 +1,5 @@
---
import { SITE } from "astrowind:config";
import { SITE } from 'astrowind:config';
---
{SITE.googleSiteVerificationId && <meta name="google-site-verification" content={SITE.googleSiteVerificationId} />}

View File

@@ -12,7 +12,12 @@ const { text, url, class: className = 'inline-block' } = Astro.props;
<div class={className}>
<span class="align-super font-bold text-slate-500 dark:text-slate-400">Share:</span>
<button class="ml-2 rtl:ml-0 rtl:mr-2" title="Twitter Share" data-aw-social-share="twitter" data-aw-url={url} data-aw-text={text}
<button
class="ml-2 rtl:ml-0 rtl:mr-2"
title="Twitter Share"
data-aw-social-share="twitter"
data-aw-url={url}
data-aw-text={text}
><Icon
name="tabler:brand-x"
class="w-6 h-6 text-gray-400 dark:text-slate-500 hover:text-black dark:hover:text-slate-300"
@@ -24,19 +29,34 @@ const { text, url, class: className = 'inline-block' } = Astro.props;
class="w-6 h-6 text-gray-400 dark:text-slate-500 hover:text-black dark:hover:text-slate-300"
/>
</button>
<button class="ml-2 rtl:ml-0 rtl:mr-2" title="Linkedin Share" data-aw-social-share="linkedin" data-aw-url={url} data-aw-text={text}
<button
class="ml-2 rtl:ml-0 rtl:mr-2"
title="Linkedin Share"
data-aw-social-share="linkedin"
data-aw-url={url}
data-aw-text={text}
><Icon
name="tabler:brand-linkedin"
class="w-6 h-6 text-gray-400 dark:text-slate-500 hover:text-black dark:hover:text-slate-300"
/>
</button>
<button class="ml-2 rtl:ml-0 rtl:mr-2" title="Whatsapp Share" data-aw-social-share="whatsapp" data-aw-url={url} data-aw-text={text}
<button
class="ml-2 rtl:ml-0 rtl:mr-2"
title="Whatsapp Share"
data-aw-social-share="whatsapp"
data-aw-url={url}
data-aw-text={text}
><Icon
name="tabler:brand-whatsapp"
class="w-6 h-6 text-gray-400 dark:text-slate-500 hover:text-black dark:hover:text-slate-300"
/>
</button>
<button class="ml-2 rtl:ml-0 rtl:mr-2" title="Email Share" data-aw-social-share="mail" data-aw-url={url} data-aw-text={text}
<button
class="ml-2 rtl:ml-0 rtl:mr-2"
title="Email Share"
data-aw-social-share="mail"
data-aw-url={url}
data-aw-text={text}
><Icon
name="tabler:mail"
class="w-6 h-6 text-gray-400 dark:text-slate-500 hover:text-black dark:hover:text-slate-300"

View File

@@ -6,16 +6,11 @@ export interface Props {
const {
label = 'Toggle Menu',
class:
className = "flex flex-col h-12 w-12 rounded justify-center items-center cursor-pointer group",
class: className = 'flex flex-col h-12 w-12 rounded justify-center items-center cursor-pointer group',
} = Astro.props;
---
<button
class={className}
aria-label={label}
data-aw-toggle-menu
>
<button class={className} aria-label={label} data-aw-toggle-menu>
<span class="sr-only">{label}</span>
<slot>
<span

View File

@@ -1,6 +1,6 @@
---
export interface Props {
isDark?: boolean
isDark?: boolean;
}
const { isDark = false } = Astro.props;

View File

@@ -10,14 +10,13 @@
// closing tags - it's simply contained in an enclosing div with a
// margin left. No need for 'dd' items.
//
const {
dt
} = Astro.props;
const { dt } = Astro.props;
interface Props {
dt:string
dt: string;
}
const content: string = await Astro.slots.render('default');
---
<h6 set:html={dt}></h6>
<h6 set:html={dt} />
<div class="dd ml-8" set:html={content} />

View File

@@ -1,48 +1,35 @@
---
import type { Headline as Props } from "~/types";
import { twMerge } from "tailwind-merge";
import type { Headline as Props } from '~/types';
import { twMerge } from 'tailwind-merge';
const {
title = await Astro.slots.render("title"),
subtitle = await Astro.slots.render("subtitle"),
title = await Astro.slots.render('title'),
subtitle = await Astro.slots.render('subtitle'),
tagline,
classes = {},
} = Astro.props;
const {
container: containerClass = "max-w-3xl",
title: titleClass = "text-3xl md:text-4xl ",
subtitle: subtitleClass = "text-xl",
container: containerClass = 'max-w-3xl',
title: titleClass = 'text-3xl md:text-4xl ',
subtitle: subtitleClass = 'text-xl',
} = classes;
---
{
(title || subtitle || tagline) && (
<div
class={twMerge("mb-8 md:mx-auto md:mb-12 text-center", containerClass)}
>
<div class={twMerge('mb-8 md:mx-auto md:mb-12 text-center', containerClass)}>
{tagline && (
<p
class="text-base text-secondary dark:text-blue-200 font-bold tracking-wide uppercase"
set:html={tagline}
/>
<p class="text-base text-secondary dark:text-blue-200 font-bold tracking-wide uppercase" set:html={tagline} />
)}
{title && (
<h2
class={twMerge(
"font-bold leading-tighter tracking-tighter font-heading text-heading text-3xl",
titleClass
)}
class={twMerge('font-bold leading-tighter tracking-tighter font-heading text-heading text-3xl', titleClass)}
set:html={title}
/>
)}
{subtitle && (
<p
class={twMerge("mt-4 text-muted", subtitleClass)}
set:html={subtitle}
/>
)}
{subtitle && <p class={twMerge('mt-4 text-muted', subtitleClass)} set:html={subtitle} />}
</div>
)
}

View File

@@ -52,13 +52,7 @@ const {
/>
)}
{callToAction && (
<div
class={twMerge(
`${title || description ? 'mt-3' : ''}`,
actionClass,
itemClasses?.actionClass
)}
>
<div class={twMerge(`${title || description ? 'mt-3' : ''}`, actionClass, itemClasses?.actionClass)}>
<Button variant="link" {...callToAction} />
</div>
)}

View File

@@ -1,23 +1,18 @@
---
import type { ItemGrid as Props } from "~/types";
import { Icon } from "astro-icon/components";
import { twMerge } from "tailwind-merge";
import Button from "./Button.astro";
import type { ItemGrid as Props } from '~/types';
import { Icon } from 'astro-icon/components';
import { twMerge } from 'tailwind-merge';
import Button from './Button.astro';
const { items = [], columns, defaultIcon = '', classes = {} } = Astro.props;
const {
items = [],
columns,
defaultIcon = "",
classes = {},
} = Astro.props;
const {
container: containerClass = "",
container: containerClass = '',
// container: containerClass = "sm:grid-cols-1 md:grid-cols-2 lg:grid-cols-3",
panel: panelClass = "",
title: titleClass = "",
description: descriptionClass = "",
icon: defaultIconClass = "text-primary",
panel: panelClass = '',
title: titleClass = '',
description: descriptionClass = '',
icon: defaultIconClass = 'text-primary',
} = classes;
---
@@ -27,59 +22,24 @@ const {
class={twMerge(
`grid gap-8 gap-x-12 sm:gap-y-8 ${
columns === 4
? "lg:grid-cols-4 md:grid-cols-3 sm:grid-cols-2"
? 'lg:grid-cols-4 md:grid-cols-3 sm:grid-cols-2'
: columns === 3
? "lg:grid-cols-3 sm:grid-cols-2"
? 'lg:grid-cols-3 sm:grid-cols-2'
: columns === 2
? "sm:grid-cols-2 "
: ""
? 'sm:grid-cols-2 '
: ''
}`,
containerClass
)}
>
{items.map(
({
title,
description,
icon,
callToAction,
classes: itemClasses = {},
}) => (
<div
class={twMerge(
"relative flex flex-col",
panelClass,
itemClasses?.panel
)}
>
{items.map(({ title, description, icon, callToAction, classes: itemClasses = {} }) => (
<div class={twMerge('relative flex flex-col', panelClass, itemClasses?.panel)}>
{(icon || defaultIcon) && (
<Icon
name={icon || defaultIcon}
class={twMerge(
"mb-2 w-10 h-10",
defaultIconClass,
itemClasses?.icon
<Icon name={icon || defaultIcon} class={twMerge('mb-2 w-10 h-10', defaultIconClass, itemClasses?.icon)} />
)}
/>
)}
<div
class={twMerge(
"text-xl font-bold",
titleClass,
itemClasses?.title
)}
>
{title}
</div>
<div class={twMerge('text-xl font-bold', titleClass, itemClasses?.title)}>{title}</div>
{description && (
<p
class={twMerge(
"text-muted mt-2",
descriptionClass,
itemClasses?.description
)}
set:html={description}
/>
<p class={twMerge('text-muted mt-2', descriptionClass, itemClasses?.description)} set:html={description} />
)}
{callToAction && (
<div class="mt-2">
@@ -87,8 +47,7 @@ const {
</div>
)}
</div>
)
)}
))}
</div>
)
}

View File

@@ -1,7 +1,7 @@
---
import { Icon } from "astro-icon/components";
import { twMerge } from "tailwind-merge";
import type { Item } from "~/types";
import { Icon } from 'astro-icon/components';
import { twMerge } from 'tailwind-merge';
import type { Item } from '~/types';
export interface Props {
items?: Array<Item>;
@@ -12,71 +12,43 @@ export interface Props {
const { items = [], classes = {}, defaultIcon } = Astro.props as Props;
const {
container: containerClass = "",
panel: panelClass = "",
title: titleClass = "",
description: descriptionClass = "",
icon: defaultIconClass = "text-primary dark:text-slate-200 border-primary dark:border-blue-700",
container: containerClass = '',
panel: panelClass = '',
title: titleClass = '',
description: descriptionClass = '',
icon: defaultIconClass = 'text-primary dark:text-slate-200 border-primary dark:border-blue-700',
} = classes;
---
{
items && items.length && (
<div class={containerClass}>
{items.map(
(
{ title, description, icon, classes: itemClasses = {} },
index = 0
) => (
<div class={twMerge("flex", panelClass, itemClasses?.panel)}>
{items.map(({ title, description, icon, classes: itemClasses = {} }, index = 0) => (
<div class={twMerge('flex', panelClass, itemClasses?.panel)}>
<div class="flex flex-col items-center mr-4 rtl:mr-0 rtl:ml-4">
<div>
<div class="flex items-center justify-center">
{(icon || defaultIcon) && (
<Icon
name={icon || defaultIcon}
class={twMerge(
"w-10 h-10 p-2 rounded-full border-2",
defaultIconClass,
itemClasses?.icon
)}
class={twMerge('w-10 h-10 p-2 rounded-full border-2', defaultIconClass, itemClasses?.icon)}
/>
)}
</div>
</div>
{index !== items.length - 1 && (
<div class="w-px h-full bg-black/10 dark:bg-slate-400/50" />
)}
{index !== items.length - 1 && <div class="w-px h-full bg-black/10 dark:bg-slate-400/50" />}
</div>
<div
class={`pt-1 ${
index !== items.length - 1 ? "pb-8" : ""
}`}
>
{title && (
<p
class={twMerge(
"text-xl font-bold",
titleClass,
itemClasses?.title
)}
set:html={title}
/>
)}
<div class={`pt-1 ${index !== items.length - 1 ? 'pb-8' : ''}`}>
{title && <p class={twMerge('text-xl font-bold', titleClass, itemClasses?.title)} set:html={title} />}
{description && (
<p
class={twMerge(
"text-muted mt-2",
descriptionClass,
itemClasses?.description
)}
class={twMerge('text-muted mt-2', descriptionClass, itemClasses?.description)}
set:html={description}
/>
)}
</div>
</div>
)
)}
))}
</div>
)
}

View File

@@ -1,15 +1,15 @@
---
import type { HTMLTag } from "astro/types";
import type { Widget } from "~/types";
import { twMerge } from "tailwind-merge";
import Background from "./Background.astro";
import type { HTMLTag } from 'astro/types';
import type { Widget } from '~/types';
import { twMerge } from 'tailwind-merge';
import Background from './Background.astro';
export interface Props extends Widget {
containerClass?: string;
["as"]?: HTMLTag;
['as']?: HTMLTag;
}
const { id, isDark = false, containerClass = "", bg, as = "section" } = Astro.props;
const { id, isDark = false, containerClass = '', bg, as = 'section' } = Astro.props;
const WrapperTag = as;
---
@@ -22,7 +22,7 @@ const WrapperTag = as;
</div>
<div
class:list={[
twMerge("relative mx-auto max-w-7xl px-4 md:px-6 py-12 md:py-16 lg:py-20 text-default", containerClass),
twMerge('relative mx-auto max-w-7xl px-4 md:px-6 py-12 md:py-16 lg:py-20 text-default', containerClass),
{ dark: isDark },
]}
>

View File

@@ -1,12 +1,12 @@
---
import { APP_BLOG } from "astrowind:config";
import { APP_BLOG } from 'astrowind:config';
import Grid from "~/components/blog/Grid.astro";
import Grid from '~/components/blog/Grid.astro';
import { getBlogPermalink } from "~/utils/permalinks";
import { findPostsByIds } from "~/utils/blog";
import WidgetWrapper from "~/components/ui/WidgetWrapper.astro";
import type { Widget } from "~/types";
import { getBlogPermalink } from '~/utils/permalinks';
import { findPostsByIds } from '~/utils/blog';
import WidgetWrapper from '~/components/ui/WidgetWrapper.astro';
import type { Widget } from '~/types';
export interface Props extends Widget {
title?: string;
@@ -17,16 +17,16 @@ export interface Props extends Widget {
}
const {
title = await Astro.slots.render("title"),
linkText = "View all posts",
title = await Astro.slots.render('title'),
linkText = 'View all posts',
linkUrl = getBlogPermalink(),
information = await Astro.slots.render("information"),
information = await Astro.slots.render('information'),
postIds = [],
id,
isDark = false,
classes = {},
bg = await Astro.slots.render("bg"),
bg = await Astro.slots.render('bg'),
} = Astro.props;
const posts = APP_BLOG.isEnabled ? await findPostsByIds(postIds) : [];

View File

@@ -1,13 +1,13 @@
---
import { APP_BLOG } from "astrowind:config";
import { APP_BLOG } from 'astrowind:config';
import Grid from "~/components/blog/Grid.astro";
import Grid from '~/components/blog/Grid.astro';
import { getBlogPermalink } from "~/utils/permalinks";
import { findLatestPosts } from "~/utils/blog";
import WidgetWrapper from "~/components/ui/WidgetWrapper.astro";
import type { Widget } from "~/types";
import Button from "../ui/Button.astro";
import { getBlogPermalink } from '~/utils/permalinks';
import { findLatestPosts } from '~/utils/blog';
import WidgetWrapper from '~/components/ui/WidgetWrapper.astro';
import type { Widget } from '~/types';
import Button from '../ui/Button.astro';
export interface Props extends Widget {
title?: string;
@@ -18,16 +18,16 @@ export interface Props extends Widget {
}
const {
title = await Astro.slots.render("title"),
linkText = "View all posts",
title = await Astro.slots.render('title'),
linkText = 'View all posts',
linkUrl = getBlogPermalink(),
information = await Astro.slots.render("information"),
information = await Astro.slots.render('information'),
count = 4,
id,
isDark = false,
classes = {},
bg = await Astro.slots.render("bg"),
bg = await Astro.slots.render('bg'),
} = Astro.props;
const posts = APP_BLOG.isEnabled ? await findLatestPosts({ count }) : [];
@@ -44,7 +44,10 @@ const posts = APP_BLOG.isEnabled ? await findLatestPosts({ count }) : [];
set:html={title}
/>
{APP_BLOG.list.isEnabled && linkText && linkUrl && (
<Button variant="link" href={linkUrl}> {linkText} »</Button>
<Button variant="link" href={linkUrl}>
{' '}
{linkText} »
</Button>
)}
</div>
)}

View File

@@ -27,12 +27,14 @@ const {
<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-5xl mx-auto">
{tagline && (
{
tagline && (
<p
class="text-base text-secondary dark:text-blue-200 font-bold tracking-wide uppercase"
set:html={tagline}
/>
)}
)
}
{
title && (
<h1

View File

@@ -68,7 +68,8 @@ const {
{typeof callToAction === 'string' ? (
<Fragment set:html={callToAction} />
) : (
callToAction && callToAction.href && <Button {...hasRibbon ? { variant:'primary' } : {}} {...callToAction}/>
callToAction &&
callToAction.href && <Button {...(hasRibbon ? { variant: 'primary' } : {})} {...callToAction} />
)}
</div>
)}

View File

@@ -42,9 +42,7 @@ const {
) : (
callToAction &&
callToAction.text &&
callToAction.href && (
<Button variant="primary" {...callToAction} class="mb-12 w-auto"/>
)
callToAction.href && <Button variant="primary" {...callToAction} class="mb-12 w-auto" />
)
}
</div>

View File

@@ -23,7 +23,7 @@ const { metadata } = Astro.props;
actions={[
{
text: 'Download',
href: 'https://github.com/onwidget/astrowind'
href: 'https://github.com/onwidget/astrowind',
},
]}
showToggleTheme

View File

@@ -5,8 +5,8 @@ import type { MetaData } from '~/types';
export interface Props {
frontmatter: {
title?: string
}
title?: string;
};
}
const { frontmatter } = Astro.props;

View File

@@ -36,7 +36,9 @@ const metadata = merge(
},
openGraph: {
type: 'article',
...(image ? { images: [{ url: image, width: (image as ImageMetadata)?.width, height: (image as ImageMetadata)?.height }] } : {}),
...(image
? { images: [{ url: image, width: (image as ImageMetadata)?.width, height: (image as ImageMetadata)?.height }] }
: {}),
},
},
{ ...(post?.metadata ? { ...post.metadata, canonical: post.metadata?.canonical || url } : {}) }

View File

@@ -45,12 +45,12 @@ const metadata = {
id="hero"
title="Sarah Johnson"
tagline="Personal Web Demo"
actions={[{ variant: "primary", text: 'Hire me', href: getPermalink("/contact#form") }]}
actions={[{ variant: 'primary', text: 'Hire me', href: getPermalink('/contact#form') }]}
>
<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
captivating realities.
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 captivating
realities.
</Fragment>
</Hero>
@@ -382,11 +382,13 @@ const metadata = {
<CallToAction
title="Let's create together"
subtitle="Ready to transform your vision into captivating designs?"
actions={[{
variant:"primary",
actions={[
{
variant: 'primary',
text: 'Hire me',
href: '/',
}]}
},
]}
/>
<!-- BlogLatestPost Widget **************** -->

View File

@@ -60,8 +60,7 @@ const metadata = {
<span class="hidden sm:inline">
Elevate your website creation process with <span class="font-semibold">AstroWind</span>'s SaaS solutions.</span
>
Seamlessly blend the power of Astro 4.0 and Tailwind CSS to craft websites that resonate with your brand and
audience.
Seamlessly blend the power of Astro 4.0 and Tailwind CSS to craft websites that resonate with your brand and audience.
</Fragment>
</Hero2>

View File

@@ -47,7 +47,12 @@ const metadata = {
<Fragment slot="image">
<YouTube id="gxBkghlglTg" title="Astro just Launched.... Could it be the ultimate web framework?" />
<style is:inline>lite-youtube { margin: 0 auto; max-width: 100%; }</style>
<style is:inline>
lite-youtube {
margin: 0 auto;
max-width: 100%;
}
</style>
</Fragment>
</Hero>

View File

@@ -45,8 +45,8 @@ const metadata = {
+ Tailwind CSS.</span
>
<span class="block mb-1 sm:hidden font-bold text-blue-600">AstroWind: Production-ready.</span>
Suitable for Startups, Small Business, SaaS websites, Professional Portfolios, Marketing websites, Landing Pages
& Blogs.
Suitable for Startups, Small Business, SaaS websites, Professional Portfolios, Marketing websites, Landing Pages &
Blogs.
</Fragment>
</Hero>

View File

@@ -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."
actions={[{ variant:"primary", target: '_blank', text: 'Start exploring', href: '/' }]}
actions={[{ variant: 'primary', target: '_blank', 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',
@@ -211,11 +211,13 @@ const metadata = {
<!-- CallToAction Widget *********** -->
<CallToAction
actions={[{
variant: "primary",
actions={[
{
variant: 'primary',
text: 'Start exploring',
href: '/',
}]}
},
]}
title="Dive into our template collection"
subtitle="Whether you're in business, design, or education, our templates are here to elevate your projects."
/>

24
src/types.d.ts vendored
View File

@@ -24,7 +24,7 @@ export interface Post {
image?: ImageMetadata | string;
/** */
category?: Taxonomy
category?: Taxonomy;
/** */
tags?: Taxonomy[];
/** */
@@ -213,7 +213,7 @@ export interface Form {
}
// WIDGETS
export interface Hero extends Omit<Headline,"classes">, Widget {
export interface Hero extends Omit<Headline, 'classes'>, Widget {
content?: string;
image?: string | unknown;
callToAction1?: CallToAction;
@@ -221,29 +221,29 @@ export interface Hero extends Omit<Headline,"classes">, Widget {
isReversed?: boolean;
}
export interface Team extends Omit<Headline,"classes">, Widget {
export interface Team extends Omit<Headline, 'classes'>, Widget {
team?: Array<TeamMember>;
}
export interface Stats extends Omit<Headline,"classes">, Widget {
export interface Stats extends Omit<Headline, 'classes'>, Widget {
stats?: Array<Stat>;
}
export interface Pricing extends Omit<Headline,"classes">, Widget {
export interface Pricing extends Omit<Headline, 'classes'>, Widget {
prices?: Array<Price>;
}
export interface Testimonials extends Omit<Headline,"classes">, Widget {
export interface Testimonials extends Omit<Headline, 'classes'>, Widget {
testimonials?: Array<Testimonial>;
callToAction?: CallToAction;
}
export interface Brands extends Omit<Headline,"classes">, Widget {
export interface Brands extends Omit<Headline, 'classes'>, Widget {
icons?: Array<string>;
images?: Array<Image>;
}
export interface Features extends Omit<Headline,"classes">, Widget {
export interface Features extends Omit<Headline, 'classes'>, Widget {
image?: string | unknown;
video?: Video;
items?: Array<Item>;
@@ -256,14 +256,14 @@ export interface Features extends Omit<Headline,"classes">, Widget {
isAfterContent?: boolean;
}
export interface Faqs extends Omit<Headline,"classes">, Widget {
export interface Faqs extends Omit<Headline, 'classes'>, Widget {
iconUp?: string;
iconDown?: string;
items?: Array<Item>;
columns?: number;
}
export interface Steps extends Omit<Headline,"classes">, Widget {
export interface Steps extends Omit<Headline, 'classes'>, Widget {
items: Array<{
title: string;
description?: string;
@@ -275,7 +275,7 @@ export interface Steps extends Omit<Headline,"classes">, Widget {
isReversed?: boolean;
}
export interface Content extends Omit<Headline,"classes">, Widget {
export interface Content extends Omit<Headline, 'classes'>, Widget {
content?: string;
image?: string | unknown;
items?: Array<Item>;
@@ -285,4 +285,4 @@ export interface Content extends Omit<Headline,"classes">, Widget {
callToAction?: CallToAction;
}
export interface Contact extends Omit<Headline,"classes">, Form, Widget {}
export interface Contact extends Omit<Headline, 'classes'>, Form, Widget {}

View File

@@ -1,6 +1,6 @@
import getReadingTime from 'reading-time';
import { toString } from 'mdast-util-to-string';
import lazyLoadPlugin from 'rehype-plugin-image-native-lazy-loading'
import lazyLoadPlugin from 'rehype-plugin-image-native-lazy-loading';
export function readingTimeRemarkPlugin() {
return function (tree, file) {
@@ -36,4 +36,4 @@ export function responsiveTablesRehypePlugin() {
};
}
export const lazyImagesRehypePlugin = lazyLoadPlugin
export const lazyImagesRehypePlugin = lazyLoadPlugin;

View File

@@ -1,7 +1,7 @@
import fs from 'node:fs';
import os from 'node:os';
import configBuilder from "./utils/configBuilder"
import configBuilder from './utils/configBuilder';
import loadConfig from './utils/loadConfig';
const tasksIntegration = ({ config: _themeConfig = 'src/config.yaml' } = {}) => {
@@ -17,10 +17,9 @@ const tasksIntegration = ({ config: _themeConfig = 'src/config.yaml' } = {}) =>
// isRestart,
logger,
updateConfig,
addWatchFile
addWatchFile,
}) => {
const buildLogger = logger.fork("astrowind");
const buildLogger = logger.fork('astrowind');
const virtualModuleId = 'astrowind:config';
const resolvedVirtualModuleId = '\0' + virtualModuleId;
@@ -60,12 +59,12 @@ const tasksIntegration = ({ config: _themeConfig = 'src/config.yaml' } = {}) =>
},
});
if (typeof _themeConfig === "string") {
if (typeof _themeConfig === 'string') {
addWatchFile(new URL(_themeConfig, config.root));
buildLogger.info(`Astrowind \`${_themeConfig}\` has been loaded.`)
buildLogger.info(`Astrowind \`${_themeConfig}\` has been loaded.`);
} else {
buildLogger.info(`Astrowind config has been loaded.`)
buildLogger.info(`Astrowind config has been loaded.`);
}
},
'astro:config:done': async ({ config }) => {
@@ -73,9 +72,8 @@ const tasksIntegration = ({ config: _themeConfig = 'src/config.yaml' } = {}) =>
},
'astro:build:done': async ({ logger }) => {
const buildLogger = logger.fork("astrowind");
buildLogger.info("Updating `robots.txt` with `sitemap-index.xml` ...")
const buildLogger = logger.fork('astrowind');
buildLogger.info('Updating `robots.txt` with `sitemap-index.xml` ...');
try {
const outDir = cfg.outDir;

View File

@@ -1,5 +1,5 @@
declare module 'astrowind:config' {
import type { SiteConfig, I18NConfig, MetaDataConfig, AppBlogConfig, UIConfig, AnalyticsConfig } from "./config"
import type { SiteConfig, I18NConfig, MetaDataConfig, AppBlogConfig, UIConfig, AnalyticsConfig } from './config';
export const SITE: SiteConfig;
export const I18N: I18NConfig;

View File

@@ -4,7 +4,7 @@ import yaml from 'js-yaml';
const loadConfig = async (configPathOrData: string | object) => {
if (typeof configPathOrData === 'string') {
const content = fs.readFileSync(configPathOrData, 'utf8');
if (configPathOrData.endsWith(".yaml") || configPathOrData.endsWith(".yml")) {
if (configPathOrData.endsWith('.yaml') || configPathOrData.endsWith('.yml')) {
return yaml.load(content);
}
return content;