github-mirrors/kibana
1
0
Fork 0
mirror of https://github.com/elastic/kibana.git synced 2025-04-24 17:59:23 -04:00
Code Issues Projects Releases Packages Wiki Activity

[APM] Responsive layout for backends detail (#108680)

Browse source 
Closes #108022.
This commit is contained in:
Dario Gieselaar 2021-08-17 07:59:35 +02:00 • committed by GitHub
parent 6a39dc1880
commit 0e547e402d
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 7 additions and 1 deletions
Download patch file Download diff file Expand all files Collapse all files

8
x-pack/plugins/apm/public/components/app/backend_detail_overview/index.tsx
View file

@ -23,6 +23,7 @@ import { BackendDetailDependenciesTable } from './backend_detail_dependencies_ta
import { BackendThroughputChart } from './backend_throughput_chart';
import { BackendFailedTransactionRateChart } from './backend_error_rate_chart';
import { BackendDetailTemplate } from '../../routing/templates/backend_detail_template';
import { useBreakPoints } from '../../../hooks/use_break_points';
export function BackendDetailOverview() {
const {
@ -53,12 +54,17 @@ export function BackendDetailOverview() {
},
]);
const largeScreenOrSmaller = useBreakPoints().isLarge;
return (
<ApmBackendContextProvider>
<BackendDetailTemplate title={backendName}>
<SearchBar showTimeComparison />
<ChartPointerEventContextProvider>
<EuiFlexGroup direction="row" gutterSize="s">
<EuiFlexGroup
direction={largeScreenOrSmaller ? 'column' : 'row'}
gutterSize="s"
>
<EuiFlexItem>
<EuiPanel hasBorder={true}>
<EuiTitle size="xs">