a tool for shared writing and social publishing
update shortcuts to use os specific key
+22
-6
+19
-6
components/Toolbar/index.tsx
+19
-6
components/Toolbar/index.tsx
···
46
46
import * as Tooltip from "@radix-ui/react-tooltip";
47
47
import { Separator, ShortcutKey } from "components/Layout";
48
48
import { Input } from "components/Input";
49
+
import { metaKey } from "src/utils/metaKey";
50
+
import { isMac } from "@react-aria/utils";
49
51
50
52
export const TextToolbar = (props: { cardID: string; blockID: string }) => {
51
53
let { rep } = useReplicache();
···
86
88
<div className="flex flex-col gap-1 justify-center">
87
89
<div className="text-center">Bold </div>
88
90
<div className="flex gap-1">
89
-
<ShortcutKey> Cntrl </ShortcutKey> +{" "}
91
+
<ShortcutKey>{metaKey()}</ShortcutKey> +{" "}
90
92
<ShortcutKey> B </ShortcutKey>
91
93
</div>
92
94
</div>
···
98
100
tooltipContent=<div className="flex flex-col gap-1 justify-center">
99
101
<div className="italic font-normal text-center">Italic</div>
100
102
<div className="flex gap-1">
101
-
<ShortcutKey> Cntrl </ShortcutKey> +{" "}
103
+
<ShortcutKey>{metaKey()}</ShortcutKey> +{" "}
102
104
<ShortcutKey> I </ShortcutKey>
103
105
</div>
104
106
</div>
···
112
114
Strikethrough
113
115
</div>
114
116
<div className="flex gap-1">
115
-
<ShortcutKey> Cntrl </ShortcutKey> +{" "}
117
+
<ShortcutKey>{metaKey()}</ShortcutKey> +{" "}
116
118
<ShortcutKey> Cmd </ShortcutKey> +{" "}
117
119
<ShortcutKey> X </ShortcutKey>
118
120
</div>
···
129
131
Highlight
130
132
</div>
131
133
<div className="flex gap-1">
132
-
<ShortcutKey> Cntrl </ShortcutKey> +{" "}
133
-
<ShortcutKey> Cmd </ShortcutKey> +{" "}
134
-
<ShortcutKey> H </ShortcutKey>
134
+
$
135
+
{isMac() ? (
136
+
<>
137
+
<ShortcutKey> Ctrl </ShortcutKey> +{" "}
138
+
<ShortcutKey> Cmd </ShortcutKey> +{" "}
139
+
<ShortcutKey> H </ShortcutKey>
140
+
</>
141
+
) : (
142
+
<>
143
+
<ShortcutKey> Ctrl </ShortcutKey> +{" "}
144
+
<ShortcutKey> Meta </ShortcutKey> +{" "}
145
+
<ShortcutKey> H </ShortcutKey>
146
+
</>
147
+
)}
135
148
</div>
136
149
</div>
137
150
}