astro-better-cards 0.2.0 → 0.2.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/Card.astro +3 -3
- package/ChildCards.astro +3 -3
- package/package.json +1 -1
package/Card.astro
CHANGED
|
@@ -16,8 +16,8 @@ const {
|
|
|
16
16
|
<a href={href} class="border border-slate-300 dark:bg-slate-900 bg-white border-solid block dark:hover:bg-slate-700 dark:border-slate-600 group hover:bg-slate-300 hover:border-indigo-500 dark:hover:border-indigo-600 rounded-lg overflow-hidden">
|
|
17
17
|
{cardImage && <img src={cardImage} class="w-full object-cover" alt="" aria-hidden="true" />}
|
|
18
18
|
<div class="flex items-start gap-x-6 p-5">
|
|
19
|
-
{icon && <img class:list={["block w-14 shrink-0", darkIcon ? "dark:hidden" : ""]} src={icon} alt="" aria-hidden="true" />}
|
|
20
|
-
{darkIcon && <img class="hidden dark:block w-14 shrink-0" src={darkIcon} alt="" aria-hidden="true" />}
|
|
19
|
+
{icon && <img class:list={["block w-14 h-14 object-contain shrink-0", darkIcon ? "dark:hidden" : ""]} src={icon} alt="" aria-hidden="true" />}
|
|
20
|
+
{darkIcon && <img class="hidden dark:block w-14 h-14 object-contain shrink-0" src={darkIcon} alt="" aria-hidden="true" />}
|
|
21
21
|
<div>
|
|
22
22
|
<p class="font-bold group-hover:text-indigo-500 pb-1 text-xl sm:leading-tight sm:pb-2 sm:text-lg md:text-xl lg:text-2xl 2xl:leading-tight" set:html={title}></p>
|
|
23
23
|
{description && <p class="font-normal lg:leading-4 sm:leading-4 text-sm">{description}</p>}
|
|
@@ -37,7 +37,7 @@ const {
|
|
|
37
37
|
{variant === 'quickstart' && (
|
|
38
38
|
<a href={href} class={"border border-solid block rounded-lg " + (comingSoon ? "border-slate-800 dark:border-slate-700" : "border-slate-200 dark:bg-slate-900 dark:border-slate-800 bg-white dark:hover:bg-slate-800 dark:hover:border-indigo-500 group hover:bg-slate-100 hover:border-indigo-500")}>
|
|
39
39
|
<div class="flex items-center gap-x-6 px-5 py-3">
|
|
40
|
-
{icon && <img class={"h-9 shrink-0" + (comingSoon ? " opacity-40" : "")} src={icon} alt="" aria-hidden="true" />}
|
|
40
|
+
{icon && <img class={"h-9 w-9 object-contain shrink-0" + (comingSoon ? " opacity-40" : "")} src={icon} alt="" aria-hidden="true" />}
|
|
41
41
|
<p class={"font-medium group-hover:text-indigo-500 sm:leading-tight text-sm 1xl:leading-tight " + (comingSoon ? "text-slate-400" : "")} set:html={comingSoon ? title + ' * Coming Soon' : title}></p>
|
|
42
42
|
</div>
|
|
43
43
|
</a>
|
package/ChildCards.astro
CHANGED
|
@@ -125,14 +125,14 @@ if (depth === 1) {
|
|
|
125
125
|
---
|
|
126
126
|
|
|
127
127
|
{depth === 1 ? (
|
|
128
|
-
<div class="gap-6 mt-6 grid grid-cols-1 not-prose lg:grid-cols-2" xmlns="http://www.w3.org/1999/xhtml">
|
|
128
|
+
<div class="gap-6 mt-6 mb-6 grid grid-cols-1 not-prose lg:grid-cols-2" xmlns="http://www.w3.org/1999/xhtml">
|
|
129
129
|
{items.map(item => (
|
|
130
130
|
<Card href={item.href} title={item.title} description={item.description}
|
|
131
131
|
icon={item.icon} darkIcon={item.darkIcon} cardImage={item.cardImage} variant="full" />
|
|
132
132
|
))}
|
|
133
133
|
</div>
|
|
134
134
|
) : (
|
|
135
|
-
<
|
|
135
|
+
<div class="mb-6">
|
|
136
136
|
{groups.map(group => (
|
|
137
137
|
<Fragment>
|
|
138
138
|
<h2 class="mt-10 mb-2 text-xl font-semibold not-prose" set:html={group.title} />
|
|
@@ -144,5 +144,5 @@ if (depth === 1) {
|
|
|
144
144
|
</div>
|
|
145
145
|
</Fragment>
|
|
146
146
|
))}
|
|
147
|
-
</
|
|
147
|
+
</div>
|
|
148
148
|
)}
|