Files
365devnet/src/components/widgets/Features2.astro
2023-08-16 00:43:36 -04:00

49 lines
1.4 KiB
Plaintext

---
import WidgetWrapper from "~/components/ui/WidgetWrapper.astro";
import Headline from "~/components/ui/Headline.astro";
import ItemGrid2 from "~/components/ui/ItemGrid2.astro";
import type { Features } from "~/types";
const {
title = await Astro.slots.render("title"),
subtitle = await Astro.slots.render("subtitle"),
tagline = await Astro.slots.render("tagline"),
items = [],
columns = 3,
defaultIcon,
id,
isDark = false,
classes = {},
bg = await Astro.slots.render("bg"),
} = Astro.props as Features;
---
<WidgetWrapper
id={id}
isDark={isDark}
containerClass={`max-w-7xl mx-auto ${classes?.container ?? ''}`}
bg={bg}
>
<Headline
title={title}
subtitle={subtitle}
tagline={tagline}
classes={classes?.headline}
/>
<ItemGrid2
items={items}
columns={columns}
defaultIcon={defaultIcon}
classes={{
container: "gap-4 md:gap-6",
panel:
'rounded-lg shadow-[0_4px_30px_rgba(0,0,0,0.1)] dark:shadow-[0_4px_30px_rgba(0,0,0,0.1)] backdrop-blur border border-[#ffffff29] bg-white dark:bg-slate-900 p-6',
// panel:
// "text-center bg-page items-center md:text-left rtl:md:text-right md:items-start p-6 p-6 rounded-md shadow-xl dark:shadow-none dark:border dark:border-slate-800",
icon: "w-12 h-12 mb-6 text-primary",
...((classes?.items as {}) ?? {}),
}}
/>
</WidgetWrapper>