forked from mirror/misskey
feat: show header with current user avatar on TL (#9051)
* feat: show header with current user avatar on TL * refactor(client): use displayMyAvatar prop instead of metadata * refactor(client): prefer v-if to `display: none;`
This commit is contained in:
parent
8a09de6b28
commit
c97dc7fe93
@ -1,5 +1,8 @@
|
||||
<template>
|
||||
<div v-if="show" ref="el" class="fdidabkb" :class="{ slim: narrow, thin: thin_ }" :style="{ background: bg }" @click="onClick">
|
||||
<div v-if="narrow" class="buttons left">
|
||||
<MkAvatar v-if="props.displayMyAvatar && $i" class="avatar" :user="$i" :disable-preview="true"/>
|
||||
</div>
|
||||
<template v-if="metadata">
|
||||
<div v-if="!hideTitle" class="titleContainer" @click="showTabsPopup">
|
||||
<MkAvatar v-if="metadata.avatar" class="avatar" :user="metadata.avatar" :disable-preview="true" :show-indicator="true"/>
|
||||
@ -41,6 +44,7 @@ import { scrollToTop } from '@/scripts/scroll';
|
||||
import { i18n } from '@/i18n';
|
||||
import { globalEvents } from '@/events';
|
||||
import { injectPageMetadata } from '@/scripts/page-metadata';
|
||||
import { $i } from '@/account';
|
||||
|
||||
type Tab = {
|
||||
key?: string | null;
|
||||
@ -59,6 +63,7 @@ const props = defineProps<{
|
||||
handler: (ev: MouseEvent) => void;
|
||||
}[];
|
||||
thin?: boolean;
|
||||
displayMyAvatar?: boolean;
|
||||
}>();
|
||||
|
||||
const emit = defineEmits<{
|
||||
@ -197,7 +202,6 @@ onUnmounted(() => {
|
||||
> .titleContainer {
|
||||
flex: 1;
|
||||
margin: 0 auto;
|
||||
margin-left: var(--height);
|
||||
|
||||
> *:first-child {
|
||||
margin-left: auto;
|
||||
@ -213,9 +217,24 @@ onUnmounted(() => {
|
||||
--margin: 8px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
min-width: var(--height);
|
||||
height: var(--height);
|
||||
margin: 0 var(--margin);
|
||||
|
||||
&.left {
|
||||
margin-right: auto;
|
||||
|
||||
> .avatar {
|
||||
$size: 32px;
|
||||
display: inline-block;
|
||||
width: $size;
|
||||
height: $size;
|
||||
vertical-align: bottom;
|
||||
margin: 0 8px;
|
||||
pointer-events: none;
|
||||
}
|
||||
}
|
||||
|
||||
&.right {
|
||||
margin-left: auto;
|
||||
}
|
||||
|
@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<MkStickyContainer>
|
||||
<template #header><MkPageHeader v-model:tab="src" :actions="headerActions" :tabs="headerTabs"/></template>
|
||||
<template #header><MkPageHeader v-model:tab="src" :actions="headerActions" :tabs="headerTabs" :display-my-avatar="true"/></template>
|
||||
<MkSpacer :content-max="800">
|
||||
<div ref="rootEl" v-hotkey.global="keymap" class="cmuxhskf">
|
||||
<XTutorial v-if="$store.reactiveState.tutorial.value != -1" class="tutorial _block"/>
|
||||
|
Loading…
Reference in New Issue
Block a user