Dominik Milacher
85d080ab05
All checks were successful
Build and deploy updated apps / Build & deploy (push) Successful in 2m12s
43 lines
846 B
Vue
43 lines
846 B
Vue
<template>
|
|
<div
|
|
class="grid gap-y-8 gap-x-10
|
|
grid-cols-[repeat(auto-fit,minmax(12rem,1fr))]">
|
|
|
|
<div
|
|
v-for="(feat, idx) in features"
|
|
:key="idx"
|
|
class="flex items-start gap-4">
|
|
|
|
<UIcon
|
|
:name="`i-lucide-${rt(feat.icon)}`"
|
|
class="w-6 h-6 shrink-0 text-primary-600 mt-0.5"
|
|
/>
|
|
|
|
<div>
|
|
<h3 class="font-semibold text-neutral-700 leading-tight">
|
|
{{ rt(feat.label) }}
|
|
</h3>
|
|
<p
|
|
v-if="feat.detail"
|
|
class="text-sm text-neutral-600">
|
|
{{ rt(feat.detail) }}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
interface Feature {
|
|
icon: string
|
|
label: string
|
|
detail?: string
|
|
}
|
|
|
|
const props = defineProps<{
|
|
features: Feature[]
|
|
}>()
|
|
|
|
const {t, tm, rt} = useI18n()
|
|
</script>
|