57 lines
1.6 KiB
Vue
57 lines
1.6 KiB
Vue
<script setup lang="ts">
|
|
import { normalizeLink, fmt } from '../../support/utils.js'
|
|
|
|
const props = defineProps<{
|
|
data: any
|
|
}>()
|
|
|
|
const f = props.data.data.frontmatter
|
|
|
|
const tags = f.tags.split(',')
|
|
|
|
const timeStr = fmt(f.time)
|
|
|
|
const togo = (url: string) => {
|
|
if (!url) url = ''
|
|
window.location.href = normalizeLink(url)
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<div class="VTDocCard">
|
|
<div class="rounded-vt h-80 w-full mb-6 bg-gray-700" @click="togo(data.path)">
|
|
<div class="pic h-1/2 text-white relative text-center">
|
|
<div class="title absolute w-4/5 bottom-2 left-0 right-0 mx-auto">
|
|
<h1 class="font-black text-xl antialiased tracking-wide">{{f.title}}</h1>
|
|
<p class="m-1">{{timeStr}}</p>
|
|
</div>
|
|
</div>
|
|
<div class="text h-1/2 bg-cbg rounded-vt px-10 py-6">
|
|
<div class="desc h-3/4">
|
|
<!-- {{data}} -->
|
|
</div>
|
|
<div class="tag h-1/4">
|
|
<span class="inline-block w-24 font-bold
|
|
hover:text-brand transition-colors duration-300">
|
|
<i class="fa fa-star-half-o" aria-hidden="true"></i>
|
|
|
|
{{f.categories}}
|
|
</span>
|
|
<span>
|
|
<i class="fa fa-tags" aria-hidden="true"></i>
|
|
<span
|
|
class="px-1.5 m-1 inline-block text-center
|
|
bg-cbgs border-2 border-cbgs rounded-vt
|
|
hover:border-brand transition-colors duration-300
|
|
"
|
|
v-for="t in tags" :key="t">{{t}}</span>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<style scoped>
|
|
</style>
|