mirror of
https://github.com/netbirdio/netbird.git
synced 2026-10-13 00:49:07 +02:00
* [client] Add RTL layout support to the desktop UI <html dir> follows the active language, Radix primitives get the matching dir, physical spacing/positioning uses logical utilities, and directional icons, animations, arrow-key navigation and tooltip sides flip in RTL. * [client] Address RTL review feedback Force LTR with isolation for monospace values, let truncated names take their direction from their content, and keep the profile name field in the UI direction. * [client] Keep translated monospace labels in their own direction The forced-LTR rule for monospace values now skips elements with an explicit dir, translated development labels use dir=auto, and monospace values rendered through TruncatedText opt into LTR. --------- Co-authored-by: Edward <43848523+thomashacker@users.noreply.github.com>
36 lines
713 B
TypeScript
36 lines
713 B
TypeScript
import { type ReactNode } from "react";
|
|
import { cn } from "@/lib/cn";
|
|
|
|
type DialogAlign = "start" | "center" | "end";
|
|
|
|
const alignClass: Record<DialogAlign, string> = {
|
|
start: "text-start",
|
|
center: "text-center",
|
|
end: "text-end",
|
|
};
|
|
|
|
type DialogHeadingProps = {
|
|
children: ReactNode;
|
|
className?: string;
|
|
align?: DialogAlign;
|
|
id?: string;
|
|
};
|
|
|
|
export const DialogHeading = ({
|
|
children,
|
|
className,
|
|
align = "center",
|
|
id,
|
|
}: DialogHeadingProps) => (
|
|
<h2
|
|
id={id}
|
|
className={cn(
|
|
"w-full select-none text-base font-semibold text-nb-gray-50",
|
|
alignClass[align],
|
|
className,
|
|
)}
|
|
>
|
|
{children}
|
|
</h2>
|
|
);
|