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:
groombook-cto[bot]
2026-04-12 02:31:46 +00:00
committed by GitHub
+50 -40
View File
@@ -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",