rockfic/next
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor(components): add lock icon

Browse Source 
adds a lock icon beside restricted stories in listings if not logged in
This commit is contained in:
✑ ☙◦❀ The Tablet ☯ GamerGirlandCo ❀◦❧ 2023-12-06 21:50:41 -05:00
parent fa27a16e65
commit 43f16b026d
Signed by: tablet
GPG Key ID: 924A5F6AF051E87C
1 changed files with 15 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
components/listings/singleStory.vue
View File

@ -9,8 +9,10 @@
const { useToken } = theme; const { useToken } = theme;
const { token } = useToken(); const { token } = useToken();
const dark = inject<Ref<boolean>>("dark"); const dark = inject<Ref<boolean>>("dark");
const { data } = useAuth();
let prop = defineProps<{ story: IStory; last?: boolean }>(); let prop = defineProps<{ story: IStory; last?: boolean }>();
const idxo = (prop.last || false ? prop.story.chapters.length : 1) - 1; const idxo = (prop.last || false ? prop.story.chapters.length : 1) - 1;
// console.log("idx0->", idxo)
// log.debug("posti->", prop.story.chapters[ prop.story.chapters.length - 1 ]); // log.debug("posti->", prop.story.chapters[ prop.story.chapters.length - 1 ]);
const shortDate = format( const shortDate = format(
Date.parse( Date.parse(
@ -29,9 +31,19 @@
<a-card> <a-card>
<template #title> <template #title>
<div style="padding-top: 1em; padding-bottom: 0.8em"> <div style="padding-top: 1em; padding-bottom: 0.8em">
<div style="display: flex; justify-content: space-between">
<NuxtLink :to="`/story/${story._id}/${idxo + 1}`"> <NuxtLink :to="`/story/${story._id}/${idxo + 1}`">
{{ story.title }} {{ story.title }}
</NuxtLink> </NuxtLink>
<a-tooltip placement="topLeft">
<template #title>
You'll need to log in to read this story. Register if you don't
already have an account -- it's free!
</template>
<icon v-if="!data?.user" istyle="solid" name="lock" />
</a-tooltip>
</div>
<div <div
style="display: flex; font-size: 0.9em; align-items: baseline" style="display: flex; font-size: 0.9em; align-items: baseline"
class="headerthing" class="headerthing"