Files
api/web/components/UserProfile/PromoFeature.vue
2023-08-08 13:50:42 -07:00

40 lines
874 B
Vue

<script setup lang="ts">
export interface Props {
center?: boolean;
copy?: string;
icon?: string;
title?: string;
}
defineProps<Props>();
</script>
<template>
<div class="text-left relative flex overflow-hidden">
<span v-if="!center" class="flex-shrink-0">
<slot />
</span>
<div class="inline-flex flex-col" :class="{ 'text-center': center }">
<h3
class="text-16px font-semibold"
:class="{
'mt-0 mb-4px': copy,
'my-0': !copy,
'flex flex-row justify-center items-center': center
}"
>
<span v-if="center" class="flex-shrink-0 mr-8px">
<slot />
</span>
{{ title }}
</h3>
<p
v-if="copy"
class="text-14px opacity-75 py-0"
:class="{'px-8px': center}"
v-html="copy"
/>
</div>
</div>
</template>