Add sidebar search and support for search bar middle clicking

This commit is contained in:
Myst(MysterialPy)
2022-03-09 12:26:12 +10:00
committed by GitHub
parent 1a73444275
commit 68b0759637
3 changed files with 44 additions and 2 deletions

View File

@ -95,3 +95,19 @@ document.addEventListener('keydown', (event) => {
activeModal.close();
}
});
function searchBarClick(event, which) {
event.preventDefault();
if (event.button === 1 || event.buttons === 4) {
which.target = "_blank"; // Middle mouse button was clicked. Set our target to a new tab.
}
else if (event.button === 2) {
return // Right button was clicked... Don't do anything here.
}
else {
which.target = "_self"; // Revert to same window.
}
which.submit();
}

View File

@ -61,6 +61,8 @@ Historically however, thanks to:
--search-focus: var(--blue-1);
--search-button: var(--grey-1);
--search-button-hover: var(--grey-1-8);
--search-sidebar-background: var(--grey-1);
--search-sidebar-text: var(--grey-7);
--footer-text: var(--grey-5);
--footer-link: var(--grey-6);
--hr-border: var(--grey-2);
@ -167,6 +169,8 @@ Historically however, thanks to:
--attribute-table-entry-hover-text: var(--blue-1);
--attribute-table-badge: var(--grey-4);
--highlighted-text: rgba(250, 166, 26, 0.2);
--search-sidebar-background: var(--grey-7);
--search-sidebar-text: var(--search-text);
}
img[src$="snake_dark.svg"] {
@ -523,6 +527,20 @@ input[type=search]:focus ~ button[type=submit] {
color: var(--search-button-hover);
}
/* search sidebar */
.search-sidebar > input[type=search],
.search-sidebar > button[type=submit] {
background-color: var(--search-sidebar-background);
color: var(--search-sidebar-text);
}
.sidebar-toggle .search-sidebar > input[type=search],
.sidebar-toggle .search-sidebar > button[type=submit] {
background-color: var(--mobile-nav-background);
color: var(--mobile-nav-text);
}
/* main content area */
main {