haex/haex-hub-mirror
1
0
Fork 0
mirror of https://github.com/haexhub/haex-hub.git synced 2025-12-19 23:30:51 +01:00
Code Issues Packages Projects Releases Wiki Activity

item handling

Browse Source
This commit is contained in:
haex
2025-06-16 22:06:15 +02:00
parent 0b8f2c5532
commit 2972bb9e91
63 changed files with 3975 additions and 979 deletions
Download Patch File Download Diff File Expand all files Collapse all files

88
src/layouts/app.vue
View File

@ -1,7 +1,7 @@
<template>
<div class="h-full w-full flex flex-col overflow-hidden">
<nav
class="navbar bg-base-100 rounded-b max-sm:shadow border-b border-base-content/25 sm:z-20 relative px-2 py-0 sm:py-2"
class="navbar rounded-b max-sm:shadow border-b border-base-content/25 sm:z-20 relative px-2 py-0 sm:py-2"
>
<UiTooltip :tooltip="isVisible ? t('sidebar.close') : t('sidebar.show')">
<button
@ -35,82 +35,8 @@
</NuxtLinkLocale>
</div>
<div class="navbar-end flex items-center gap-4 me-4">
<div
class="dropdown relative inline-flex [--auto-close:inside] [--offset:18] [--placement:bottom]"
>
<UiTooltip :tooltip="t('notifications.label')">
<button
id="dropdown-scrollable"
type="button"
class="dropdown-toggle btn btn-text btn-circle dropdown-open:bg-base-content/10 size-10"
aria-haspopup="menu"
aria-expanded="false"
aria-label="Dropdown"
>
<div class="indicator">
<span
v-show="notifications.length"
class="indicator-item bg-error size-2 rounded-full text-sm"
/>
<span
class="icon-[tabler--bell] text-base-content size-[1.375rem]"
/>
</div>
</button>
</UiTooltip>
<div
class="dropdown-menu dropdown-open:opacity-100 hidden w-full max-w-96 shadow"
role="menu"
aria-orientation="vertical"
aria-labelledby="dropdown-scrollable"
>
<div class="dropdown-header justify-center">
<h6 class="text-base-content text-base">
{{ t('notifications.label') }}
</h6>
</div>
<div
class="vertical-scrollbar horizontal-scrollbar rounded-scrollbar text-base-content/80 max-h-56 overflow-auto"
>
<div
v-for="notification in notifications"
:key="notification.id"
class="dropdown-item"
>
<div class="avatar">
<div class="w-10 rounded-full">
<img
v-if="notification.image"
:src="notification.image"
:alt="notification.alt ?? 'notification avatar'"
/>
<Icon
v-else-if="notification.icon"
:name="notification.icon"
/>
</div>
</div>
<div class="w-60">
<h6 class="truncate text-base">
{{ notification.title }}
</h6>
<small class="text-base-content/50 truncate">
{{ notification.text }}
</small>
</div>
</div>
</div>
<NuxtLinkLocale
:to="{ name: 'notifications' }"
class="dropdown-footer justify-center gap-1 hover:bg-base-content/10"
>
<span class="icon-[tabler--eye] size-4" />
{{ t('notifications.view_all') }}
</NuxtLinkLocale>
</div>
</div>
<div class="flex items-center gap-4 me-4">
<HaexMenuNotifications />
<HaexMenuMain />
</div>
</nav>
@ -154,8 +80,6 @@ const { currentVaultName } = storeToRefs(useVaultStore())
const { menu, isVisible } = storeToRefs(useSidebarStore())
const { notifications } = storeToRefs(useNotificationStore())
const { extensionLinks } = storeToRefs(useExtensionsStore())
const toogleSidebar = () => {
@ -165,18 +89,12 @@ const toogleSidebar = () => {
<i18n lang="yaml">
de:
notifications:
label: Benachrichtigungen
view_all: Alle ansehen
vault:
close: Vault schließen
sidebar:
close: Sidebar ausblenden
show: Sidebar anzeigen
en:
notifications:
label: Notifications
view_all: View all
vault:
close: Close vault
sidebar: