mirror/cherrypick
1
1
Fork 0
mirror of https://github.com/kokonect-link/cherrypick synced 2024-11-27 22:38:34 +09:00
Code

enhance(frontend): ページの表示部上部に編集リンクを追加 (#13724)

Browse Source
This commit is contained in:
かっこかり 2024-04-17 10:48:42 +09:00 committed by GitHub
parent e9e877f64e
commit 6f489b58a1
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 24 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
packages/frontend/src/pages/page.vue
View File

@ -12,6 +12,7 @@ SPDX-License-Identifier: AGPL-3.0-only
:leaveActiveClass="defaultStore.state.animation ? $style.fadeLeaveActive : ''"
:enterFromClass="defaultStore.state.animation ? $style.fadeEnterFrom : ''"
:leaveToClass="defaultStore.state.animation ? $style.fadeLeaveTo : ''"
mode="out-in"
>
<div v-if="page" :key="page.id" class="_gaps">
<div :class="$style.pageMain">
@ -41,8 +42,14 @@ SPDX-License-Identifier: AGPL-3.0-only
</div>
<div :class="$style.pageBannerTitle" class="_gaps_s">
<h1>{{ page.title || page.name }}</h1>
<div v-if="page.user" :class="$style.pageBannerTitleUser">
<MkAvatar :user="page.user" :class="$style.avatar" indicator link preview/> <MkA :to="`/@${username}`"><MkUserName :user="page.user" :nowrap="false"/></MkA>
<div :class="$style.pageBannerTitleSub">
<div v-if="page.user" :class="$style.pageBannerTitleUser">
<MkAvatar :user="page.user" :class="$style.avatar" indicator link preview/> <MkA :to="`/@${username}`"><MkUserName :user="page.user" :nowrap="false"/></MkA>
</div>
<div :class="$style.pageBannerTitleSubActions">
<button v-tooltip="i18n.ts.share" class="_button" :class="$style.generalActionButton" @click="share"><i class="ti ti-share ti-fw"></i></button>
<MkA v-if="page.userId === $i?.id" v-tooltip="i18n.ts._pages.editThisPage" :to="`/pages/edit/${page.id}`" class="_button" :class="$style.generalActionButton"><i class="ti ti-pencil ti-fw"></i></MkA>
</div>
</div>
</div>
</div>
@ -355,8 +362,15 @@ definePageMetadata(() => ({
margin: 0;
}
.pageBannerTitleSub {
display: flex;
align-items: center;
width: 100%;
}
.pageBannerTitleUser {
--height: 32px;
flex-shrink: 0;
.avatar {
height: var(--height);
@ -365,6 +379,14 @@ definePageMetadata(() => ({
line-height: var(--height);
}
.pageBannerTitleSubActions {
flex-shrink: 0;
display: flex;
align-items: center;
gap: var(--marginHalf);
margin-left: auto;
}
}
}