Some checks failed
Main Confidence / confidence (push) Failing after 50s
Automated commit by agent: commits workspace changes for feature 217-homepage-hero. Please review and merge into `dev`. Co-authored-by: Ahmed Darrazi <ahmed.darrazi@live.de> Reviewed-on: #259
67 lines
2.0 KiB
Plaintext
67 lines
2.0 KiB
Plaintext
---
|
|
import { Icon } from 'astro-icon/components';
|
|
import Card from '@/components/primitives/Card.astro';
|
|
import Eyebrow from '@/components/content/Eyebrow.astro';
|
|
import Headline from '@/components/content/Headline.astro';
|
|
import Lead from '@/components/content/Lead.astro';
|
|
import type { FeatureItemContent } from '@/types/site';
|
|
|
|
interface Props {
|
|
item: FeatureItemContent;
|
|
}
|
|
|
|
const { item } = Astro.props;
|
|
|
|
const lucideMap: Record<string, string> = {
|
|
'shield': 'lucide:shield',
|
|
'database': 'lucide:database',
|
|
'refresh': 'lucide:refresh-cw',
|
|
'eye': 'lucide:eye',
|
|
'file-check': 'lucide:file-check',
|
|
'layers': 'lucide:layers',
|
|
'search': 'lucide:search',
|
|
'lock': 'lucide:lock',
|
|
'zap': 'lucide:zap',
|
|
'clipboard': 'lucide:clipboard-list',
|
|
'git-branch': 'lucide:git-branch',
|
|
'bar-chart': 'lucide:bar-chart-3',
|
|
'activity': 'lucide:activity',
|
|
'settings': 'lucide:settings',
|
|
'globe': 'lucide:globe',
|
|
'users': 'lucide:users',
|
|
'check-circle': 'lucide:check-circle',
|
|
'archive': 'lucide:archive',
|
|
'trending-up': 'lucide:trending-up',
|
|
'cpu': 'lucide:cpu',
|
|
};
|
|
|
|
const iconName = item.icon ? lucideMap[item.icon] : undefined;
|
|
---
|
|
|
|
<Card class="h-full" hoverable>
|
|
<div class="space-y-3">
|
|
{iconName && (
|
|
<div class="feature-icon">
|
|
<Icon name={iconName} size={20} />
|
|
</div>
|
|
)}
|
|
{item.eyebrow && <Eyebrow>{item.eyebrow}</Eyebrow>}
|
|
<Headline as="h3" size="card">
|
|
{item.title}
|
|
</Headline>
|
|
<Lead size="body">
|
|
{item.description}
|
|
</Lead>
|
|
{(item.meta || item.href) && (
|
|
<div class="mt-2 flex flex-wrap items-center gap-3 text-sm">
|
|
{item.meta && <span class="text-[var(--color-brand)]">{item.meta}</span>}
|
|
{item.href && (
|
|
<a class="text-link font-semibold" href={item.href}>
|
|
Learn more
|
|
</a>
|
|
)}
|
|
</div>
|
|
)}
|
|
</div>
|
|
</Card>
|