enhance(client): ヘッダー(MkPageHeader)関連 (#9869)

* MkPageHeader大改造

* ユーザーページのノート一覧をタブにするなど

* ✌️

* 🎨

* fix

* wheel

* clean up

* 🎨

* 🎨

* remove console.log

* update CHANGELOG.md

* fix

* fix

* fix

* ✌️

* header avatar clickable

* !hideTitle

* Revert "!hideTitle"

This reverts commit 19cad428c906f555b73730d602e401a1e943cdef.

* fix changelog
This commit is contained in:
tamaina 2023-02-11 13:08:18 +09:00 committed by GitHub
parent 6f33be6c75
commit 0138c3b00e
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
6 changed files with 230 additions and 98 deletions

View file

@ -1,14 +1,16 @@
<template>
<MkStickyContainer>
<template #header>
<MkTab v-model="include" :class="$style.tab">
<option :value="null">{{ i18n.ts.notes }}</option>
<option value="replies">{{ i18n.ts.notesAndReplies }}</option>
<option value="files">{{ i18n.ts.withFiles }}</option>
</MkTab>
</template>
<XNotes :no-gap="true" :pagination="pagination"/>
</MkStickyContainer>
<MkSpacer :content-max="800" style="padding-top: 0">
<MkStickyContainer>
<template #header>
<MkTab v-model="include" :class="$style.tab">
<option :value="null">{{ i18n.ts.notes }}</option>
<option value="replies">{{ i18n.ts.notesAndReplies }}</option>
<option value="files">{{ i18n.ts.withFiles }}</option>
</MkTab>
</template>
<XNotes :no-gap="true" :pagination="pagination" :class="$style.tl"/>
</MkStickyContainer>
</MkSpacer>
</template>
<script lang="ts" setup>
@ -42,4 +44,10 @@ const pagination = {
padding: calc(var(--margin) / 2) 0;
background: var(--bg);
}
.tl {
background: var(--bg);
border-radius: var(--radius);
overflow: clip;
}
</style>