fix(GRO-564): prevent admin nav logout button overflow
fix(GRO-564): prevent admin nav logout button overflow
This commit was merged in pull request #266.
This commit is contained in:
+50
-40
@@ -210,6 +210,7 @@ function AdminLayout() {
|
|||||||
alignItems: "center",
|
alignItems: "center",
|
||||||
gap: 8,
|
gap: 8,
|
||||||
marginRight: "1.25rem",
|
marginRight: "1.25rem",
|
||||||
|
flexShrink: 0,
|
||||||
}}>
|
}}>
|
||||||
{logoSrc && (
|
{logoSrc && (
|
||||||
<img src={logoSrc} alt="" style={{ width: 24, height: 24, objectFit: "contain" }} />
|
<img src={logoSrc} alt="" style={{ width: 24, height: 24, objectFit: "contain" }} />
|
||||||
@@ -223,52 +224,61 @@ function AdminLayout() {
|
|||||||
</strong>
|
</strong>
|
||||||
</div>
|
</div>
|
||||||
<GlobalSearch />
|
<GlobalSearch />
|
||||||
<Link
|
<div style={{
|
||||||
to="/admin/book"
|
display: "flex",
|
||||||
style={{
|
overflowX: "auto",
|
||||||
padding: "0.4rem 0.85rem",
|
flex: 1,
|
||||||
borderRadius: 6,
|
minWidth: 0,
|
||||||
textDecoration: "none",
|
gap: "0.25rem",
|
||||||
fontSize: 13,
|
}}>
|
||||||
fontWeight: 600,
|
<Link
|
||||||
color: "#fff",
|
to="/admin/book"
|
||||||
background: branding.primaryColor,
|
style={{
|
||||||
marginRight: "0.5rem",
|
padding: "0.4rem 0.85rem",
|
||||||
boxShadow: "0 1px 2px rgba(79, 138, 111, 0.3)",
|
borderRadius: 6,
|
||||||
}}
|
textDecoration: "none",
|
||||||
>
|
fontSize: 13,
|
||||||
Book
|
fontWeight: 600,
|
||||||
</Link>
|
color: "#fff",
|
||||||
{NAV_LINKS.map(({ to, label }) => {
|
background: branding.primaryColor,
|
||||||
const active =
|
boxShadow: "0 1px 2px rgba(79, 138, 111, 0.3)",
|
||||||
to === "/admin"
|
flexShrink: 0,
|
||||||
? location.pathname === "/admin"
|
}}
|
||||||
: location.pathname.startsWith(to);
|
>
|
||||||
return (
|
Book
|
||||||
<Link
|
</Link>
|
||||||
key={to}
|
{NAV_LINKS.map(({ to, label }) => {
|
||||||
to={to}
|
const active =
|
||||||
style={{
|
to === "/admin"
|
||||||
padding: "0.4rem 0.75rem",
|
? location.pathname === "/admin"
|
||||||
borderRadius: 6,
|
: location.pathname.startsWith(to);
|
||||||
textDecoration: "none",
|
return (
|
||||||
fontSize: 13,
|
<Link
|
||||||
fontWeight: active ? 600 : 500,
|
key={to}
|
||||||
color: active ? "#2d6a4f" : "#4b5563",
|
to={to}
|
||||||
background: active ? "#ecfdf5" : "transparent",
|
style={{
|
||||||
}}
|
padding: "0.4rem 0.75rem",
|
||||||
>
|
borderRadius: 6,
|
||||||
{label}
|
textDecoration: "none",
|
||||||
</Link>
|
fontSize: 13,
|
||||||
);
|
fontWeight: active ? 600 : 500,
|
||||||
})}
|
color: active ? "#2d6a4f" : "#4b5563",
|
||||||
|
background: active ? "#ecfdf5" : "transparent",
|
||||||
|
flexShrink: 0,
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
{label}
|
||||||
|
</Link>
|
||||||
|
);
|
||||||
|
})}
|
||||||
|
</div>
|
||||||
<button
|
<button
|
||||||
onClick={async () => {
|
onClick={async () => {
|
||||||
await signOut();
|
await signOut();
|
||||||
navigate("/login");
|
navigate("/login");
|
||||||
}}
|
}}
|
||||||
style={{
|
style={{
|
||||||
marginLeft: "auto",
|
flexShrink: 0,
|
||||||
padding: "0.4rem 0.85rem",
|
padding: "0.4rem 0.85rem",
|
||||||
borderRadius: 6,
|
borderRadius: 6,
|
||||||
border: "1px solid #e2e8f0",
|
border: "1px solid #e2e8f0",
|
||||||
|
|||||||
Reference in New Issue
Block a user