diff options
Diffstat (limited to 'packages/frontend/src/components/SkNoteHeader.vue')
| -rw-r--r-- | packages/frontend/src/components/SkNoteHeader.vue | 19 |
1 files changed, 10 insertions, 9 deletions
diff --git a/packages/frontend/src/components/SkNoteHeader.vue b/packages/frontend/src/components/SkNoteHeader.vue index d3ecdf17bb..7dc4c8f019 100644 --- a/packages/frontend/src/components/SkNoteHeader.vue +++ b/packages/frontend/src/components/SkNoteHeader.vue @@ -15,7 +15,7 @@ SPDX-License-Identifier: AGPL-3.0-only </MkA> <div v-if="note.user.isBot" :class="$style.isBot">bot</div> <div v-if="note.user.badgeRoles" :class="$style.badgeRoles"> - <img v-for="role in note.user.badgeRoles" :key="role.id" v-tooltip="role.name" :class="$style.badgeRole" :src="role.iconUrl"/> + <img v-for="(role, i) in note.user.badgeRoles" :key="i" v-tooltip="role.name" :class="$style.badgeRole" :src="role.iconUrl!"/> </div> </div> <div :class="$style.username"><MkAcct :user="note.user"/></div> @@ -33,7 +33,7 @@ SPDX-License-Identifier: AGPL-3.0-only <i v-else-if="note.visibility === 'followers'" class="ph-lock ph-bold ph-lg"></i> <i v-else-if="note.visibility === 'specified'" ref="specified" class="ph-envelope ph-bold ph-lg"></i> </span> - <span v-if="note.updatedAt" ref="menuVersionsButton" style="margin-left: 0.5em; cursor: pointer;" title="Edited" @mousedown="menuVersions()"><i class="ph-pencil ph-bold ph-lg"></i></span> + <span v-if="note.updatedAt" ref="menuVersionsButton" style="margin-left: 0.5em; cursor: pointer;" title="Edited" @mousedown="menuVersions()"><i class="ph-pencil-simple ph-bold ph-lg"></i></span> <span v-if="note.localOnly" style="margin-left: 0.5em;" :title="i18n.ts._visibility['disableFederation']"><i class="ph-rocket ph-bold ph-lg"></i></span> <span v-if="note.channel" style="margin-left: 0.5em;" :title="note.channel.name"><i class="ph-television ph-bold ph-lg"></i></span> </div> @@ -65,7 +65,7 @@ SPDX-License-Identifier: AGPL-3.0-only <i v-else-if="note.visibility === 'followers'" class="ph-lock ph-bold ph-lg"></i> <i v-else-if="note.visibility === 'specified'" ref="specified" class="ph-envelope ph-bold ph-lg"></i> </span> - <span v-if="note.updatedAt" ref="menuVersionsButton" style="margin-left: 0.5em; cursor: pointer;" title="Edited" @mousedown="menuVersions()"><i class="ph-pencil ph-bold ph-lg"></i></span> + <span v-if="note.updatedAt" ref="menuVersionsButton" style="margin-left: 0.5em; cursor: pointer;" title="Edited" @mousedown="menuVersions()"><i class="ph-pencil-simple ph-bold ph-lg"></i></span> <span v-if="note.localOnly" style="margin-left: 0.5em;" :title="i18n.ts._visibility['disableFederation']"><i class="ph-rocket ph-bold ph-lg"></i></span> <span v-if="note.channel" style="margin-left: 0.5em;" :title="note.channel.name"><i class="ph-television ph-bold ph-lg"></i></span> </div> @@ -82,7 +82,7 @@ import { getNoteVersionsMenu } from '@/scripts/get-note-versions-menu.js'; import SkInstanceTicker from '@/components/SkInstanceTicker.vue'; import { popupMenu } from '@/os.js'; import { defaultStore } from '@/store.js'; -import { useRouter } from '@/router.js'; +import { useRouter } from '@/router/supplier.js'; import { deviceKind } from '@/scripts/device-kind.js'; const props = defineProps<{ @@ -116,6 +116,8 @@ const mock = inject<boolean>('mock', false); .root { display: flex; cursor: auto; /* not clickToOpen-able */ + min-height: 100%; + align-items: center; } .classicRoot { @@ -135,6 +137,7 @@ const mock = inject<boolean>('mock', false); display: flex; align-items: flex-end; margin-left: auto; + margin-bottom: auto; padding-left: 10px; overflow: clip; } @@ -143,10 +146,9 @@ const mock = inject<boolean>('mock', false); .name { flex-shrink: 1; display: block; - // note, these margin top values were done by hand may need futher checking if it actualy aligns pixel perfect - margin: 3px .5em 0 0; + margin: 0 .5em 0 0; padding: 0; - overflow: scroll; + overflow: hidden; overflow-wrap: anywhere; font-size: 1em; font-weight: bold; @@ -192,8 +194,7 @@ const mock = inject<boolean>('mock', false); .username { flex-shrink: 9999999; - // note these top margins were made to align with the instance ticker - margin: 4px .5em 0 0; + margin: 0 .5em 0 0; overflow: hidden; text-overflow: ellipsis; font-size: .95em; |