fs
ae509c607b
Use Stripe pattern: outline icons by default, filled for active state (bookmarks bookmarked, notifications unread). Remove chevron arrows from tenant/user dropdowns. Add max-width with ellipsis to breadcrumb items to prevent overflow. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
49 lines
2.5 KiB
PHTML
49 lines
2.5 KiB
PHTML
<?php
|
|
|
|
$layoutNav = is_array($layoutNav ?? null) ? $layoutNav : [];
|
|
$notifNav = is_array($layoutNav['notifications.nav'] ?? null) ? $layoutNav['notifications.nav'] : [];
|
|
$unreadCount = (int) ($notifNav['unread_count'] ?? 0);
|
|
?>
|
|
<li>
|
|
<details class="dropdown app-topbar-notification-menu" data-notification-bell data-summary-chevron="none">
|
|
<summary
|
|
aria-label="<?php e(t('Notifications')); ?>"
|
|
>
|
|
<i class="bi <?php e($unreadCount > 0 ? 'bi-bell-fill' : 'bi-bell'); ?>"></i>
|
|
<?php if ($unreadCount > 0): ?>
|
|
<span class="app-notification-badge" data-notification-badge><?php e($unreadCount > 99 ? '99+' : $unreadCount); ?></span>
|
|
<?php else: ?>
|
|
<span class="app-notification-badge" data-notification-badge style="display:none;"></span>
|
|
<?php endif; ?>
|
|
</summary>
|
|
<ul class="app-topbar-menu-list app-topbar-menu-list--right app-notification-dropdown" data-notification-dropdown
|
|
data-label-dismiss="<?php e(t('Dismiss')); ?>"
|
|
data-label-mark-read="<?php e(t('Mark as read')); ?>">
|
|
<li class="app-notification-dropdown__header">
|
|
<span class="app-notification-dropdown__title"><?php e(t('Notifications')); ?></span>
|
|
<button type="button" class="app-notification-dropdown__mark-all" data-notification-mark-all>
|
|
<?php e(t('Mark all as read')); ?>
|
|
</button>
|
|
</li>
|
|
<li class="app-notification-dropdown__body" data-notification-list>
|
|
<div class="app-notification-loading" data-notification-loading style="display:none;">
|
|
<span class="app-notification-loading__spinner"></span>
|
|
<span class="app-notification-loading__text"><?php e(t('Loading notifications…')); ?></span>
|
|
</div>
|
|
<div class="app-notification-error" data-notification-error style="display:none;">
|
|
<i class="bi bi-exclamation-triangle"></i>
|
|
<span><?php e(t('Failed to load notifications')); ?></span>
|
|
</div>
|
|
<?php
|
|
$emptyState = [
|
|
'message' => t('No notifications'),
|
|
'size' => 'compact',
|
|
'icon' => false,
|
|
];
|
|
require templatePath('partials/app-empty-state.phtml');
|
|
?>
|
|
</li>
|
|
</ul>
|
|
</details>
|
|
</li>
|