feat(quicksearch): bouton retour visible depuis une note de commandes
Fleche a la place de la loupe et Retour arriere sur champ vide, en plus d'Esc qui ne se voyait pas. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
@@ -1986,6 +1986,7 @@ input[type="range"]::-webkit-slider-thumb {
|
|||||||
.so-cmds-row { display: flex; align-items: center; gap: 8px; padding: 4px 8px; border: 1px solid var(--border); border-radius: 6px; }
|
.so-cmds-row { display: flex; align-items: center; gap: 8px; padding: 4px 8px; border: 1px solid var(--border); border-radius: 6px; }
|
||||||
.so-cmds-cmd { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }
|
.so-cmds-cmd { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }
|
||||||
.so-cmds-empty { font-size: 12px; color: var(--text-dim); }
|
.so-cmds-empty { font-size: 12px; color: var(--text-dim); }
|
||||||
|
#qsBack { flex-shrink: 0; }
|
||||||
.qs-cmd { font-family: ui-monospace, Consolas, monospace; font-size: 13px; }
|
.qs-cmd { font-family: ui-monospace, Consolas, monospace; font-size: 13px; }
|
||||||
|
|
||||||
/* ---- + New dropdown ---------------------------------- */
|
/* ---- + New dropdown ---------------------------------- */
|
||||||
|
|||||||
+3
-1
@@ -1233,7 +1233,9 @@
|
|||||||
<div class="modal-backdrop" data-close></div>
|
<div class="modal-backdrop" data-close></div>
|
||||||
<div class="modal-panel modal-panel-sm quick-search-panel">
|
<div class="modal-panel modal-panel-sm quick-search-panel">
|
||||||
<div class="quick-search-input">
|
<div class="quick-search-input">
|
||||||
<svg><use href="#i-search"/></svg>
|
<!-- Retour a la liste des entrees, visible dans une note de commandes. -->
|
||||||
|
<button type="button" class="icon-btn icon-btn-sm" id="qsBack" title="Back to entries (Esc)" hidden><svg class="so-hist-back"><use href="#i-chevron-down"/></svg></button>
|
||||||
|
<svg id="qsSearchIcon"><use href="#i-search"/></svg>
|
||||||
<input id="quickSearchInput" type="text"
|
<input id="quickSearchInput" type="text"
|
||||||
placeholder="Search…"
|
placeholder="Search…"
|
||||||
autocomplete="off">
|
autocomplete="off">
|
||||||
|
|||||||
@@ -8932,6 +8932,9 @@ async function init() {
|
|||||||
e.stopPropagation();
|
e.stopPropagation();
|
||||||
if (qsCommands) { qsLeaveCommands(); return; } // liste -> entrees
|
if (qsCommands) { qsLeaveCommands(); return; } // liste -> entrees
|
||||||
closeQuickSearchModal();
|
closeQuickSearchModal();
|
||||||
|
} else if (e.key === 'Backspace' && qsCommands && !qsInput.value) {
|
||||||
|
e.preventDefault();
|
||||||
|
qsLeaveCommands(); // retour, comme Esc
|
||||||
} else if (e.key === 'ArrowDown') {
|
} else if (e.key === 'ArrowDown') {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
if (rows.length) { quickSearchSelected++; quickSearchRender(); }
|
if (rows.length) { quickSearchSelected++; quickSearchRender(); }
|
||||||
|
|||||||
+11
-1
@@ -54,7 +54,7 @@ function qsLeaveCommands() {
|
|||||||
qsCommands = null;
|
qsCommands = null;
|
||||||
const input = document.getElementById('quickSearchInput');
|
const input = document.getElementById('quickSearchInput');
|
||||||
input.value = '';
|
input.value = '';
|
||||||
input.placeholder = 'Search and press Enter to copy password…';
|
input.placeholder = 'Search…';
|
||||||
quickSearchSelected = 0;
|
quickSearchSelected = 0;
|
||||||
qsApplyMode();
|
qsApplyMode();
|
||||||
quickSearchRender();
|
quickSearchRender();
|
||||||
@@ -125,6 +125,10 @@ function qsApplyMode() {
|
|||||||
box.querySelectorAll('[data-qsmode]').forEach(b =>
|
box.querySelectorAll('[data-qsmode]').forEach(b =>
|
||||||
b.classList.toggle('is-on', (b.dataset.qsmode === 'fill') === qsFills()));
|
b.classList.toggle('is-on', (b.dataset.qsmode === 'fill') === qsFills()));
|
||||||
}
|
}
|
||||||
|
const back = document.getElementById('qsBack');
|
||||||
|
if (back) back.hidden = !qsCommands;
|
||||||
|
const ico = document.getElementById('qsSearchIcon');
|
||||||
|
if (ico) ico.style.display = qsCommands ? 'none' : '';
|
||||||
const hintEl = document.querySelector('#quickSearchModal .quick-search-hint');
|
const hintEl = document.querySelector('#quickSearchModal .quick-search-hint');
|
||||||
if (hintEl && qsCommands) {
|
if (hintEl && qsCommands) {
|
||||||
hintEl.textContent = qsFills()
|
hintEl.textContent = qsFills()
|
||||||
@@ -138,6 +142,12 @@ function qsApplyMode() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
document.addEventListener('click', ev => {
|
document.addEventListener('click', ev => {
|
||||||
|
if (ev.target.closest && ev.target.closest('#qsBack')) {
|
||||||
|
ev.stopPropagation();
|
||||||
|
qsLeaveCommands();
|
||||||
|
document.getElementById('quickSearchInput').focus();
|
||||||
|
return;
|
||||||
|
}
|
||||||
const b = ev.target.closest && ev.target.closest('[data-qsmode]');
|
const b = ev.target.closest && ev.target.closest('[data-qsmode]');
|
||||||
if (!b) return;
|
if (!b) return;
|
||||||
quickSearchPreferCopy = b.dataset.qsmode === 'copy';
|
quickSearchPreferCopy = b.dataset.qsmode === 'copy';
|
||||||
|
|||||||
Reference in New Issue
Block a user