mirror of
https://github.com/elastic/kibana.git
synced 2025-04-24 01:38:56 -04:00
Improve header button spacing (#197896)
Closes #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`.
ae9c0d3850/src/plugins/guided_onboarding/public/plugin.tsx (L50)
Co-authored-by: Elastic Machine <elasticmachine@users.noreply.github.com>
This commit is contained in:
parent
babb0feb8e
commit
1066064c98
3 changed files with 9 additions and 4 deletions
|
@ -306,7 +306,11 @@ export const ProjectHeader = ({
|
|||
/>
|
||||
</EuiHeaderSectionItem>
|
||||
|
||||
<EuiHeaderSectionItem>
|
||||
<EuiHeaderSectionItem
|
||||
css={css`
|
||||
gap: ${euiTheme.size.s};
|
||||
`}
|
||||
>
|
||||
<HeaderNavControls navControls$={observables.navControlsRight$} />
|
||||
</EuiHeaderSectionItem>
|
||||
</EuiHeaderSection>
|
||||
|
|
|
@ -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>
|
||||
);
|
||||
}
|
||||
|
||||
|
|
|
@ -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),
|
||||
});
|
||||
}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue