search results box is the right size now

This commit is contained in:
2026-05-05 09:57:26 -04:00
parent 9042468fe8
commit b1b81a04ed
2 changed files with 34 additions and 12 deletions

View File

@@ -1645,19 +1645,16 @@ footer {
}
.search-results-dropdown {
position: absolute;
top: 100%;
left: 0;
right: 0;
margin-top: 0.3rem;
position: fixed;
background: var(--white);
border-radius: 12px;
box-shadow: 0 10px 40px rgba(0,0,0,0.2), 0 4px 10px rgba(255,20,147,0.15);
border: 2px solid var(--pink-200);
z-index: 10000;
z-index: 9999;
display: none;
max-height: 400px;
overflow-y: auto;
margin-top: 0.3rem;
}
.search-result-item {

View File

@@ -60,12 +60,6 @@ var Search = (function() {
// Insert after brand
brand.parentNode.insertBefore(searchWrapper, brand.nextSibling);
// Move results container inside search wrapper for correct absolute positioning
var existingContainer = document.getElementById('searchResultsContainer');
if (existingContainer) {
searchWrapper.appendChild(existingContainer);
}
currentInput = searchInput;
// Event listeners
@@ -118,6 +112,25 @@ var Search = (function() {
hideDropdown();
}
});
// Reposition on scroll and resize
function positionDropdown() {
var container = document.getElementById('searchResultsContainer');
if (!container || !dropdownVisible) return;
var rect = currentInput.getBoundingClientRect();
var vw = window.innerWidth;
container.style.top = (rect.bottom + 5) + 'px';
if (vw <= 900) {
container.style.left = '0';
container.style.width = '100vw';
} else {
container.style.left = rect.left + 'px';
container.style.width = '520px';
}
}
window.addEventListener('scroll', positionDropdown);
window.addEventListener('resize', positionDropdown);
}
function crawlPage(url, callback) {
@@ -453,6 +466,18 @@ var Search = (function() {
function showDropdown() {
var container = document.getElementById('searchResultsContainer');
if (container) {
var rect = currentInput.getBoundingClientRect();
var vw = window.innerWidth;
var sidebarWidth = 240;
if (vw <= 900) {
container.style.left = '0';
container.style.width = '100vw';
} else {
container.style.left = rect.left + 'px';
container.style.width = '520px';
}
container.style.top = (rect.bottom + 5) + 'px';
container.style.display = 'block';
dropdownVisible = true;
}