Changed shortcut format for better accessibility

Author: Sheikh-JamirAlam

client/modules/IDE/components/Header/Nav.jsx

@@ -195,9 +195,7 @@ const ProjectMenu = () => {
       <NavDropdownMenu id="edit" title={t('Nav.Edit.Title')}>
         <NavMenuItem onClick={cmRef.current?.tidyCode}>
           {t('Nav.Edit.TidyCode')}
-          <span className="nav__keyboard-shortcut">
-            {metaKeyName}+{'\u21E7'}+F
-          </span>
+          <span className="nav__keyboard-shortcut">{metaKeyName}+Shift+F</span>
         </NavMenuItem>
         <NavMenuItem onClick={cmRef.current?.showFind}>
           {t('Nav.Edit.Find')}
@@ -222,7 +220,7 @@ const ProjectMenu = () => {
         <NavMenuItem onClick={() => dispatch(stopSketch())}>
           {t('Nav.Sketch.Stop')}
           <span className="nav__keyboard-shortcut">
-            {'\u21E7'}+{metaKeyName}+Enter
+            Shift+{metaKeyName}+Enter
           </span>
         </NavMenuItem>
       </NavDropdownMenu>

client/modules/IDE/components/KeyboardShortcutModal.jsx

@@ -25,7 +25,7 @@ function KeyboardShortcutModal() {
       <ul className="keyboard-shortcuts__list">
         <li className="keyboard-shortcut-item">
           <span className="keyboard-shortcut__command">
-            {metaKeyName} + {'\u21E7'} + F
+            {metaKeyName} + Shift + F
           </span>
           <span>{t('KeyboardShortcuts.CodeEditing.Tidy')}</span>
         </li>
@@ -39,7 +39,7 @@ function KeyboardShortcutModal() {
         </li>
         <li className="keyboard-shortcut-item">
           <span className="keyboard-shortcut__command">
-            {metaKeyName} + {'\u21E7'} + G
+            {metaKeyName} + Shift + G
           </span>
           <span>
             {t('KeyboardShortcuts.CodeEditing.FindPreviousTextMatch')}
@@ -84,24 +84,24 @@ function KeyboardShortcutModal() {
         </li>
         <li className="keyboard-shortcut-item">
           <span className="keyboard-shortcut__command">
-            {metaKeyName} + {'\u21E7'} + Enter
+            {metaKeyName} + Shift + Enter
           </span>
           <span>{t('KeyboardShortcuts.General.StopSketch')}</span>
         </li>
         <li className="keyboard-shortcut-item">
           <span className="keyboard-shortcut__command">
-            {metaKeyName} + {'\u21E7'} + 1
+            {metaKeyName} + Shift + 1
           </span>
           <span>{t('KeyboardShortcuts.General.TurnOnAccessibleOutput')}</span>
         </li>
         <li className="keyboard-shortcut-item">
           <span className="keyboard-shortcut__command">
-            {metaKeyName} + {'\u21E7'} + 2
+            {metaKeyName} + Shift + 2
           </span>
           <span>{t('KeyboardShortcuts.General.TurnOffAccessibleOutput')}</span>
         </li>
         <li className="keyboard-shortcut-item">
-          <span className="keyboard-shortcut__command">{'\u21E7'} + Right</span>
+          <span className="keyboard-shortcut__command">Shift + Right</span>
           <span>Go to Reference for Selected Item in Hinter</span>
         </li>
       </ul>

client/utils/metaKey.js

@@ -6,6 +6,6 @@ const metaKey = (() => {
   return 'Ctrl';
 })();
 
-const metaKeyName = metaKey === 'Cmd' ? '⌘' : '⌃';
+const metaKeyName = metaKey === 'Cmd' ? '⌘' : 'Ctrl';
 
 export { metaKey, metaKeyName };