diff options
Diffstat (limited to 'src/components/notifications/notifications.vue')
| -rw-r--r-- | src/components/notifications/notifications.vue | 39 |
1 files changed, 34 insertions, 5 deletions
diff --git a/src/components/notifications/notifications.vue b/src/components/notifications/notifications.vue index b46c06aa..3d5878d4 100644 --- a/src/components/notifications/notifications.vue +++ b/src/components/notifications/notifications.vue @@ -1,6 +1,11 @@ <template> - <teleport :disabled="minimalMode || disableTeleport" :to="teleportTarget"> - <div + <teleport + :disabled="minimalMode || disableTeleport" + :to="teleportTarget" + > + <component + :is="noHeading ? 'div' : 'aside'" + ref="root" :class="{ minimal: minimalMode }" class="Notifications" > @@ -16,19 +21,43 @@ class="badge badge-notification unseen-count" >{{ unseenCount }}</span> </div> + <div + class="rightside-button" + v-if="showScrollTop" + > + <button + class="button-unstyled scroll-to-top-button" + type="button" + :title="$t('general.scroll_to_top')" + @click="scrollToTop" + > + <FALayers class="fa-scale-110 fa-old-padding-layer"> + <FAIcon icon="arrow-up" /> + <FAIcon + icon="minus" + transform="up-7" + /> + </FALayers> + </button> + </div> <button v-if="unseenCount" class="button-default read-button" + type="button" @click.prevent="markAsSeen" > {{ $t('notifications.read') }} </button> - <NotificationFilters /> + <NotificationFilters class="rightside-button" /> </div> - <div class="panel-body"> + <div + class="panel-body" + role="feed" + > <div v-for="notification in notificationsToDisplay" :key="notification.id" + role="listitem" class="notification" :class="{unseen: !minimalMode && !notification.seen}" > @@ -64,7 +93,7 @@ </div> </div> </div> - </div> + </component> </teleport> </template> |