jason/ThunderAI
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

popup menu graphics fixed. see #130

Browse source
This commit is contained in:
mic 2024-09-22 21:55:55 +02:00
parent f4d51a9540
commit c9bd836af2
3 changed files with 12 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
popup/mzta-popup.css
View file

@ -11,11 +11,12 @@ body {
width: fit-content; width: fit-content;
height: fit-content; height: fit-content;
display: flex; display: flex;
flex-direction: column;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
position: relative; position: relative;
width: 10em; width: 10em;
max-height: 12em; max-height: 13em;
min-height: 1em; min-height: 1em;
padding: 0; padding: 0;
} }
@ -29,9 +30,13 @@ body {
z-index: 1001; z-index: 1001;
font-size: 13px; font-size: 13px;
} }
._spacer_div{
width: 100%;
height: 2.1em;
}
#mzta_autocomplete-items { #mzta_autocomplete-items {
margin-top: 1.5em;
border: none; border: none;
z-index: 1000; z-index: 1000;
background-color: #FAFAFA; background-color: #FAFAFA;

1
popup/mzta-popup.html
View file

@ -9,6 +9,7 @@
<body> <body>
<div id="mzta_search_banner"> <div id="mzta_search_banner">
<div class="_spacer_div">&nbsp;</div>
<input type="text" id="mzta_search_input" placeholder="__MSG_SearchPrompt__"> <input type="text" id="mzta_search_input" placeholder="__MSG_SearchPrompt__">
<div id="mzta_autocomplete-items" style="display: none;"></div> <div id="mzta_autocomplete-items" style="display: none;"></div>
</div> </div>

4
popup/mzta-popup.js
View file

@ -36,6 +36,7 @@ async function searchPrompt(allPrompts, tabId, tabType){
let input = document.getElementById('mzta_search_input'); let input = document.getElementById('mzta_search_input');
let autocompleteList = document.getElementById('mzta_autocomplete-items'); let autocompleteList = document.getElementById('mzta_autocomplete-items');
let _spacer_div = document.getElementById('_spacer_div');
let banner = document.getElementById('mzta_search_banner'); let banner = document.getElementById('mzta_search_banner');
// Initialize variables to track focus and selection // Initialize variables to track focus and selection
@ -66,6 +67,7 @@ async function searchPrompt(allPrompts, tabId, tabType){
if (filteredData.length === 0) { if (filteredData.length === 0) {
autocompleteList.style.display = 'none'; autocompleteList.style.display = 'none';
_spacer_div.style.display = 'none';
return; return;
} }
@ -95,12 +97,14 @@ async function searchPrompt(allPrompts, tabId, tabType){
selectedId = item.id; // Store the selected item's ID selectedId = item.id; // Store the selected item's ID
console.log('>>>>>>>>>>>>> mousedown selectedId:', selectedId); console.log('>>>>>>>>>>>>> mousedown selectedId:', selectedId);
autocompleteList.style.display = 'none'; autocompleteList.style.display = 'none';
_spacer_div.style.display = 'none';
}); });
autocompleteList.appendChild(itemDiv); autocompleteList.appendChild(itemDiv);
}); });
autocompleteList.style.display = 'block'; autocompleteList.style.display = 'block';
_spacer_div.style.display = 'block';
}); });
// Add a keydown event listener to handle arrow navigation and selection // Add a keydown event listener to handle arrow navigation and selection