static/js/common: Add `Ctrl` key mapping to `Cmd` for MacOS.

frontend_tests/node_tests/common.js

@@ -69,6 +69,9 @@ run_test('adjust_mac_shortcuts', () => {
         ['X + Shift', 'X + Shift'],
         ['⌘ + Return', '⌘ + Return'],
         ['Enter or Backspace', "Return or Delete"],
+        ['Ctrl', '⌘'],
+        ['Ctrl + Shift', '⌘ + Shift'],
+        ['Ctrl + Backspace + End', '⌘ + Delete + Fn + →'],
     ]);
     const keys_to_test_non_mac = new Map([
         ['Backspace', 'Backspace'],
@@ -79,6 +82,8 @@ run_test('adjust_mac_shortcuts', () => {
         ['PgDn', 'PgDn'],
         ['X + Shift', 'X + Shift'],
         ['⌘ + Return', '⌘ + Return'],
+        ['Ctrl + Shift', 'Ctrl + Shift'],
+        ['Ctrl + Backspace + End', 'Ctrl + Backspace + End'],
     ]);
 
     var key_no;
@@ -113,4 +118,12 @@ run_test('adjust_mac_shortcuts', () => {
     keys_elem_list.forEach(function (key_elem) {
         assert.equal(key_elem.text(), key_elem.expected_key());
     });
+
+    var markdown_hotkey_1 = get_key_stub_html("Ctrl + Backspace", "⌘ + Delete", "markdown_hotkey_1");
+    $(".markdown_content").each = (f) => {
+        f.call(markdown_hotkey_1);
+    };
+    common.adjust_mac_shortcuts(".markdown_content", true);
+    assert.equal(markdown_hotkey_1.text(), markdown_hotkey_1.expected_key());
+    assert.equal(markdown_hotkey_1.hasClass("mac-cmd-key"), true);
 });

static/js/common.js

@@ -104,7 +104,7 @@ exports.has_mac_keyboard = function () {
     return /Mac/i.test(navigator.platform);
 };
 
-exports.adjust_mac_shortcuts = function (key_elem_class) {
+exports.adjust_mac_shortcuts = function (key_elem_class, require_cmd_style) {
     if (!exports.has_mac_keyboard()) {
         return;
     }
@@ -116,12 +116,16 @@ exports.adjust_mac_shortcuts = function (key_elem_class) {
         ['End', 'Fn + →'],
         ['PgUp', 'Fn + ↑'],
         ['PgDn', 'Fn + ↓'],
+        ['Ctrl', '⌘'],
     ]);
 
     $(key_elem_class).each(function () {
         var key_text = $(this).text();
         var keys = key_text.match(/[^\s\+]+/g);
 
+        if (key_text.indexOf('Ctrl') > -1 && require_cmd_style) {
+            $(this).addClass("mac-cmd-key");
+        }
         _.each(keys, function (key) {
             if (keys_map.get(key)) {
                 key_text = key_text.replace(key, keys_map.get(key));

static/js/portico/help.js

@@ -46,7 +46,7 @@ function render_code_sections() {
 
     highlight_current_article();
 
-    common.adjust_mac_shortcuts(".markdown .content code");
+    common.adjust_mac_shortcuts(".markdown .content code", true);
 
     $("table").each(function () {
         $(this).addClass("table table-striped");

static/styles/portico/portico.scss

@@ -14,6 +14,11 @@ body {
     text-align: center;
 }
 
+.mac-cmd-key {
+    font-size: 15px;
+    font-family: monospace;
+}
+
 .container-fluid {
     padding: 0px;
     min-height: 100%;

templates/zerver/help/logging-in.md

@@ -19,7 +19,7 @@ and GitHub account use the same email address.
 
 {tab|desktop}
 
-1. Open the **left sidebar** (`Ctrl+Shift+s` or `Cmd+Shift+s`).
+1. Open the **left sidebar** (`Ctrl+Shift+s`).
 
 1. Set your [proxy settings](/help/connect-through-a-proxy) or add a
    [custom certificate](/help/custom-certificates) if needed (rare).

templates/zerver/help/switching-between-organizations.md

@@ -6,7 +6,7 @@ This article assumes you've [logged in](/help/logging-in) to each organization a
 
 {tab|desktop}
 
-1. Open the **left sidebar** (`Ctrl+Shift+s` or `Cmd+Shift+s`).
+1. Open the **left sidebar** (`Ctrl+Shift+s`).
 
 1. Click on your organization's profile picture.