<template>
    <div
        class="min-w-0 p-4 bg-white rounded-lg shadow-xs dark:bg-gray-800 border-2 m-5"
    >
        <div class="ml-4">
            <dt class="mt-3 text-lg leading-6 font-medium text-gray-900">
                {{ item.title }}
            </dt>
            <dd
                class="mt-9 text-base text-gray-500"
                v-html="
                    _utils
                        .escapeHtml(item.detail)
                        .replace(/(?:\r\n|\r|\n)/g, '<br />')
                "
            ></dd>
        </div>

        <p class="text-right text-xs">
            {{ $customFormat(item.created) }}
        </p>
    </div>
</template>

<script setup lang="ts">
const props = defineProps({
    item: { type: Object, required: true },
});
</script>

<style lang="css" scoped></style>
