diff --git a/apps/client/src/common/utils/deviceUtils.ts b/apps/client/src/common/utils/deviceUtils.ts new file mode 100644 index 000000000..9a8cdfde4 --- /dev/null +++ b/apps/client/src/common/utils/deviceUtils.ts @@ -0,0 +1,6 @@ +export function isMacOS() { + const userAgent = navigator.userAgent.toLowerCase(); + return userAgent.includes('macintosh') || userAgent.includes('mac os'); +} + +export const deviceAlt = isMacOS() ? '⌥' : 'Alt'; diff --git a/apps/client/src/features/rundown/quick-add-block/QuickAddBlock.tsx b/apps/client/src/features/rundown/quick-add-block/QuickAddBlock.tsx index 93862f63e..abf20135f 100644 --- a/apps/client/src/features/rundown/quick-add-block/QuickAddBlock.tsx +++ b/apps/client/src/features/rundown/quick-add-block/QuickAddBlock.tsx @@ -5,6 +5,7 @@ import { SupportedEvent } from 'ontime-types'; import { useEventAction } from '../../../common/hooks/useEventAction'; import { useEditorSettings } from '../../../common/stores/editorSettings'; import { useEmitLog } from '../../../common/stores/logger'; +import { deviceAlt } from '../../../common/utils/deviceUtils'; import { tooltipDelayMid } from '../../../ontimeConfig'; import style from './QuickAddBlock.module.scss'; @@ -82,7 +83,7 @@ const QuickAddBlock = (props: QuickAddBlockProps) => { className={style.quickBtn} data-testid='quick-add-event' > - Event {showKbd && Alt + E} + Event {showKbd && {`${deviceAlt} + E`}} @@ -94,7 +95,7 @@ const QuickAddBlock = (props: QuickAddBlockProps) => { className={style.quickBtn} data-testid='quick-add-delay' > - Delay {showKbd && Alt + D} + Delay {showKbd && {`${deviceAlt} + D`}} @@ -106,7 +107,7 @@ const QuickAddBlock = (props: QuickAddBlockProps) => { className={style.quickBtn} data-testid='quick-add-block' > - Block {showKbd && Alt + B} + Block {showKbd && {`${deviceAlt} + B`}}