diff options
| author | piuvas <piuvas@proton.me> | 2024-11-05 20:22:56 -0300 |
|---|---|---|
| committer | piuvas <piuvas@proton.me> | 2024-11-05 20:22:56 -0300 |
| commit | e0a2e7aedc84f8a6f2b56f20edbe72ba800d48b1 (patch) | |
| tree | f35093e597da732c2ee2414a0ccce537154276e6 | |
| parent | merge: Revert "Experimental: dont mark backfetched notes as silent" (!703) (diff) | |
| download | sharkey-e0a2e7aedc84f8a6f2b56f20edbe72ba800d48b1.tar.gz sharkey-e0a2e7aedc84f8a6f2b56f20edbe72ba800d48b1.tar.bz2 sharkey-e0a2e7aedc84f8a6f2b56f20edbe72ba800d48b1.zip | |
animations following feed
| -rw-r--r-- | packages/frontend/src/pages/following-feed.vue | 17 |
1 files changed, 16 insertions, 1 deletions
diff --git a/packages/frontend/src/pages/following-feed.vue b/packages/frontend/src/pages/following-feed.vue index d45f572739..d4bc295c78 100644 --- a/packages/frontend/src/pages/following-feed.vue +++ b/packages/frontend/src/pages/following-feed.vue @@ -23,7 +23,7 @@ SPDX-License-Identifier: AGPL-3.0-only <template #default="{ items: notes }"> <MkDateSeparatedList v-slot="{ item: note }" :items="notes" :class="$style.panel" :noGap="true"> - <SkFollowingFeedEntry v-if="!isHardMuted(note)" :isMuted="isSoftMuted(note)" :note="note" @select="userSelected"/> + <SkFollowingFeedEntry v-if="!isHardMuted(note)" :isMuted="isSoftMuted(note)" :note="note" :class="selectedUserId == note.userId && $style.selected" @select="userSelected"/> </MkDateSeparatedList> </template> </MkPagination> @@ -257,6 +257,21 @@ definePageMetadata(() => ({ margin-bottom: 12px; } +@keyframes border { + from {border-left: 0px solid var(--accent);} + to {border-left: 6px solid var(--accent);} +} + +.selected { + animation: border 0.2s ease-out 0s 1 forwards; + &:first-child { + border-top-left-radius: 5px; + } + &:last-child { + border-bottom-left-radius: 5px; + } +} + @media (min-width: 750px) { .root { grid-template-columns: min-content 4fr 6fr min-content; |