eightequal/AstralRinth
1
0
Fork 0
forked from didirus/AstralRinth
Code Pull Requests Activity

Fix notification & follow list sorting, Add notification badge + loading animation (#206)

Browse Source 
* Order notifications and followed mods

Fixes modrinth/knossos#195

* Add user notification badge on avatar

Closes modrinth/knossos#145

* Add loading animation

* Chain calls, remove console.log

* Chain calls

* Fix formatting to match prettier

* Remove unused userFollows

* Create user vuex store

* Add notification count indication on dashboard

* Fix background for light mode

* Move delay check to action, add force parameter

* Slightly decrease notification badge opacity on dashboard

* Remove SVG for image masking, use border around bubble

Also adds CSS for when the dropdown is opened/hovered

* Fix merge conflicts

Co-authored-by: Geometrically <18202329+Geometrically@users.noreply.github.com>
This commit is contained in:
venashial
2021-05-27 09:32:34 -07:00
committed by GitHub
parent 4d64df37f5
commit 2c22837d9f
11 changed files with 287 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
pages/dashboard.vue
View File

@@ -10,6 +10,9 @@
<nuxt-link :to="'/dashboard/notifications'" class="tab last">
<NotificationsIcon />
Notifications
<div v-if="this.$user.notifications.count > 0" class="notif-count">
{{ this.$user.notifications.count }}
</div>
</nuxt-link>
<nuxt-link :to="'/dashboard/follows'" class="tab last">
<FollowIcon />
@@ -88,4 +91,17 @@ export default {
.hideSmall {
padding-top: 0;
}
.notif-count {
display: flex;
justify-content: center;
align-items: center;
background-color: rgba(180, 180, 180, 0.4);
border-radius: 2rem;
padding: 0.1rem 0.35rem;
margin: 0 0.2rem 0 auto;
font-size: 0.9rem;
}
</style>