akkoma-fe/src/components/mention_link/mention_link.vue

42 lines
1.1 KiB
Vue
Raw Normal View History

2021-06-07 13:16:10 +00:00
<template>
<span class="MentionLink">
2021-06-07 13:37:12 +00:00
<!-- eslint-disable vue/no-v-html -->
<a
v-if="!user"
href="url"
class="original"
v-html="content"
/>
<!-- eslint-enable vue/no-v-html -->
<span
v-if="user"
class="new"
:style="style"
:class="[{ '-you': isYou, '-highlighted': highlight }, highlightType]"
2021-06-07 13:37:12 +00:00
>
<button
2021-06-07 20:42:04 +00:00
class="short"
:class="highlight ? 'button-default' : 'button-default' "
2021-06-07 13:37:12 +00:00
@click.prevent="onClick"
>
<!-- eslint-disable vue/no-v-html -->
2021-06-07 20:42:04 +00:00
<span class="shortName"><span class="userName" v-html="userName" /></span><span class="you" v-if="isYou">{{ $t('status.you')}}</span>
2021-06-07 13:37:12 +00:00
<!-- eslint-enable vue/no-v-html -->
2021-06-07 13:16:10 +00:00
</button>
2021-06-07 13:37:12 +00:00
<span
v-if="userName !== userNameFull"
2021-06-07 20:42:04 +00:00
class="full popover-default"
:class="[highlightType]"
2021-06-07 13:37:12 +00:00
>
<!-- eslint-disable vue/no-v-html -->
2021-06-07 20:42:04 +00:00
<span class="userNameFull" v-html="userNameFull" />
2021-06-07 13:37:12 +00:00
<!-- eslint-enable vue/no-v-html -->
2021-06-07 13:16:10 +00:00
</span>
</span>
</span>
</template>
<script src="./mention_link.js"/>
<style lang="scss" src="./mention_link.scss"/>