[Bug]: Navbar logo and text collapse on theme toggle

[sanketkokate712]

Hi,mentors- @ashley-cui @TomSweeneyRedHat
When toggling between light and dark theme, the navbar logo and "podman" text briefly collapse/shrink, appearing unstable. The image and text momentarily misalign before settling.

Steps to reproduce

1. Go to podman.io
2. Click the theme toggle button (light/dark)
3. Observe the navbar logo and text
4. Repeat multiple times

->Expected behavior -Logo and text should remain stable and properly aligned when toggling theme — no collapse, shrinking, or layout shift.

->Actual behavior - Logo container loses explicit width during re-render - "podman" text collapses into logo space Layout momentarily breaks before correcting .

->Root cause -The .navbar__logo container has only height but no explicit width constraint. During theme toggle, the brief re-render causes the image to lose its computed width, triggering the collapse. The img element inside also lacks fixed dimensions.

Environment - Browser: Chrome, Safari, Firefox (all affected) - Device: Desktop and mobile

Upload screenshots or screen recordings

Before fix (bug visible)

Video.Project.10.1.mp4

After fix (stable)

screen-capture.2.webm

LLM Policy

• This issue is human-written, and folow up comments will also be human-written

[sanketkokate712]

@ashley-cui when the pr merging will be starting.