mirror of
https://github.com/elastic/kibana.git
synced 2025-04-23 17:28:26 -04:00
🌊 Streams: Remove back button (#212670)
The back button takes away a ton of vertical space and doesn't provide that much value. This PR removes it and also reduced the vertical padding of the header in accordance with the designs: <img width="550" alt="Screenshot 2025-02-27 at 17 09 10" src="https://github.com/user-attachments/assets/88969ecd-071a-45b4-9a8e-bad90f00dc4e" /> <img width="867" alt="Screenshot 2025-02-27 at 17 09 20" src="https://github.com/user-attachments/assets/a174191b-b79d-493c-9c27-6566ac801d60" />
This commit is contained in:
parent
14067ca469
commit
91b1ac0305
2 changed files with 3 additions and 19 deletions
|
@ -4,7 +4,7 @@
|
|||
* 2.0; you may not use this file except in compliance with the Elastic License
|
||||
* 2.0.
|
||||
*/
|
||||
import { EuiFlexGroup, EuiFlexItem, EuiIcon, EuiLink, EuiPanel, EuiBadge } from '@elastic/eui';
|
||||
import { EuiFlexGroup, EuiFlexItem, EuiLink, EuiBadge } from '@elastic/eui';
|
||||
import { i18n } from '@kbn/i18n';
|
||||
import React from 'react';
|
||||
import { css } from '@emotion/css';
|
||||
|
@ -90,21 +90,8 @@ export function EntityDetailViewWithoutParams({
|
|||
max-width: 100%;
|
||||
`}
|
||||
>
|
||||
<EuiFlexItem grow={false}>
|
||||
<EuiPanel color="transparent">
|
||||
<EuiLink data-test-subj="streamsEntityDetailViewGoBackHref" href={router.link('/')}>
|
||||
<EuiFlexGroup direction="row" alignItems="center" gutterSize="s">
|
||||
<EuiIcon type="arrowLeft" />
|
||||
{i18n.translate('xpack.streams.entityDetailView.goBackLinkLabel', {
|
||||
defaultMessage: 'Back',
|
||||
})}
|
||||
</EuiFlexGroup>
|
||||
</EuiLink>
|
||||
</EuiPanel>
|
||||
</EuiFlexItem>
|
||||
<EuiFlexItem grow={false}>
|
||||
<StreamsAppPageHeader
|
||||
verticalPaddingSize="none"
|
||||
title={
|
||||
<StreamsAppPageHeaderTitle
|
||||
title={
|
||||
|
|
|
@ -11,20 +11,17 @@ import React from 'react';
|
|||
export function StreamsAppPageHeader({
|
||||
title,
|
||||
children,
|
||||
verticalPaddingSize = 'l',
|
||||
}: {
|
||||
title: React.ReactNode;
|
||||
children?: React.ReactNode;
|
||||
verticalPaddingSize?: 'none' | 'l';
|
||||
}) {
|
||||
const theme = useEuiTheme().euiTheme;
|
||||
|
||||
return (
|
||||
<EuiFlexGroup direction="column" gutterSize="s">
|
||||
<EuiFlexGroup direction="column" gutterSize="none">
|
||||
<EuiPageHeader
|
||||
className={css`
|
||||
padding: ${verticalPaddingSize === 'none' ? 0 : theme.size[verticalPaddingSize]}
|
||||
${theme.size.l};
|
||||
padding: ${theme.size.m} ${theme.size.l};
|
||||
`}
|
||||
>
|
||||
{title}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue