diff --git a/app/components/Article/Contents.tsx b/app/components/Article/Contents.tsx index 33ca943e..c0ae2d26 100644 --- a/app/components/Article/Contents.tsx +++ b/app/components/Article/Contents.tsx @@ -25,7 +25,7 @@ const addPopup = (e: HTMLElement, id: string, contents: string, mobile?: boolean if (preexisting) return preexisting const popup = document.createElement('div') - popup.className = 'link-popup bordered small background' + popup.className = 'link-popup bordered small background' popup.innerHTML = contents popup.id = id diff --git a/app/components/Article/article.css b/app/components/Article/article.css index 6465bbc9..2163894d 100644 --- a/app/components/Article/article.css +++ b/app/components/Article/article.css @@ -102,10 +102,7 @@ article .glossary-entry { article .link-popup { visibility: hidden; - opacity: 0; z-index: 4; - position: absolute; - top: 0; width: 512px; } @@ -218,6 +215,10 @@ article .banner h3 .title { flex-direction: row; flex-wrap: wrap; } + + article .link-popup { + width: 100%; + } article .footer-comtainer > div:nth-child(-n + 2) { flex: 1 1; } diff --git a/app/components/Button/button.css b/app/components/Button/button.css index b44d9267..0f4a5060 100644 --- a/app/components/Button/button.css +++ b/app/components/Button/button.css @@ -183,6 +183,7 @@ /* #### Composite button #### */ .composite-button { cursor: pointer; + display: flex; } .composite-button > form .button, diff --git a/app/components/SearchResults/Dropdown.tsx b/app/components/SearchResults/Dropdown.tsx index 0de0bd1f..3ab2bc48 100644 --- a/app/components/SearchResults/Dropdown.tsx +++ b/app/components/SearchResults/Dropdown.tsx @@ -22,7 +22,13 @@ export interface SearchResultsProps { url: string } -export const SearchResults = ({results}: {results: SearchResultsProps[]}) => { +export const SearchResults = ({ + results, + onSelect, +}: { + results: SearchResultsProps[] + onSelect?: () => void +}) => { const isMobile = useIsMobile() const noResults = results.length === 0 if (noResults) { @@ -34,7 +40,7 @@ export const SearchResults = ({results}: {results: SearchResultsProps[]}) => { } return ( -
+
{results.map((result, i) => ( diff --git a/app/components/search.tsx b/app/components/search.tsx index f409962a..8a795612 100644 --- a/app/components/search.tsx +++ b/app/components/search.tsx @@ -42,6 +42,7 @@ export default function Search({limitFromUrl, className}: Props) { )} {!isPendingSearch && searchPhrase && showResults && ( setShowResults(false)} results={results.map((r) => ({ title: r.title, url: questionUrl(r),