From 19f091535087aca384da2e6e92fc7b4e8b37719f Mon Sep 17 00:00:00 2001
From: Jen Kagan <kaganjd@gmail.com>
Date: Wed, 28 Sep 2016 15:17:29 -0400
Subject: [PATCH] Add shortcuts to shortcut modal

Fixes #16.
---
 .../IDE/components/KeyboardShortcutModal.js   | 29 +++++++++++++++----
 client/styles/components/_modal.scss          |  4 +--
 2 files changed, 25 insertions(+), 8 deletions(-)

diff --git a/client/modules/IDE/components/KeyboardShortcutModal.js b/client/modules/IDE/components/KeyboardShortcutModal.js
index b0c05553..48d2fd03 100644
--- a/client/modules/IDE/components/KeyboardShortcutModal.js
+++ b/client/modules/IDE/components/KeyboardShortcutModal.js
@@ -28,17 +28,34 @@ class KeyboardShortcutModal extends React.Component {
             <span>Save</span>
           </li>
           <li className="keyboard-shortcut-item">
-            <span className="keyboard-shortcut__command">Command + [</span>
-            <span>Indent Code Right</span>
-          </li>
-          <li className="keyboard-shortcut-item">
-            <span className="keyboard-shortcut__command">Command + ]</span>
+            <span className="keyboard-shortcut__command">
+              {this.isMac ? 'Command + [' : 'Control + ['}
+            </span>
             <span>Indent Code Left</span>
           </li>
           <li className="keyboard-shortcut-item">
-            <span className="keyboard-shortcut__command">Command + /</span>
+            <span className="keyboard-shortcut__command">
+              {this.isMac ? 'Command + ]' : 'Control + ]'}
+            </span>
+            <span>Indent Code Right</span>
+          </li>
+          <li className="keyboard-shortcut-item">
+            <span className="keyboard-shortcut__command">
+              {this.isMac ? 'Command + /' : 'Control + /'}
+            </span>
             <span>Comment Line</span>
           </li>
+          <li className="keyboard-shortcut-item">
+            <span className="keyboard-shortcut__command">
+              {this.isMac ? 'Command + Enter' : 'Control + Enter'}</span>
+            <span>Start Sketch</span>
+          </li>
+          <li className="keyboard-shortcut-item">
+            <span className="keyboard-shortcut__command">
+              {this.isMac ? 'Command + Shift + Enter' : 'Control + Shift + Enter'}
+            </span>
+            <span>Stop Sketch</span>
+          </li>
         </ul>
       </section>
     );
diff --git a/client/styles/components/_modal.scss b/client/styles/components/_modal.scss
index 8f276100..e3c37bac 100644
--- a/client/styles/components/_modal.scss
+++ b/client/styles/components/_modal.scss
@@ -80,7 +80,7 @@
 .keyboard-shortcuts {
   @extend %modal;
   padding: #{20 / $base-font-size}rem;
-  width: #{400 / $base-font-size}rem;
+  width: #{450 / $base-font-size}rem;
 }
 
 .keyboard-shortcuts__header {
@@ -104,7 +104,7 @@
 }
 
 .keyboard-shortcut__command {
-  width: 40%;
+  width: 50%;
   font-weight: bold;
   text-align: right;
   padding-right: #{10 / $base-font-size}rem;