Remove v-if prop anti-pattern, clean up, add reader mode
This commit is contained in:
+26
-8
@@ -32,20 +32,36 @@ import { formatDate } from 'date-fns'
|
||||
class="rounded-4"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<div class="w-100">
|
||||
<h3 class="post-title alex">{{ post.title }}</h3>
|
||||
<p class="post-description">{{ post.description }}</p>
|
||||
<p class="post-description mb-0">{{ post.description }}</p>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-6 d-flex flex-row gap-1 align-items-center">
|
||||
<div class="post-tags d-flex flex-row flex-wrap gap-2 py-2">
|
||||
<span
|
||||
v-for="(tag, index) in post.tags.slice(0, 3)"
|
||||
:key="index"
|
||||
class="nobr"
|
||||
>
|
||||
{{ tag }}
|
||||
</span>
|
||||
<span v-if="post.tags.length > 3" class="nobr">
|
||||
{{ post.tags.length - 3 }} more
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<Separator class="m-0" />
|
||||
|
||||
<div class="post-details py-2">
|
||||
<div class="d-flex flex-row gap-1 align-items-center">
|
||||
<iconify-icon icon="mdi:calendar" />
|
||||
<small class="nobr">
|
||||
{{ formatDate(post.created, 'LLLL do, y – HH:mm') }}
|
||||
</small>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="post.updated" class="row">
|
||||
<div class="col-12 d-flex flex-row gap-1 align-items-center">
|
||||
<div
|
||||
v-if="post.updated"
|
||||
class="d-flex flex-row gap-1 align-items-center"
|
||||
>
|
||||
<iconify-icon icon="mdi:pencil" />
|
||||
<small class="nobr">
|
||||
{{ formatDate(post.updated, 'LLLL do, y – HH:mm') }}
|
||||
@@ -54,7 +70,9 @@ import { formatDate } from 'date-fns'
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="post-pocket d-flex flex-row gap-1 align-items-center">
|
||||
<div
|
||||
class="post-pocket d-flex flex-row gap-1 align-items-center p-2"
|
||||
>
|
||||
<iconify-icon icon="mdi:clock-outline" />
|
||||
<small class="nobr font-monospace font-small">
|
||||
{{ post.readingTime.text }}
|
||||
|
||||
Reference in New Issue
Block a user