You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@atlas.apache.org by pp...@apache.org on 2026/05/22 12:04:26 UTC
(atlas) branch master updated: ATLAS-5297: Atlas React UI: Topbar alignment and spacing issue in header section (#643)
This is an automated email from the ASF dual-hosted git repository.
pawarprasad123 pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/atlas.git
The following commit(s) were added to refs/heads/master by this push:
new c3be3cb2b ATLAS-5297: Atlas React UI: Topbar alignment and spacing issue in header section (#643)
c3be3cb2b is described below
commit c3be3cb2bf7a06dc0bdcc6b49477781f328f4b42
Author: Brijesh Bhalala <32...@users.noreply.github.com>
AuthorDate: Fri May 22 17:34:20 2026 +0530
ATLAS-5297: Atlas React UI: Topbar alignment and spacing issue in header section (#643)
---
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