Skip to content

Commit

Permalink
Fix page responsiveness for smaller screen sizes (#141471)
Browse files Browse the repository at this point in the history
These fixes makes page wrap properly on smaller devices. It will fix
word breaks on header and make both cards wrap properly when they don't
fit the page.
  • Loading branch information
efegurkan authored Sep 23, 2022
1 parent a61506b commit ddf5307
Show file tree
Hide file tree
Showing 2 changed files with 7 additions and 2 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,7 @@ export const SearchIndexPipelines: React.FC = () => {
return (
<>
<EuiSpacer />
<EuiFlexGroup direction="row">
<EuiFlexGroup direction="row" wrap>
<EuiFlexItem grow={5}>
<DataPanel
hasBorder
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -66,7 +66,12 @@ export const DataPanel: React.FC<Props> = ({
<EuiSplitPanel.Inner>
<EuiFlexGroup gutterSize="s" alignItems="center" responsive={false}>
<EuiFlexItem grow>
<EuiFlexGroup gutterSize="s" alignItems="center" responsive={false}>
<EuiFlexGroup
className="eui-textNoWrap"
gutterSize="s"
alignItems="center"
responsive={false}
>
{iconType && (
<EuiFlexItem grow={false}>
<EuiIcon type={iconType} />
Expand Down

0 comments on commit ddf5307

Please sign in to comment.