Skip to content

Commit

Permalink
Improve header button spacing (elastic#197896)
Browse files Browse the repository at this point in the history
Closes elastic#197873 

## Summary

- Fix spacing between 'Give feedback' and AI button.
- While in the neighborhood, I noticed the search button had some extra
padding, so I fixed that quick too.
- Lastly, I pushed the project switcher to the far right. This is only
used for local development of Serverless and was otherwise appearing
between production buttons.

### Before
<img width="420"
src="https://github.com/user-attachments/assets/f5abe1af-1762-4658-8040-d802b9752667"
/>

<img width="420"
src="https://github.com/user-attachments/assets/04288ff3-6012-4518-866f-0dea4ad62401"
/>

### After
<img width="420"
src="https://github.com/user-attachments/assets/ef2e0eff-d4f4-4ceb-bbf8-c39d2e3e9949"
/>

## QA
To test, you'll need to run this in serverless mode where the 'Give
feedback' button appears.
You can force it on by setting the following line equal to `true`.

https://github.com/elastic/kibana/blob/ae9c0d385015f3068a04af46678e18e2f00b519a/src/plugins/guided_onboarding/public/plugin.tsx#L50

Co-authored-by: Elastic Machine <[email protected]>
  • Loading branch information
ryankeairns and elasticmachine authored Oct 28, 2024
1 parent babb0fe commit 1066064
Show file tree
Hide file tree
Showing 3 changed files with 9 additions and 4 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -306,7 +306,11 @@ export const ProjectHeader = ({
/>
</EuiHeaderSectionItem>

<EuiHeaderSectionItem>
<EuiHeaderSectionItem
css={css`
gap: ${euiTheme.size.s};
`}
>
<HeaderNavControls navControls$={observables.navControlsRight$} />
</EuiHeaderSectionItem>
</EuiHeaderSection>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -325,11 +325,12 @@ export const SearchBar: FC<SearchBarProps> = (opts) => {
buttonRef={visibilityButtonRef}
color="text"
data-test-subj="nav-search-reveal"
iconType="search"
onClick={() => {
setIsVisible(true);
}}
/>
>
<EuiIcon type="search" size="m" />
</EuiHeaderSectionItemButton>
);
}

Expand Down
2 changes: 1 addition & 1 deletion x-pack/plugins/serverless/public/plugin.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -61,7 +61,7 @@ export class ServerlessPlugin
const { currentType } = developer.projectSwitcher;

core.chrome.navControls.registerRight({
order: 500,
order: 5000,
mount: (target) => this.mountProjectSwitcher(target, core, currentType),
});
}
Expand Down

0 comments on commit 1066064

Please sign in to comment.