Change icons for like and favorite
"Like" will now use a star emoji, like mastodon's faves "Favorite" will now use a bookmark emoji, since it functions as a bookmark
This commit is contained in:
parent
6ecb0dcacf
commit
3ae5cfd720
23 changed files with 38 additions and 38 deletions
|
@ -29,7 +29,7 @@ import { CustomEmojiService } from '@/core/CustomEmojiService.js';
|
||||||
import { RoleService } from '@/core/RoleService.js';
|
import { RoleService } from '@/core/RoleService.js';
|
||||||
import { FeaturedService } from '@/core/FeaturedService.js';
|
import { FeaturedService } from '@/core/FeaturedService.js';
|
||||||
|
|
||||||
const FALLBACK = '❤';
|
const FALLBACK = '⭐';
|
||||||
const PER_NOTE_REACTION_USER_PAIR_CACHE_MAX = 16;
|
const PER_NOTE_REACTION_USER_PAIR_CACHE_MAX = 16;
|
||||||
|
|
||||||
const legacies: Record<string, string> = {
|
const legacies: Record<string, string> = {
|
||||||
|
|
|
@ -133,10 +133,10 @@ SPDX-License-Identifier: AGPL-3.0-only
|
||||||
<i class="ph-quotes ph-bold ph-lg"></i>
|
<i class="ph-quotes ph-bold ph-lg"></i>
|
||||||
</button>
|
</button>
|
||||||
<button v-if="appearNote.myReaction == null && appearNote.reactionAcceptance !== 'likeOnly'" ref="likeButton" :class="$style.footerButton" class="_button" @click.stop @click="like()">
|
<button v-if="appearNote.myReaction == null && appearNote.reactionAcceptance !== 'likeOnly'" ref="likeButton" :class="$style.footerButton" class="_button" @click.stop @click="like()">
|
||||||
<i class="ph-heart ph-bold ph-lg"></i>
|
<i class="ph-star ph-bold ph-lg"></i>
|
||||||
</button>
|
</button>
|
||||||
<button v-if="appearNote.myReaction == null" ref="reactButton" :class="$style.footerButton" class="_button" @mousedown="react()">
|
<button v-if="appearNote.myReaction == null" ref="reactButton" :class="$style.footerButton" class="_button" @mousedown="react()">
|
||||||
<i v-if="appearNote.reactionAcceptance === 'likeOnly'" class="ph-heart ph-bold ph-lg"></i>
|
<i v-if="appearNote.reactionAcceptance === 'likeOnly'" class="ph-star ph-bold ph-lg"></i>
|
||||||
<i v-else class="ph-smiley ph-bold ph-lg"></i>
|
<i v-else class="ph-smiley ph-bold ph-lg"></i>
|
||||||
</button>
|
</button>
|
||||||
<button v-if="appearNote.myReaction != null" ref="reactButton" :class="$style.footerButton" class="_button" @click.stop @click="undoReact(appearNote)">
|
<button v-if="appearNote.myReaction != null" ref="reactButton" :class="$style.footerButton" class="_button" @click.stop @click="undoReact(appearNote)">
|
||||||
|
|
|
@ -142,10 +142,10 @@ SPDX-License-Identifier: AGPL-3.0-only
|
||||||
<i class="ph-quotes ph-bold ph-lg"></i>
|
<i class="ph-quotes ph-bold ph-lg"></i>
|
||||||
</button>
|
</button>
|
||||||
<button v-if="appearNote.myReaction == null && appearNote.reactionAcceptance !== 'likeOnly'" ref="likeButton" :class="$style.noteFooterButton" class="_button" @mousedown="like()">
|
<button v-if="appearNote.myReaction == null && appearNote.reactionAcceptance !== 'likeOnly'" ref="likeButton" :class="$style.noteFooterButton" class="_button" @mousedown="like()">
|
||||||
<i class="ph-heart ph-bold ph-lg"></i>
|
<i class="ph-star ph-bold ph-lg"></i>
|
||||||
</button>
|
</button>
|
||||||
<button v-if="appearNote.myReaction == null" ref="reactButton" :class="$style.noteFooterButton" class="_button" @mousedown="react()">
|
<button v-if="appearNote.myReaction == null" ref="reactButton" :class="$style.noteFooterButton" class="_button" @mousedown="react()">
|
||||||
<i v-if="appearNote.reactionAcceptance === 'likeOnly'" class="ph-heart ph-bold ph-lg"></i>
|
<i v-if="appearNote.reactionAcceptance === 'likeOnly'" class="ph-star ph-bold ph-lg"></i>
|
||||||
<i v-else class="ph-smiley ph-bold ph-lg"></i>
|
<i v-else class="ph-smiley ph-bold ph-lg"></i>
|
||||||
</button>
|
</button>
|
||||||
<button v-if="appearNote.myReaction != null" ref="reactButton" class="_button" :class="[$style.noteFooterButton, $style.reacted]" @click="undoReact(appearNote)">
|
<button v-if="appearNote.myReaction != null" ref="reactButton" class="_button" :class="[$style.noteFooterButton, $style.reacted]" @click="undoReact(appearNote)">
|
||||||
|
|
|
@ -49,10 +49,10 @@ SPDX-License-Identifier: AGPL-3.0-only
|
||||||
<i class="ph-prohibit ph-bold ph-lg"></i>
|
<i class="ph-prohibit ph-bold ph-lg"></i>
|
||||||
</button>
|
</button>
|
||||||
<button v-if="note.myReaction == null && note.reactionAcceptance !== 'likeOnly'" ref="likeButton" :class="$style.noteFooterButton" class="_button" @mousedown="like()">
|
<button v-if="note.myReaction == null && note.reactionAcceptance !== 'likeOnly'" ref="likeButton" :class="$style.noteFooterButton" class="_button" @mousedown="like()">
|
||||||
<i class="ph-heart ph-bold ph-lg"></i>
|
<i class="ph-star ph-bold ph-lg"></i>
|
||||||
</button>
|
</button>
|
||||||
<button v-if="note.myReaction == null" ref="reactButton" :class="$style.noteFooterButton" class="_button" @mousedown="react()">
|
<button v-if="note.myReaction == null" ref="reactButton" :class="$style.noteFooterButton" class="_button" @mousedown="react()">
|
||||||
<i v-if="note.reactionAcceptance === 'likeOnly'" class="ph-heart ph-bold ph-lg"></i>
|
<i v-if="note.reactionAcceptance === 'likeOnly'" class="ph-star ph-bold ph-lg"></i>
|
||||||
<i v-else class="ph-smiley ph-bold ph-lg"></i>
|
<i v-else class="ph-smiley ph-bold ph-lg"></i>
|
||||||
</button>
|
</button>
|
||||||
<button v-if="note.myReaction != null" ref="reactButton" class="_button" :class="[$style.noteFooterButton, $style.reacted]" @click="undoReact(note)">
|
<button v-if="note.myReaction != null" ref="reactButton" class="_button" :class="[$style.noteFooterButton, $style.reacted]" @click="undoReact(note)">
|
||||||
|
|
|
@ -37,8 +37,8 @@ SPDX-License-Identifier: AGPL-3.0-only
|
||||||
<span v-else><i class="ph-rocket ph-bold ph-lg"></i></span>
|
<span v-else><i class="ph-rocket ph-bold ph-lg"></i></span>
|
||||||
</button>
|
</button>
|
||||||
<button v-click-anime v-tooltip="i18n.ts.reactionAcceptance" class="_button" :class="[$style.headerRightItem, { [$style.danger]: reactionAcceptance === 'likeOnly' }]" @click="toggleReactionAcceptance">
|
<button v-click-anime v-tooltip="i18n.ts.reactionAcceptance" class="_button" :class="[$style.headerRightItem, { [$style.danger]: reactionAcceptance === 'likeOnly' }]" @click="toggleReactionAcceptance">
|
||||||
<span v-if="reactionAcceptance === 'likeOnly'"><i class="ph-heart ph-bold ph-lg"></i></span>
|
<span v-if="reactionAcceptance === 'likeOnly'"><i class="ph-star ph-bold ph-lg"></i></span>
|
||||||
<span v-else-if="reactionAcceptance === 'likeOnlyForRemote'"><i class="ph-heart ph-bold ph-lg"></i></span>
|
<span v-else-if="reactionAcceptance === 'likeOnlyForRemote'"><i class="ph-star ph-bold ph-lg"></i></span>
|
||||||
<span v-else><i class="ph-smiley ph-bold ph-lg"></i></span>
|
<span v-else><i class="ph-smiley ph-bold ph-lg"></i></span>
|
||||||
</button>
|
</button>
|
||||||
<button v-click-anime class="_button" :class="$style.submit" :disabled="!canPost" data-cy-open-post-form-submit @click="post">
|
<button v-click-anime class="_button" :class="$style.submit" :disabled="!canPost" data-cy-open-post-form-submit @click="post">
|
||||||
|
|
|
@ -135,10 +135,10 @@ SPDX-License-Identifier: AGPL-3.0-only
|
||||||
<i class="ph-quotes ph-bold ph-lg"></i>
|
<i class="ph-quotes ph-bold ph-lg"></i>
|
||||||
</button>
|
</button>
|
||||||
<button v-if="appearNote.myReaction == null && appearNote.reactionAcceptance !== 'likeOnly'" ref="likeButton" :class="$style.footerButton" class="_button" @click.stop @click="like()">
|
<button v-if="appearNote.myReaction == null && appearNote.reactionAcceptance !== 'likeOnly'" ref="likeButton" :class="$style.footerButton" class="_button" @click.stop @click="like()">
|
||||||
<i class="ph-heart ph-bold ph-lg"></i>
|
<i class="ph-star ph-bold ph-lg"></i>
|
||||||
</button>
|
</button>
|
||||||
<button v-if="appearNote.myReaction == null" ref="reactButton" :class="$style.footerButton" class="_button" @mousedown="react()">
|
<button v-if="appearNote.myReaction == null" ref="reactButton" :class="$style.footerButton" class="_button" @mousedown="react()">
|
||||||
<i v-if="appearNote.reactionAcceptance === 'likeOnly'" class="ph-heart ph-bold ph-lg"></i>
|
<i v-if="appearNote.reactionAcceptance === 'likeOnly'" class="ph-star ph-bold ph-lg"></i>
|
||||||
<i v-else class="ph-smiley ph-bold ph-lg"></i>
|
<i v-else class="ph-smiley ph-bold ph-lg"></i>
|
||||||
</button>
|
</button>
|
||||||
<button v-if="appearNote.myReaction != null" ref="reactButton" :class="$style.footerButton" class="_button" @click.stop @click="undoReact(appearNote)">
|
<button v-if="appearNote.myReaction != null" ref="reactButton" :class="$style.footerButton" class="_button" @click.stop @click="undoReact(appearNote)">
|
||||||
|
|
|
@ -150,10 +150,10 @@ SPDX-License-Identifier: AGPL-3.0-only
|
||||||
<i class="ph-quotes ph-bold ph-lg"></i>
|
<i class="ph-quotes ph-bold ph-lg"></i>
|
||||||
</button>
|
</button>
|
||||||
<button v-if="appearNote.myReaction == null && appearNote.reactionAcceptance !== 'likeOnly'" ref="likeButton" :class="$style.noteFooterButton" class="_button" @mousedown="like()">
|
<button v-if="appearNote.myReaction == null && appearNote.reactionAcceptance !== 'likeOnly'" ref="likeButton" :class="$style.noteFooterButton" class="_button" @mousedown="like()">
|
||||||
<i class="ph-heart ph-bold ph-lg"></i>
|
<i class="ph-star ph-bold ph-lg"></i>
|
||||||
</button>
|
</button>
|
||||||
<button v-if="appearNote.myReaction == null" ref="reactButton" :class="$style.noteFooterButton" class="_button" @mousedown="react()">
|
<button v-if="appearNote.myReaction == null" ref="reactButton" :class="$style.noteFooterButton" class="_button" @mousedown="react()">
|
||||||
<i v-if="appearNote.reactionAcceptance === 'likeOnly'" class="ph-heart ph-bold ph-lg"></i>
|
<i v-if="appearNote.reactionAcceptance === 'likeOnly'" class="ph-star ph-bold ph-lg"></i>
|
||||||
<i v-else class="ph-smiley ph-bold ph-lg"></i>
|
<i v-else class="ph-smiley ph-bold ph-lg"></i>
|
||||||
</button>
|
</button>
|
||||||
<button v-if="appearNote.myReaction != null" ref="reactButton" class="_button" :class="[$style.noteFooterButton, $style.reacted]" @click="undoReact(appearNote)">
|
<button v-if="appearNote.myReaction != null" ref="reactButton" class="_button" :class="[$style.noteFooterButton, $style.reacted]" @click="undoReact(appearNote)">
|
||||||
|
|
|
@ -57,10 +57,10 @@ SPDX-License-Identifier: AGPL-3.0-only
|
||||||
<i class="ph-prohibit ph-bold ph-lg"></i>
|
<i class="ph-prohibit ph-bold ph-lg"></i>
|
||||||
</button>
|
</button>
|
||||||
<button v-if="note.myReaction == null && note.reactionAcceptance !== 'likeOnly'" ref="likeButton" :class="$style.noteFooterButton" class="_button" @mousedown="like()">
|
<button v-if="note.myReaction == null && note.reactionAcceptance !== 'likeOnly'" ref="likeButton" :class="$style.noteFooterButton" class="_button" @mousedown="like()">
|
||||||
<i class="ph-heart ph-bold ph-lg"></i>
|
<i class="ph-star ph-bold ph-lg"></i>
|
||||||
</button>
|
</button>
|
||||||
<button v-if="note.myReaction == null" ref="reactButton" :class="$style.noteFooterButton" class="_button" @mousedown="react()">
|
<button v-if="note.myReaction == null" ref="reactButton" :class="$style.noteFooterButton" class="_button" @mousedown="react()">
|
||||||
<i v-if="note.reactionAcceptance === 'likeOnly'" class="ph-heart ph-bold ph-lg"></i>
|
<i v-if="note.reactionAcceptance === 'likeOnly'" class="ph-star ph-bold ph-lg"></i>
|
||||||
<i v-else class="ph-smiley ph-bold ph-lg"></i>
|
<i v-else class="ph-smiley ph-bold ph-lg"></i>
|
||||||
</button>
|
</button>
|
||||||
<button v-if="note.myReaction != null" ref="reactButton" class="_button" :class="[$style.noteFooterButton, $style.reacted]" @click="undoReact(note)">
|
<button v-if="note.myReaction != null" ref="reactButton" class="_button" :class="[$style.noteFooterButton, $style.reacted]" @click="undoReact(note)">
|
||||||
|
|
|
@ -67,7 +67,7 @@
|
||||||
<i class="ph-quotes ph-bold ph-lg"></i>
|
<i class="ph-quotes ph-bold ph-lg"></i>
|
||||||
</button>
|
</button>
|
||||||
<button class="_button" :class="$style.noteFooterButton">
|
<button class="_button" :class="$style.noteFooterButton">
|
||||||
<i class="ph-heart ph-bold ph-lg"></i>
|
<i class="ph-star ph-bold ph-lg"></i>
|
||||||
</button>
|
</button>
|
||||||
</footer>
|
</footer>
|
||||||
</article>
|
</article>
|
||||||
|
|
|
@ -82,7 +82,7 @@ export const navbarItemDef = reactive({
|
||||||
},
|
},
|
||||||
favorites: {
|
favorites: {
|
||||||
title: i18n.ts.favorites,
|
title: i18n.ts.favorites,
|
||||||
icon: 'ph-star ph-bold ph-lg',
|
icon: 'ph-bookmarks ph-bold ph-lg',
|
||||||
show: computed(() => $i != null),
|
show: computed(() => $i != null),
|
||||||
to: '/my/favorites',
|
to: '/my/favorites',
|
||||||
},
|
},
|
||||||
|
|
|
@ -10,8 +10,8 @@ SPDX-License-Identifier: AGPL-3.0-only
|
||||||
<div v-if="channel && tab === 'overview'" class="_gaps">
|
<div v-if="channel && tab === 'overview'" class="_gaps">
|
||||||
<div class="_panel" :class="$style.bannerContainer">
|
<div class="_panel" :class="$style.bannerContainer">
|
||||||
<XChannelFollowButton :channel="channel" :full="true" :class="$style.subscribe"/>
|
<XChannelFollowButton :channel="channel" :full="true" :class="$style.subscribe"/>
|
||||||
<MkButton v-if="favorited" v-tooltip="i18n.ts.unfavorite" asLike class="button" rounded primary :class="$style.favorite" @click="unfavorite()"><i class="ph-star ph-bold ph-lg"></i></MkButton>
|
<MkButton v-if="favorited" v-tooltip="i18n.ts.unfavorite" asLike class="button" rounded primary :class="$style.favorite" @click="unfavorite()"><i class="ph-bookmark-simple ph-bold ph-lg"></i></MkButton>
|
||||||
<MkButton v-else v-tooltip="i18n.ts.favorite" asLike class="button" rounded :class="$style.favorite" @click="favorite()"><i class="ph-star ph-bold ph-lg"></i></MkButton>
|
<MkButton v-else v-tooltip="i18n.ts.favorite" asLike class="button" rounded :class="$style.favorite" @click="favorite()"><i class="ph-bookmark-simple ph-bold ph-lg"></i></MkButton>
|
||||||
<div :style="{ backgroundImage: channel.bannerUrl ? `url(${channel.bannerUrl})` : undefined }" :class="$style.banner">
|
<div :style="{ backgroundImage: channel.bannerUrl ? `url(${channel.bannerUrl})` : undefined }" :class="$style.banner">
|
||||||
<div :class="$style.bannerStatus">
|
<div :class="$style.bannerStatus">
|
||||||
<div><i class="ph-users ph-bold ph-lg ti-fw"></i><I18n :src="i18n.ts._channel.usersCount" tag="span" style="margin-left: 4px;"><template #n><b>{{ channel.usersCount }}</b></template></I18n></div>
|
<div><i class="ph-users ph-bold ph-lg ti-fw"></i><I18n :src="i18n.ts._channel.usersCount" tag="span" style="margin-left: 4px;"><template #n><b>{{ channel.usersCount }}</b></template></I18n></div>
|
||||||
|
|
|
@ -12,8 +12,8 @@ SPDX-License-Identifier: AGPL-3.0-only
|
||||||
<div v-if="clip.description" :class="$style.description">
|
<div v-if="clip.description" :class="$style.description">
|
||||||
<Mfm :text="clip.description" :isNote="false"/>
|
<Mfm :text="clip.description" :isNote="false"/>
|
||||||
</div>
|
</div>
|
||||||
<MkButton v-if="favorited" v-tooltip="i18n.ts.unfavorite" asLike rounded primary @click="unfavorite()"><i class="ph-heart ph-bold ph-lg"></i><span v-if="clip.favoritedCount > 0" style="margin-left: 6px;">{{ clip.favoritedCount }}</span></MkButton>
|
<MkButton v-if="favorited" v-tooltip="i18n.ts.unfavorite" asLike rounded primary @click="unfavorite()"><i class="ph-star ph-bold ph-lg"></i><span v-if="clip.favoritedCount > 0" style="margin-left: 6px;">{{ clip.favoritedCount }}</span></MkButton>
|
||||||
<MkButton v-else v-tooltip="i18n.ts.favorite" asLike rounded @click="favorite()"><i class="ph-heart ph-bold ph-lg"></i><span v-if="clip.favoritedCount > 0" style="margin-left: 6px;">{{ clip.favoritedCount }}</span></MkButton>
|
<MkButton v-else v-tooltip="i18n.ts.favorite" asLike rounded @click="favorite()"><i class="ph-star ph-bold ph-lg"></i><span v-if="clip.favoritedCount > 0" style="margin-left: 6px;">{{ clip.favoritedCount }}</span></MkButton>
|
||||||
<div :class="$style.user">
|
<div :class="$style.user">
|
||||||
<MkAvatar :user="clip.user" :class="$style.avatar" indicator link preview/> <MkUserName :user="clip.user" :nowrap="false"/>
|
<MkAvatar :user="clip.user" :class="$style.avatar" indicator link preview/> <MkUserName :user="clip.user" :nowrap="false"/>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -40,7 +40,7 @@ const pagination = {
|
||||||
|
|
||||||
definePageMetadata({
|
definePageMetadata({
|
||||||
title: i18n.ts.favorites,
|
title: i18n.ts.favorites,
|
||||||
icon: 'ph-star ph-bold ph-lg',
|
icon: 'ph-bookmarks-simple ph-bold ph-lg',
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
|
@ -84,7 +84,7 @@ const headerTabs = computed(() => [{
|
||||||
}, {
|
}, {
|
||||||
key: 'liked',
|
key: 'liked',
|
||||||
title: i18n.ts._play.liked,
|
title: i18n.ts._play.liked,
|
||||||
icon: 'ph-heart ph-bold ph-lg',
|
icon: 'ph-star ph-bold ph-lg',
|
||||||
}]);
|
}]);
|
||||||
|
|
||||||
definePageMetadata(computed(() => ({
|
definePageMetadata(computed(() => ({
|
||||||
|
|
|
@ -15,8 +15,8 @@ SPDX-License-Identifier: AGPL-3.0-only
|
||||||
<MkAsUi v-if="root" :component="root" :components="components"/>
|
<MkAsUi v-if="root" :component="root" :components="components"/>
|
||||||
</div>
|
</div>
|
||||||
<div class="actions _panel">
|
<div class="actions _panel">
|
||||||
<MkButton v-if="flash.isLiked" v-tooltip="i18n.ts.unlike" asLike class="button" rounded primary @click="unlike()"><i class="ph-heart ph-bold ph-lg"></i><span v-if="flash.likedCount > 0" style="margin-left: 6px;">{{ flash.likedCount }}</span></MkButton>
|
<MkButton v-if="flash.isLiked" v-tooltip="i18n.ts.unlike" asLike class="button" rounded primary @click="unlike()"><i class="ph-star ph-bold ph-lg"></i><span v-if="flash.likedCount > 0" style="margin-left: 6px;">{{ flash.likedCount }}</span></MkButton>
|
||||||
<MkButton v-else v-tooltip="i18n.ts.like" asLike class="button" rounded @click="like()"><i class="ph-heart ph-bold ph-lg"></i><span v-if="flash.likedCount > 0" style="margin-left: 6px;">{{ flash.likedCount }}</span></MkButton>
|
<MkButton v-else v-tooltip="i18n.ts.like" asLike class="button" rounded @click="like()"><i class="ph-star ph-bold ph-lg"></i><span v-if="flash.likedCount > 0" style="margin-left: 6px;">{{ flash.likedCount }}</span></MkButton>
|
||||||
<MkButton v-tooltip="i18n.ts.shareWithNote" class="button" rounded @click="shareWithNote"><i class="ph-repeat ph-bold ph-lg ti-fw"></i></MkButton>
|
<MkButton v-tooltip="i18n.ts.shareWithNote" class="button" rounded @click="shareWithNote"><i class="ph-repeat ph-bold ph-lg ti-fw"></i></MkButton>
|
||||||
<MkButton v-tooltip="i18n.ts.copyLink" class="button" rounded @click="copyLink"><i class="ph-share-network ph-bold ph-lg ti-fw"></i></MkButton>
|
<MkButton v-tooltip="i18n.ts.copyLink" class="button" rounded @click="copyLink"><i class="ph-share-network ph-bold ph-lg ti-fw"></i></MkButton>
|
||||||
<MkButton v-if="isSupportShare()" v-tooltip="i18n.ts.share" class="button" rounded @click="share"><i class="ph-share-network ph-bold ph-lg ti-fw"></i></MkButton>
|
<MkButton v-if="isSupportShare()" v-tooltip="i18n.ts.share" class="button" rounded @click="share"><i class="ph-share-network ph-bold ph-lg ti-fw"></i></MkButton>
|
||||||
|
@ -28,7 +28,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
||||||
<div class="summary">{{ flash.summary }}</div>
|
<div class="summary">{{ flash.summary }}</div>
|
||||||
<MkButton class="start" gradate rounded large @click="start">Play</MkButton>
|
<MkButton class="start" gradate rounded large @click="start">Play</MkButton>
|
||||||
<div class="info">
|
<div class="info">
|
||||||
<span v-tooltip="i18n.ts.numberOfLikes"><i class="ph-heart ph-bold ph-lg"></i> {{ flash.likedCount }}</span>
|
<span v-tooltip="i18n.ts.numberOfLikes"><i class="ph-star ph-bold ph-lg"></i> {{ flash.likedCount }}</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -111,7 +111,7 @@ const headerTabs = computed(() => [{
|
||||||
}, {
|
}, {
|
||||||
key: 'liked',
|
key: 'liked',
|
||||||
title: i18n.ts._gallery.liked,
|
title: i18n.ts._gallery.liked,
|
||||||
icon: 'ph-heart ph-bold ph-lg',
|
icon: 'ph-star ph-bold ph-lg',
|
||||||
}, {
|
}, {
|
||||||
key: 'my',
|
key: 'my',
|
||||||
title: i18n.ts._gallery.my,
|
title: i18n.ts._gallery.my,
|
||||||
|
|
|
@ -23,8 +23,8 @@ SPDX-License-Identifier: AGPL-3.0-only
|
||||||
</div>
|
</div>
|
||||||
<div class="actions">
|
<div class="actions">
|
||||||
<div class="like">
|
<div class="like">
|
||||||
<MkButton v-if="post.isLiked" v-tooltip="i18n.ts._gallery.unlike" class="button" primary @click="unlike()"><i class="ph-heart-break ph-bold ph-lg"></i><span v-if="post.likedCount > 0" class="count">{{ post.likedCount }}</span></MkButton>
|
<MkButton v-if="post.isLiked" v-tooltip="i18n.ts._gallery.unlike" class="button" primary @click="unlike()"><i class="ph-star-break ph-bold ph-lg"></i><span v-if="post.likedCount > 0" class="count">{{ post.likedCount }}</span></MkButton>
|
||||||
<MkButton v-else v-tooltip="i18n.ts._gallery.like" class="button" @click="like()"><i class="ph-heart ph-bold ph-lg"></i><span v-if="post.likedCount > 0" class="count">{{ post.likedCount }}</span></MkButton>
|
<MkButton v-else v-tooltip="i18n.ts._gallery.like" class="button" @click="like()"><i class="ph-star ph-bold ph-lg"></i><span v-if="post.likedCount > 0" class="count">{{ post.likedCount }}</span></MkButton>
|
||||||
</div>
|
</div>
|
||||||
<div class="other">
|
<div class="other">
|
||||||
<button v-if="$i && $i.id === post.user.id" v-tooltip="i18n.ts.edit" v-click-anime class="_button" @click="edit"><i class="ph-pencil ph-bold ph-lg ti-fw"></i></button>
|
<button v-if="$i && $i.id === post.user.id" v-tooltip="i18n.ts.edit" v-click-anime class="_button" @click="edit"><i class="ph-pencil ph-bold ph-lg ti-fw"></i></button>
|
||||||
|
|
|
@ -26,8 +26,8 @@ SPDX-License-Identifier: AGPL-3.0-only
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<MkButton v-if="list.isLiked" v-tooltip="i18n.ts.unlike" inline :class="$style.button" asLike primary @click="unlike()"><i class="ph-heart-break ph-bold ph-lg"></i><span v-if="list.likedCount > 0" class="count">{{ list.likedCount }}</span></MkButton>
|
<MkButton v-if="list.isLiked" v-tooltip="i18n.ts.unlike" inline :class="$style.button" asLike primary @click="unlike()"><i class="ph-star-break ph-bold ph-lg"></i><span v-if="list.likedCount > 0" class="count">{{ list.likedCount }}</span></MkButton>
|
||||||
<MkButton v-if="!list.isLiked" v-tooltip="i18n.ts.like" inline :class="$style.button" asLike @click="like()"><i class="ph-heart ph-bold ph-lg"></i><span v-if="1 > 0" class="count">{{ list.likedCount }}</span></MkButton>
|
<MkButton v-if="!list.isLiked" v-tooltip="i18n.ts.like" inline :class="$style.button" asLike @click="like()"><i class="ph-star ph-bold ph-lg"></i><span v-if="1 > 0" class="count">{{ list.likedCount }}</span></MkButton>
|
||||||
<MkButton inline @click="create()"><i class="ph-download ph-bold ph-lg" :class="$style.import"></i>{{ i18n.ts.import }}</MkButton>
|
<MkButton inline @click="create()"><i class="ph-download ph-bold ph-lg" :class="$style.import"></i>{{ i18n.ts.import }}</MkButton>
|
||||||
</MkSpacer>
|
</MkSpacer>
|
||||||
</MkStickyContainer>
|
</MkStickyContainer>
|
||||||
|
|
|
@ -96,7 +96,7 @@ const headerTabs = computed(() => [{
|
||||||
}, {
|
}, {
|
||||||
key: 'favorites',
|
key: 'favorites',
|
||||||
title: i18n.ts.favorites,
|
title: i18n.ts.favorites,
|
||||||
icon: 'ph-heart ph-bold ph-lg',
|
icon: 'ph-star ph-bold ph-lg',
|
||||||
}]);
|
}]);
|
||||||
|
|
||||||
definePageMetadata({
|
definePageMetadata({
|
||||||
|
|
|
@ -29,8 +29,8 @@ SPDX-License-Identifier: AGPL-3.0-only
|
||||||
</div>
|
</div>
|
||||||
<div class="actions">
|
<div class="actions">
|
||||||
<div class="like">
|
<div class="like">
|
||||||
<MkButton v-if="page.isLiked" v-tooltip="i18n.ts._pages.unlike" class="button" asLike primary @click="unlike()"><i class="ph-heart-break ph-bold ph-lg"></i><span v-if="page.likedCount > 0" class="count">{{ page.likedCount }}</span></MkButton>
|
<MkButton v-if="page.isLiked" v-tooltip="i18n.ts._pages.unlike" class="button" asLike primary @click="unlike()"><i class="ph-star-break ph-bold ph-lg"></i><span v-if="page.likedCount > 0" class="count">{{ page.likedCount }}</span></MkButton>
|
||||||
<MkButton v-else v-tooltip="i18n.ts._pages.like" class="button" asLike @click="like()"><i class="ph-heart ph-bold ph-lg"></i><span v-if="page.likedCount > 0" class="count">{{ page.likedCount }}</span></MkButton>
|
<MkButton v-else v-tooltip="i18n.ts._pages.like" class="button" asLike @click="like()"><i class="ph-star ph-bold ph-lg"></i><span v-if="page.likedCount > 0" class="count">{{ page.likedCount }}</span></MkButton>
|
||||||
</div>
|
</div>
|
||||||
<div class="other">
|
<div class="other">
|
||||||
<button v-tooltip="i18n.ts.shareWithNote" v-click-anime class="_button" @click="shareWithNote"><i class="ph-rocket-launch ph-bold ph-lg ti-fw"></i></button>
|
<button v-tooltip="i18n.ts.shareWithNote" v-click-anime class="_button" @click="shareWithNote"><i class="ph-rocket-launch ph-bold ph-lg ti-fw"></i></button>
|
||||||
|
|
|
@ -82,7 +82,7 @@ const headerTabs = computed(() => [{
|
||||||
}, {
|
}, {
|
||||||
key: 'liked',
|
key: 'liked',
|
||||||
title: i18n.ts._pages.liked,
|
title: i18n.ts._pages.liked,
|
||||||
icon: 'ph-heart ph-bold ph-lg',
|
icon: 'ph-star ph-bold ph-lg',
|
||||||
}]);
|
}]);
|
||||||
|
|
||||||
definePageMetadata(computed(() => ({
|
definePageMetadata(computed(() => ({
|
||||||
|
|
|
@ -29,7 +29,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
||||||
</div>
|
</div>
|
||||||
</FormSection>
|
</FormSection>
|
||||||
<FormSection>
|
<FormSection>
|
||||||
<template #label><i class="ph-star ph-bold ph-lg"></i> {{ i18n.ts._exportOrImport.favoritedNotes }}</template>
|
<template #label><i class="ph-bookmark-simple ph-bold ph-lg"></i> {{ i18n.ts._exportOrImport.favoritedNotes }}</template>
|
||||||
<MkFolder>
|
<MkFolder>
|
||||||
<template #label>{{ i18n.ts.export }}</template>
|
<template #label>{{ i18n.ts.export }}</template>
|
||||||
<template #icon><i class="ph-download ph-bold ph-lg"></i></template>
|
<template #icon><i class="ph-download ph-bold ph-lg"></i></template>
|
||||||
|
|
|
@ -318,11 +318,11 @@ export function getNoteMenu(props: {
|
||||||
} : undefined,
|
} : undefined,
|
||||||
{ type: 'divider' },
|
{ type: 'divider' },
|
||||||
statePromise.then(state => state.isFavorited ? {
|
statePromise.then(state => state.isFavorited ? {
|
||||||
icon: 'ph-star-half ph-bold ph-lg',
|
icon: 'ph-bookmarks ph-bold ph-lg',
|
||||||
text: i18n.ts.unfavorite,
|
text: i18n.ts.unfavorite,
|
||||||
action: () => toggleFavorite(false),
|
action: () => toggleFavorite(false),
|
||||||
} : {
|
} : {
|
||||||
icon: 'ph-star ph-bold ph-lg',
|
icon: 'ph-bookmark-simple ph-bold ph-lg',
|
||||||
text: i18n.ts.favorite,
|
text: i18n.ts.favorite,
|
||||||
action: () => toggleFavorite(true),
|
action: () => toggleFavorite(true),
|
||||||
}),
|
}),
|
||||||
|
|
Loading…
Reference in a new issue