- Remove the large active-space name header in the space sidebar;
the active space stays highlighted in the spaces grid below.
- Move "Space settings" into the user avatar (top) menu next to
"Workspace settings"; it shows only while viewing a space and is
detected via useMatch("/s/:spaceSlug/*").
- Make the brand logo non-selectable/non-draggable (user-select:none
on .brand, draggable=false on the img).
- Remove the redundant "Home" button next to the logo (the logo
already links to /home).
- Remove the version label under the Settings sidebar menu.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
35 lines
1010 B
TypeScript
35 lines
1010 B
TypeScript
import { useComputedColorScheme } from "@mantine/core";
|
|
|
|
type BrandLogoProps = {
|
|
// When true, render the mark only; otherwise render the full lockup (mark + wordmark).
|
|
markOnly?: boolean;
|
|
// Logo height in pixels; width scales automatically to preserve aspect ratio.
|
|
height?: number;
|
|
className?: string;
|
|
};
|
|
|
|
export function BrandLogo({
|
|
markOnly = false,
|
|
height = 28,
|
|
className,
|
|
}: BrandLogoProps) {
|
|
// Detect the active color scheme and pick the contrasting ink variant.
|
|
// "*-light" = light ink for dark backgrounds, "*-dark" = dark ink for light backgrounds.
|
|
const colorScheme = useComputedColorScheme("light");
|
|
const variant = colorScheme === "dark" ? "light" : "dark";
|
|
|
|
const src = markOnly
|
|
? `/brand/gitmost-mark-${variant}.svg`
|
|
: `/brand/gitmost-logo-${variant}.svg`;
|
|
|
|
return (
|
|
<img
|
|
src={src}
|
|
alt="Gitmost"
|
|
className={className}
|
|
draggable={false}
|
|
style={{ height, width: "auto", display: "block", userSelect: "none" }}
|
|
/>
|
|
);
|
|
}
|