mirror of
https://github.com/zadam/trilium.git
synced 2025-10-21 15:49:00 +02:00
fix(global_menu): zoom controls tooltip overlapping
This commit is contained in:
parent
ed8df51216
commit
311f4aded8
@ -157,7 +157,10 @@ function ZoomControls({ parentComponent }: { parentComponent?: Component | null
|
|||||||
|
|
||||||
function ZoomControlButton({ command, title, icon, children }: { command: KeyboardActionNames, title: string, icon?: string, children?: ComponentChildren }) {
|
function ZoomControlButton({ command, title, icon, children }: { command: KeyboardActionNames, title: string, icon?: string, children?: ComponentChildren }) {
|
||||||
const linkRef = useRef<HTMLAnchorElement>(null);
|
const linkRef = useRef<HTMLAnchorElement>(null);
|
||||||
useStaticTooltipWithKeyboardShortcut(linkRef, title, command);
|
useStaticTooltipWithKeyboardShortcut(linkRef, title, command, {
|
||||||
|
placement: "bottom",
|
||||||
|
fallbackPlacements: [ "bottom" ]
|
||||||
|
});
|
||||||
return (
|
return (
|
||||||
<a
|
<a
|
||||||
ref={linkRef}
|
ref={linkRef}
|
||||||
|
@ -545,10 +545,11 @@ export function useStaticTooltip(elRef: RefObject<Element>, config?: Partial<Too
|
|||||||
}, [ elRef, config ]);
|
}, [ elRef, config ]);
|
||||||
}
|
}
|
||||||
|
|
||||||
export function useStaticTooltipWithKeyboardShortcut(elRef: RefObject<Element>, title: string, actionName: KeyboardActionNames | undefined) {
|
export function useStaticTooltipWithKeyboardShortcut(elRef: RefObject<Element>, title: string, actionName: KeyboardActionNames | undefined, opts?: Omit<Partial<Tooltip.Options>, "title">) {
|
||||||
const [ keyboardShortcut, setKeyboardShortcut ] = useState<string[]>();
|
const [ keyboardShortcut, setKeyboardShortcut ] = useState<string[]>();
|
||||||
useStaticTooltip(elRef, {
|
useStaticTooltip(elRef, {
|
||||||
title: keyboardShortcut?.length ? `${title} (${keyboardShortcut?.join(",")})` : title
|
title: keyboardShortcut?.length ? `${title} (${keyboardShortcut?.join(",")})` : title,
|
||||||
|
...opts
|
||||||
});
|
});
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
|
Loading…
x
Reference in New Issue
Block a user