This is an automated email from the ASF dual-hosted git repository.
pawarprasad123 pushed a commit to branch atlas-2.6
in repository https://gitbox.apache.org/repos/asf/atlas.git
The following commit(s) were added to refs/heads/atlas-2.6 by this push:
new 47e1065fe ATLAS-5297: Atlas React UI: Topbar alignment and spacing
issue in header section (#643)
47e1065fe is described below
commit 47e1065fe0796ef2f3c67a5c307b11a4f147566b
Author: Brijesh Bhalala <[email protected]>
AuthorDate: Fri May 22 17:34:20 2026 +0530
ATLAS-5297: Atlas React UI: Topbar alignment and spacing issue in header
section (#643)
(cherry picked from commit c3be3cb2bf7a06dc0bdcc6b49477781f328f4b42)
---
dashboard/src/components/GlobalSearch/QuickSearch.tsx | 5 +++--
dashboard/src/views/Layout/Header.tsx | 4 ++--
2 files changed, 5 insertions(+), 4 deletions(-)
diff --git a/dashboard/src/components/GlobalSearch/QuickSearch.tsx
b/dashboard/src/components/GlobalSearch/QuickSearch.tsx
index c8eba9490..58452964b 100644
--- a/dashboard/src/components/GlobalSearch/QuickSearch.tsx
+++ b/dashboard/src/components/GlobalSearch/QuickSearch.tsx
@@ -388,6 +388,7 @@ const QuickSearch = () => {
className="global-search-stack"
alignItems="center"
gap="0.5rem"
+ sx={{ minWidth: 0, flexShrink: 1 }}
>
<FormControl
size="small"
@@ -436,8 +437,8 @@ const QuickSearch = () => {
disablePortal
className="global-search-autocomplete"
sx={{
- minWidth: 280,
- flex: 1,
+ minWidth: 150,
+ flex: "1 1 280px",
"& +
.MuiAutocomplete-popper .MuiAutocomplete-option": {
backgroundColor: "white"
},
diff --git a/dashboard/src/views/Layout/Header.tsx
b/dashboard/src/views/Layout/Header.tsx
index 80fc2dc06..31556391d 100644
--- a/dashboard/src/views/Layout/Header.tsx
+++ b/dashboard/src/views/Layout/Header.tsx
@@ -182,14 +182,14 @@ const Header: React.FC<Header> = ({
)}
{location.pathname !== "/" &&
location.pathname !== "/search" && (
- <div style={{ display: "flex", justifyContent: "center", flex: "1"
}}>
+ <div style={{ display: "flex", justifyContent: "center", flex: "1",
minWidth: 0, padding: "0 16px" }}>
<QuickSearch />
</div>
)}
{(location.pathname === "/" || location.pathname === "/search") && (
<div style={{ flex: "1" }} />
)}
- <div className="header-menu" style={{ display: "flex", alignItems:
"center", gap: 8 }}>
+ <div className="header-menu" style={{ display: "flex", alignItems:
"center", gap: 8, flexShrink: 0 }}>
<CreateDropdown />
<LightTooltip title="Downloads">
<IconButton
