Web: Files: fixed hotkey symbol for macOS
This commit is contained in:
parent
0d302d5549
commit
655c0e9122
@ -2,7 +2,7 @@ import React from "react";
|
|||||||
import Row from "@appserver/components/row";
|
import Row from "@appserver/components/row";
|
||||||
import Text from "@appserver/components/text";
|
import Text from "@appserver/components/text";
|
||||||
|
|
||||||
const ActionsBlock = ({ t, textStyles, keyTextStyles }) => {
|
const ActionsBlock = ({ t, textStyles, keyTextStyles, CtrlKey }) => {
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<Row className="hotkeys_row">
|
<Row className="hotkeys_row">
|
||||||
@ -20,13 +20,13 @@ const ActionsBlock = ({ t, textStyles, keyTextStyles }) => {
|
|||||||
<Row className="hotkeys_row">
|
<Row className="hotkeys_row">
|
||||||
<>
|
<>
|
||||||
<Text {...textStyles}>{t("HotkeysUndoLastAction")}</Text>
|
<Text {...textStyles}>{t("HotkeysUndoLastAction")}</Text>
|
||||||
<Text {...keyTextStyles}>Ctrl+z</Text>
|
<Text {...keyTextStyles}>{CtrlKey}+z</Text>
|
||||||
</>
|
</>
|
||||||
</Row>
|
</Row>
|
||||||
<Row className="hotkeys_row">
|
<Row className="hotkeys_row">
|
||||||
<>
|
<>
|
||||||
<Text {...textStyles}>{t("HotkeysRedoLastUndoneAction")}</Text>
|
<Text {...textStyles}>{t("HotkeysRedoLastUndoneAction")}</Text>
|
||||||
<Text {...keyTextStyles}>Ctrl+Shift+z</Text>
|
<Text {...keyTextStyles}>{CtrlKey}+Shift+z</Text>
|
||||||
</>
|
</>
|
||||||
</Row>
|
</Row>
|
||||||
</>
|
</>
|
||||||
|
@ -2,13 +2,15 @@ import React from "react";
|
|||||||
import Row from "@appserver/components/row";
|
import Row from "@appserver/components/row";
|
||||||
import Text from "@appserver/components/text";
|
import Text from "@appserver/components/text";
|
||||||
|
|
||||||
const ApplicationActionsBlock = ({ t, textStyles, keyTextStyles }) => {
|
const ApplicationActionsBlock = ({ t, textStyles, keyTextStyles, CtrlKey }) => {
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<Row className="hotkeys_row">
|
<Row className="hotkeys_row">
|
||||||
<>
|
<>
|
||||||
<Text {...textStyles}>{t("HotkeysShortcuts")}</Text>
|
<Text {...textStyles}>{t("HotkeysShortcuts")}</Text>
|
||||||
<Text {...keyTextStyles}>? {t("HotkeysOr")} Ctrl+/</Text>
|
<Text {...keyTextStyles}>
|
||||||
|
? {t("HotkeysOr")} {CtrlKey}+/
|
||||||
|
</Text>
|
||||||
</>
|
</>
|
||||||
</Row>
|
</Row>
|
||||||
</>
|
</>
|
||||||
|
@ -2,31 +2,31 @@ import React from "react";
|
|||||||
import Row from "@appserver/components/row";
|
import Row from "@appserver/components/row";
|
||||||
import Text from "@appserver/components/text";
|
import Text from "@appserver/components/text";
|
||||||
|
|
||||||
const MoveBlock = ({ t, textStyles, keyTextStyles }) => {
|
const MoveBlock = ({ t, textStyles, keyTextStyles, CtrlKey }) => {
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<Row className="hotkeys_row">
|
<Row className="hotkeys_row">
|
||||||
<>
|
<>
|
||||||
<Text {...textStyles}>{t("HotkeysMoveDown")}</Text>
|
<Text {...textStyles}>{t("HotkeysMoveDown")}</Text>
|
||||||
<Text {...keyTextStyles}>Ctrl+↓</Text>
|
<Text {...keyTextStyles}>{CtrlKey}+↓</Text>
|
||||||
</>
|
</>
|
||||||
</Row>
|
</Row>
|
||||||
<Row className="hotkeys_row">
|
<Row className="hotkeys_row">
|
||||||
<>
|
<>
|
||||||
<Text {...textStyles}>{t("HotkeysMoveUp")}</Text>
|
<Text {...textStyles}>{t("HotkeysMoveUp")}</Text>
|
||||||
<Text {...keyTextStyles}>Ctrl+↑</Text>
|
<Text {...keyTextStyles}>{CtrlKey}+↑</Text>
|
||||||
</>
|
</>
|
||||||
</Row>
|
</Row>
|
||||||
<Row className="hotkeys_row">
|
<Row className="hotkeys_row">
|
||||||
<>
|
<>
|
||||||
<Text {...textStyles}>{t("HotkeysMoveLeft")}</Text>
|
<Text {...textStyles}>{t("HotkeysMoveLeft")}</Text>
|
||||||
<Text {...keyTextStyles}>Ctrl+←</Text>
|
<Text {...keyTextStyles}>{CtrlKey}+←</Text>
|
||||||
</>
|
</>
|
||||||
</Row>
|
</Row>
|
||||||
<Row className="hotkeys_row">
|
<Row className="hotkeys_row">
|
||||||
<>
|
<>
|
||||||
<Text {...textStyles}>{t("HotkeysMoveRight")}</Text>
|
<Text {...textStyles}>{t("HotkeysMoveRight")}</Text>
|
||||||
<Text {...keyTextStyles}>Ctrl+→</Text>
|
<Text {...keyTextStyles}>{CtrlKey}+→</Text>
|
||||||
</>
|
</>
|
||||||
</Row>
|
</Row>
|
||||||
</>
|
</>
|
||||||
|
@ -10,6 +10,7 @@ import MoveBlock from "./MoveBlock";
|
|||||||
import ActionsBlock from "./ActionsBlock";
|
import ActionsBlock from "./ActionsBlock";
|
||||||
import ApplicationActionsBlock from "./ApplicationActionsBlock";
|
import ApplicationActionsBlock from "./ApplicationActionsBlock";
|
||||||
import PreviewActionsBlock from "./PreviewActionsBlock";
|
import PreviewActionsBlock from "./PreviewActionsBlock";
|
||||||
|
import { isMacOs } from "react-device-detect";
|
||||||
|
|
||||||
const HotkeyPanel = ({ visible, setHotkeyPanelVisible, t, tReady }) => {
|
const HotkeyPanel = ({ visible, setHotkeyPanelVisible, t, tReady }) => {
|
||||||
const onClose = () => setHotkeyPanelVisible(false);
|
const onClose = () => setHotkeyPanelVisible(false);
|
||||||
@ -23,6 +24,8 @@ const HotkeyPanel = ({ visible, setHotkeyPanelVisible, t, tReady }) => {
|
|||||||
...{ color: "#657077", className: "hotkeys-key" },
|
...{ color: "#657077", className: "hotkeys-key" },
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const CtrlKey = isMacOs ? "⌘" : "Ctrl";
|
||||||
|
|
||||||
const onKeyPress = (e) =>
|
const onKeyPress = (e) =>
|
||||||
(e.key === "Esc" || e.key === "Escape") && onClose();
|
(e.key === "Esc" || e.key === "Escape") && onClose();
|
||||||
|
|
||||||
@ -54,6 +57,7 @@ const HotkeyPanel = ({ visible, setHotkeyPanelVisible, t, tReady }) => {
|
|||||||
t={t}
|
t={t}
|
||||||
textStyles={textStyles}
|
textStyles={textStyles}
|
||||||
keyTextStyles={keyTextStyles}
|
keyTextStyles={keyTextStyles}
|
||||||
|
CtrlKey={CtrlKey}
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<Heading className="hotkeys_sub-header">
|
<Heading className="hotkeys_sub-header">
|
||||||
@ -63,6 +67,7 @@ const HotkeyPanel = ({ visible, setHotkeyPanelVisible, t, tReady }) => {
|
|||||||
t={t}
|
t={t}
|
||||||
textStyles={textStyles}
|
textStyles={textStyles}
|
||||||
keyTextStyles={keyTextStyles}
|
keyTextStyles={keyTextStyles}
|
||||||
|
CtrlKey={CtrlKey}
|
||||||
/>
|
/>
|
||||||
<Heading className="hotkeys_sub-header">
|
<Heading className="hotkeys_sub-header">
|
||||||
{t("HotkeysApplicationActions")}
|
{t("HotkeysApplicationActions")}
|
||||||
@ -71,6 +76,7 @@ const HotkeyPanel = ({ visible, setHotkeyPanelVisible, t, tReady }) => {
|
|||||||
t={t}
|
t={t}
|
||||||
textStyles={textStyles}
|
textStyles={textStyles}
|
||||||
keyTextStyles={keyTextStyles}
|
keyTextStyles={keyTextStyles}
|
||||||
|
CtrlKey={CtrlKey}
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<Heading className="hotkeys_sub-header">
|
<Heading className="hotkeys_sub-header">
|
||||||
|
Loading…
Reference in New Issue
Block a user