jjkiers/cloudron-box
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

Small dashboard polishing

Browse Source
This commit is contained in:
Johannes Zellner
2025-04-08 14:23:54 +02:00
parent 8cdae41051
commit 3614812680
5 changed files with 28 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
dashboard/src/components/Headerbar.vue
View File

@@ -62,7 +62,7 @@ onMounted(async () => {
<div class="headerbar">
<Popover ref="notificationPopover" :width="'min(80%, 400px)'" :height="'min(80%, 600px)'">
<div style="padding: 10px; display: flex; flex-direction: column; overflow: hidden; height: 100%;">
<div style="overflow: auto; margin-bottom: 10px">
<div v-if="notifications.length" style="overflow: auto; margin-bottom: 10px">
<div class="notification-item" v-for="notification in notifications" :key="notification.id">
<div class="notification-item-title" @click="notification.isCollapsed = !notification.isCollapsed">
{{ notification.title }}
@@ -74,7 +74,10 @@ onMounted(async () => {
</div>
</div>
</div>
<Button @click="onMarkAllNotificationRead()" :loading="notificationsAllBusy" :disabled="notificationsAllBusy">{{ $t('notifications.markAllAsRead') }}</Button>
<Button v-if="notifications.length" @click="onMarkAllNotificationRead()" :loading="notificationsAllBusy" :disabled="notificationsAllBusy">{{ $t('notifications.markAllAsRead') }}</Button>
<div v-if="notifications.length === 0" class="notification-item-empty-placeholder">
{{ $t('notifications.allCaughtUp') }}
</div>
</div>
</Popover>
@@ -140,10 +143,7 @@ onMounted(async () => {
display: flex;
justify-content: space-between;
align-items: center;
}
.notification-item:hover .notification-item-title {
font-weight: bold;
gap: 6px;
}
.notification-read-button {