Fix selectorSymbol not horizontally centered on the symbol

This commit is contained in:
Eric NGUYEN 2023-02-10 17:20:02 +01:00
parent 9797ada55a
commit 2b7ff3a202

View file

@ -19,11 +19,13 @@ export function SelectorSymbol(props: ISelectorSymbolProps): JSX.Element {
const scale = (props.scale ?? 1); const scale = (props.scale ?? 1);
const [width, height] = [ const [width, height] = [
props.selected.width, props.selected.width / scale,
props.selected.height / scale props.selected.height / scale
]; ];
const [x, y] = [props.selected.x, -SYMBOL_MARGIN - height]; const [x, y] = [
props.selected.x + props.selected.width / 2,
-SYMBOL_MARGIN - height];
const xText = x + width / 2; const xText = x + width / 2;
const yText = y + height / 2; const yText = y + height / 2;
@ -35,7 +37,9 @@ export function SelectorSymbol(props: ISelectorSymbolProps): JSX.Element {
transitionProperty: 'all', transitionProperty: 'all',
transitionTimingFunction: 'cubic-bezier(0.4, 0, 0.2, 1)', transitionTimingFunction: 'cubic-bezier(0.4, 0, 0.2, 1)',
transitionDuration: '150ms', transitionDuration: '150ms',
animation: 'fadein 750ms ease-in alternate infinite' animation: 'fadein 750ms ease-in alternate infinite',
transform: 'translateX(-50%)',
transformBox: 'fill-box'
}; };
return ( return (