Skip to content

[Chrome Grid] Revert the header displayed next to the sidenav#244628

Merged
Dosant merged 1 commit intoelastic:mainfrom
Dosant:d/2025-11-28-workspace-chrome-layout-change
Nov 28, 2025
Merged

[Chrome Grid] Revert the header displayed next to the sidenav#244628
Dosant merged 1 commit intoelastic:mainfrom
Dosant:d/2025-11-28-workspace-chrome-layout-change

Conversation

@Dosant
Copy link
Contributor

@Dosant Dosant commented Nov 28, 2025 •
edited
Loading

Summary

One user-facing change we made with the grid layout is that we started displaying the Kibana header next to the sidenav instead of above it.

Before grid layout

Screenshot 2025-10-31 at 11 22 32

With grid layout

Screenshot 2025-10-31 at 11 25 24

With this PR, we revert this user-facing change and return the header to the top of the nav.

Screenshot 2025-11-28 at 12 54 38

@Dosant Dosant changed the title [Chrome Grid] Display the header on top of the sidenav like it was before [Chrome Grid] Revert the header displayed next to the sidenav Nov 28, 2025
@Dosant Dosant marked this pull request as ready for review November 28, 2025 11:55
@Dosant Dosant requested review from a team as code owners November 28, 2025 11:55
@Dosant Dosant added release_note:skip Skip the PR/issue when compiling release notes Team:SharedUX Platform AppEx-SharedUX (formerly Global Experience) t// labels Nov 28, 2025
@elasticmachine
Copy link
Contributor

elasticmachine commented Nov 28, 2025

Pinging @elastic/appex-sharedux (Team:SharedUX)

@Dosant Dosant added the backport:skip This PR does not require backporting label Nov 28, 2025
Dosant
Dosant commented Nov 28, 2025
View reviewed changes
x-pack/solutions/observability/test/functional_solution_sidenav/tests/observability_sidenav.ts
}

// open Infrastructure popover and navigate to some link inside the panel
await solutionNavigation.sidenav.expandMore();
Copy link
Contributor Author

@Dosant Dosant Nov 28, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We removed this in the original grid PR because there was more space in the sidenav so we didn't need to click "more" here.
Now we need to revert this

https://github.com/elastic/kibana/pull/243181/files#r2546679194

@elasticmachine
Copy link
Contributor

elasticmachine commented Nov 28, 2025

💛 Build succeeded, but was flaky

Failed CI Steps

Metrics [docs]

Page load bundle

Size of the bundles that are downloaded on every page load. Target size is below 100kb

id before after diff
core 501.8KB 501.6KB -199.0B

@Dosant Dosant enabled auto-merge (squash) November 28, 2025 14:16
maryam-saeidi
maryam-saeidi approved these changes Nov 28, 2025
View reviewed changes
Copy link
Member

@maryam-saeidi maryam-saeidi left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Code review only, revert LGTM

@Dosant Dosant merged commit 4fc8027 into elastic:main Nov 28, 2025
23 checks passed
tkajtoch pushed a commit to tkajtoch/kibana that referenced this pull request Dec 1, 2025
@Dosant @tkajtoch
[Chrome Grid] Revert the header displayed next to the sidenav (elasti…
3320150 
…c#244628)

## Summary

One user-facing change we made with [the grid
layout](elastic#243181) is that we
started displaying the Kibana header next to the sidenav instead of
above it.

**Before grid layout**

<img width="630" height="409" alt="Screenshot 2025-10-31 at 11 22 32"
src="https://github.com/user-attachments/assets/f04eaf6a-9605-4346-b105-e172b5f990f2"
/>

**With grid layout** 

<img width="591" height="290" alt="Screenshot 2025-10-31 at 11 25 24"
src="https://github.com/user-attachments/assets/6e34f379-d979-4c82-a6fc-1c94811f17b6"
/>


----- 

With this PR, we revert this user-facing change and return the header to
the top of the nav.


<img width="1624" height="1056" alt="Screenshot 2025-11-28 at 12 54 38"
src="https://github.com/user-attachments/assets/b8bb6a56-4983-4341-9ae6-e52ac46b5636"
/>
tsullivan pushed a commit to tsullivan/kibana that referenced this pull request Dec 1, 2025
@Dosant @tsullivan
[Chrome Grid] Revert the header displayed next to the sidenav (elasti…
bebe613 
…c#244628)

One user-facing change we made with [the grid
layout](elastic#243181) is that we
started displaying the Kibana header next to the sidenav instead of
above it.

**Before grid layout**

<img width="630" height="409" alt="Screenshot 2025-10-31 at 11 22 32"
src="https://github.com/user-attachments/assets/f04eaf6a-9605-4346-b105-e172b5f990f2"
/>

**With grid layout**

<img width="591" height="290" alt="Screenshot 2025-10-31 at 11 25 24"
src="https://github.com/user-attachments/assets/6e34f379-d979-4c82-a6fc-1c94811f17b6"
/>

-----

With this PR, we revert this user-facing change and return the header to
the top of the nav.

<img width="1624" height="1056" alt="Screenshot 2025-11-28 at 12 54 38"
src="https://github.com/user-attachments/assets/b8bb6a56-4983-4341-9ae6-e52ac46b5636"
/>
@Dosant Dosant added the chrome-grid Work related to Chrome refactor to grid layout label Dec 2, 2025
NicholasPeretti pushed a commit to NicholasPeretti/kibana that referenced this pull request Dec 2, 2025
@Dosant @NicholasPeretti
[Chrome Grid] Revert the header displayed next to the sidenav (elasti…
93c3bb5 
…c#244628)

## Summary

One user-facing change we made with [the grid
layout](elastic#243181) is that we
started displaying the Kibana header next to the sidenav instead of
above it.

**Before grid layout**

<img width="630" height="409" alt="Screenshot 2025-10-31 at 11 22 32"
src="https://github.com/user-attachments/assets/f04eaf6a-9605-4346-b105-e172b5f990f2"
/>

**With grid layout** 

<img width="591" height="290" alt="Screenshot 2025-10-31 at 11 25 24"
src="https://github.com/user-attachments/assets/6e34f379-d979-4c82-a6fc-1c94811f17b6"
/>


----- 

With this PR, we revert this user-facing change and return the header to
the top of the nav.


<img width="1624" height="1056" alt="Screenshot 2025-11-28 at 12 54 38"
src="https://github.com/user-attachments/assets/b8bb6a56-4983-4341-9ae6-e52ac46b5636"
/>
JordanSh pushed a commit to JordanSh/kibana that referenced this pull request Dec 9, 2025
@Dosant @JordanSh
[Chrome Grid] Revert the header displayed next to the sidenav (elasti…
f1635a7 
…c#244628)

## Summary

One user-facing change we made with [the grid
layout](elastic#243181) is that we
started displaying the Kibana header next to the sidenav instead of
above it.

**Before grid layout**

<img width="630" height="409" alt="Screenshot 2025-10-31 at 11 22 32"
src="https://github.com/user-attachments/assets/f04eaf6a-9605-4346-b105-e172b5f990f2"
/>

**With grid layout** 

<img width="591" height="290" alt="Screenshot 2025-10-31 at 11 25 24"
src="https://github.com/user-attachments/assets/6e34f379-d979-4c82-a6fc-1c94811f17b6"
/>


----- 

With this PR, we revert this user-facing change and return the header to
the top of the nav.


<img width="1624" height="1056" alt="Screenshot 2025-11-28 at 12 54 38"
src="https://github.com/user-attachments/assets/b8bb6a56-4983-4341-9ae6-e52ac46b5636"
/>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@maryam-saeidi maryam-saeidi maryam-saeidi approved these changes

@ek-so ek-so ek-so approved these changes

Assignees

No one assigned

Labels

backport:skip This PR does not require backporting chrome-grid Work related to Chrome refactor to grid layout release_note:skip Skip the PR/issue when compiling release notes Team:SharedUX Platform AppEx-SharedUX (formerly Global Experience) t// v9.3.0

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

5 participants

@Dosant @elasticmachine @maryam-saeidi @ek-so @kibanamachine