summaryrefslogtreecommitdiff
path: root/packages/frontend/src/components/SkNoteSub.vue
diff options
context:
space:
mode:
authorShittyKopper <shittykopper@w.on-t.work>2024-02-03 15:22:12 +0300
committerShittyKopper <shittykopper@w.on-t.work>2024-02-04 15:21:57 +0300
commit5ef8e3123bbc7ff1f28204a7bcd3f04db473e802 (patch)
tree426b2d261630109127a4b8de4f1318b1b2e8f357 /packages/frontend/src/components/SkNoteSub.vue
parentupd: expandAllCws also expands all long posts on first click (diff)
downloadsharkey-5ef8e3123bbc7ff1f28204a7bcd3f04db473e802.tar.gz
sharkey-5ef8e3123bbc7ff1f28204a7bcd3f04db473e802.tar.bz2
sharkey-5ef8e3123bbc7ff1f28204a7bcd3f04db473e802.zip
upd: only enable hover effect on SkNoteDetailed and replies
Diffstat (limited to 'packages/frontend/src/components/SkNoteSub.vue')
-rw-r--r--packages/frontend/src/components/SkNoteSub.vue10
1 files changed, 6 insertions, 4 deletions
diff --git a/packages/frontend/src/components/SkNoteSub.vue b/packages/frontend/src/components/SkNoteSub.vue
index 8d76c1e22c..ceb0057d63 100644
--- a/packages/frontend/src/components/SkNoteSub.vue
+++ b/packages/frontend/src/components/SkNoteSub.vue
@@ -4,7 +4,7 @@ SPDX-License-Identifier: AGPL-3.0-only
-->
<template>
-<div v-show="!isDeleted" v-if="!muted" ref="el" :class="[$style.root, { [$style.children]: depth > 1, [$style.replyRoot]: props.reply }]">
+<div v-show="!isDeleted" v-if="!muted" ref="el" :class="[$style.root, { [$style.children]: depth > 1, [$style.replyRoot]: props.reply, [$style.detailed]: props.detailed }]">
<div v-if="!hideLine" :class="$style.line"></div>
<div :class="$style.main">
<div v-if="note.channel" :class="$style.colorBar" :style="{ background: note.channel.color }"></div>
@@ -127,9 +127,11 @@ const props = withDefaults(defineProps<{
depth?: number;
reply?: boolean;
+ detailed?: boolean;
}>(), {
depth: 1,
reply: false,
+ detailed: false,
});
const el = shallowRef<HTMLElement>();
@@ -474,7 +476,7 @@ if (props.detail) {
position: relative;
display: flex;
- &::after {
+ :is(.detailed, .replyRoot) &::after {
content: "";
position: absolute;
top: -12px;
@@ -488,8 +490,8 @@ if (props.detail) {
z-index: -1;
}
- &:hover::after,
- &:focus-within::after {
+ :is(.detailed, .replyRoot) &:hover::after,
+ :is(.detailed, .replyRoot) &:focus-within::after {
opacity: 1;
}
}