[Global Search Bar] Ensure visible accessibility of search bar contro…

…ls with low DPI
elastic · Jul 6, 2023 · c36977e · c36977e
1 parent 1d78311
commit c36977e
Showing 1 changed file with 7 additions and 0 deletions.
diff --git a/x-pack/plugins/global_search_bar/public/components/search_bar.tsx b/x-pack/plugins/global_search_bar/public/components/search_bar.tsx
@@ -18,6 +18,7 @@ import {
   euiSelectableTemplateSitewideRenderOptions,
   useEuiTheme,
 } from '@elastic/eui';
+import { css } from '@emotion/react';
 import type { GlobalSearchFindParams, GlobalSearchResult } from '@kbn/global-search-plugin/public';
 import React, { FC, useCallback, useEffect, useRef, useState } from 'react';
 import useDebounce from 'react-use/lib/useDebounce';
@@ -317,6 +318,12 @@ export const SearchBar: FC<SearchBarProps> = (opts) => {
       popoverButtonBreakpoints={['xs', 's']}
       singleSelection={true}
       renderOption={(option) => euiSelectableTemplateSitewideRenderOptions(option, searchTerm)}
+      listProps={{
+        className: 'eui-yScroll',
+        css: css`
+          max-block-size: 75vh;
+        `,
+      }}
       searchProps={{
         autoFocus: chromeStyle === 'project',
         value: searchValue,