summaryrefslogtreecommitdiff
path: root/packages/frontend/src/components
diff options
context:
space:
mode:
authorVolpeon <git@volpeon.ink>2024-01-03 14:42:51 +0100
committerVolpeon <git@volpeon.ink>2024-01-03 14:42:51 +0100
commit1ca0cd727e3fc14e88f4cc2c60472a2616bf9efa (patch)
tree95b51a46b122d42b9a341decd9212091fa361d38 /packages/frontend/src/components
parentPorted Firefish's note focus behavior (diff)
downloadsharkey-1ca0cd727e3fc14e88f4cc2c60472a2616bf9efa.tar.gz
sharkey-1ca0cd727e3fc14e88f4cc2c60472a2616bf9efa.tar.bz2
sharkey-1ca0cd727e3fc14e88f4cc2c60472a2616bf9efa.zip
Hover effect for conversation notes (like Firefish)
Diffstat (limited to 'packages/frontend/src/components')
-rw-r--r--packages/frontend/src/components/SkNoteDetailed.vue2
-rw-r--r--packages/frontend/src/components/SkNoteSub.vue21
2 files changed, 21 insertions, 2 deletions
diff --git a/packages/frontend/src/components/SkNoteDetailed.vue b/packages/frontend/src/components/SkNoteDetailed.vue
index 3087eee164..4a06e8f56a 100644
--- a/packages/frontend/src/components/SkNoteDetailed.vue
+++ b/packages/frontend/src/components/SkNoteDetailed.vue
@@ -43,7 +43,7 @@ SPDX-License-Identifier: AGPL-3.0-only
<SkNoteSub v-for="note in conversation" :key="note.id" :class="$style.replyToMore" :note="note" :expandAllCws="props.expandAllCws"/>
</template>
<SkNoteSub v-if="appearNote.reply" :note="appearNote.reply" :class="$style.replyTo" :expandAllCws="props.expandAllCws"/>
- <article ref="noteEl" :class="$style.note" tabindex="-1" @contextmenu.stop="onContextmenu">
+ <article :id="appearNote.id" ref="noteEl" :class="$style.note" tabindex="-1" @contextmenu.stop="onContextmenu">
<header :class="$style.noteHeader">
<MkAvatar :class="$style.noteHeaderAvatar" :user="appearNote.user" indicator link preview/>
<div style="display: flex; align-items: center; white-space: nowrap; overflow: hidden;">
diff --git a/packages/frontend/src/components/SkNoteSub.vue b/packages/frontend/src/components/SkNoteSub.vue
index 79e171f34c..c0c50670d1 100644
--- a/packages/frontend/src/components/SkNoteSub.vue
+++ b/packages/frontend/src/components/SkNoteSub.vue
@@ -461,7 +461,26 @@ if (props.detail) {
}
.main {
- display: flex;
+ position: relative;
+ display: flex;
+
+ &::after {
+ content: "";
+ position: absolute;
+ top: -12px;
+ right: -12px;
+ left: -12px;
+ bottom: -12px;
+ background: var(--panelHighlight);
+ border-radius: var(--radius);
+ opacity: 0;
+ transition: opacity .2s, background .2s;
+ z-index: -1;
+ }
+
+ &:hover::after {
+ opacity: 1;
+ }
}
.colorBar {