fa/breadcrumb-the-shire
1
0
Fork 1
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

feat(search): refresh global search UI and align qa/docs updates

Browse Source
This commit is contained in:
Felix Schneider
2026-04-02 10:49:35 +02:00
parent 5699bc6c5b
commit 5d07236758
35 changed files with 504 additions and 213 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
templates/partials/app-search-dialog.phtml
View File

@@ -11,11 +11,10 @@
data-app-component="global-search"
data-search-endpoint="<?php e(lurl('admin/search/data')); ?>"
data-search-results-page="<?php e(lurl('search')); ?>"
aria-labelledby="app-search-dialog-title"
aria-label="<?php e(t('Search')); ?>"
>
<article class="app-dialog-lg app-search-dialog">
<header class="app-search-dialog-header">
<h2 id="app-search-dialog-title" class="visually-hidden"><?php e(t('Search')); ?></h2>
<form class="app-search-dialog-form" autocomplete="off">
<i class="bi bi-search app-search-dialog-icon" aria-hidden="true"></i>
<input
@@ -23,26 +22,24 @@
name="search-dialog-input"
id="search-dialog-input"
class="app-search-dialog-input"
placeholder="<?php e(t('Search...')); ?>"
placeholder="<?php e(t('Search users, tenants, pages...')); ?>"
aria-label="<?php e(t('Search')); ?>"
aria-autocomplete="list"
aria-controls="app-search-dialog-results"
autocomplete="off"
>
<kbd class="app-search-dialog-shortcut" data-search-shortcut aria-hidden="true"></kbd>
</form>
<button type="button" class="close" data-app-search-dialog-close aria-label="<?php e(t('Close')); ?>" title="<?php e(t('Close')); ?>"></button>
</header>
<div class="app-search-dialog-body">
<div class="app-search-dialog-empty-state" data-search-dialog-empty data-no-results-text="<?php e(t('No results found')); ?>">
<p class="muted"><?php e(t('To start searching, type in the search field.')); ?></p>
<small class="muted" data-search-empty-hint-template="<?php e(t('Tip: Use {shortcut} to focus search quickly.')); ?>"></small>
<p class="muted"><?php e(t('Users, tenants, departments, roles and more')); ?></p>
</div>
<div class="app-search-dialog-loading" data-search-dialog-loading hidden>
<p class="muted" aria-live="polite"><?php e(t('Searching...')); ?></p>
</div>
<div class="app-search-dialog-error" data-search-dialog-error hidden>
<p class="muted"><?php e(t('Search failed. Please try again.')); ?></p>
<p class="muted" aria-live="assertive"><?php e(t('Search failed. Please try again.')); ?></p>
</div>
<ul
id="app-search-dialog-results"
@@ -58,8 +55,10 @@
<?php e(t('View all results')); ?>
<i class="bi bi-arrow-right" aria-hidden="true"></i>
</a>
<span class="app-search-dialog-footer-hint muted">
<kbd>Esc</kbd> <?php e(t('to close')); ?>
<span class="app-search-dialog-footer-hint muted" aria-hidden="true">
<kbd>↑↓</kbd> <?php e(t('navigate')); ?>
<kbd>↵</kbd> <?php e(t('open')); ?>
<kbd>Esc</kbd> <?php e(t('close')); ?>
</span>
</footer>
</article>