make hotkeys look nicer

src/002-config/mousetrapConfig.js

@@ -99,9 +99,23 @@ App.UI.Hotkeys = (function() {
 		}
 		// TODO make key combinations look nicer
 		if (c.length === 1) {
-			return `[${c[0]}]`;
+			return `[${formatHotkey(c[0])}]`;
 		}
-		return `[${c[0]},${c[1]}]`;
+		return `[${formatHotkey(c[0])},${formatHotkey(c[1])}]`;
+	}
+
+	/**
+	 * @param {string} combination
+	 * @returns {string}
+	 */
+	function formatHotkey(combination) {
+		const parts = combination.split("+");
+
+		for (let i = 0; i < parts.length; i++) {
+			parts[i] = capFirstChar(parts[i]);
+		}
+
+		return parts.join("+");
 	}
 
 	/**
@@ -178,7 +192,7 @@ App.UI.Hotkeys = (function() {
 	function settingsCell(container, actionKey, index) {
 		const action = actions[actionKey];
 		const button = App.UI.DOM.appendNewElement("button", container,
-			action.combinations[index] ? action.combinations[index] : "", "combination");
+			action.combinations[index] ? formatHotkey(action.combinations[index]) : "", "combination");
 		button.onclick = () => {
 			if (recording) { return; }
 			recording = true;