<div>
  <br/>
  <!--<div class="text">-->
    <!--<p>Color Legend</p>-->
    <!--<div ng-repeat="(name, style) in morph.colorMap()">-->
      <!--<span ng-style="style">{{ name }}</span>-->
    <!--</div>-->
  <!--</div>-->
  <!--<div delimiter/>-->
  <div class="text">
    <p class="text">Keyboard Hotkeys</p>
    <div class="small-12 columns scrollable" style="height: 400px">
      <ul class="no-list" ng-repeat="(section, keys) in kC.activeKeys">
        <li>{{ section }}</li>
        <table class="small">
          <tr ng-repeat="(name, key) in keys">
            <td><strong>{{ key }}</strong></td><td>{{ name}}</td>
          </tr>
        </table>
      </ul>
    </div>
  </div>
</div>

<div>
  <br/>
  <!--<div class="text">-->
    <!--<p>Color Legend</p>-->
    <!--<div ng-repeat="(name, style) in morph.colorMap()">-->
      <!--<span ng-style="style">{{ name }}</span>-->
    <!--</div>-->
  <!--</div>-->
  <!--<div delimiter/>-->
  <div class="text">
    <p
      class="text underline clickable"
      ng-click="keyHelpVisible = !keyHelpVisible">
      Keyboard Hotkeys
    </p>
    <div
      class="small-12 columns scrollable slide"
      style="height: 400px"
      ng-if="keyHelpVisible">
      <ul class="no-list" ng-repeat="(section, keys) in kC.activeKeys">
        <li>{{ section }}</li>
        <table class="small">
          <tr ng-repeat="(name, key) in keys">
            <td><strong>{{ key }}</strong></td><td>{{ name}}</td>
          </tr>
        </table>
      </ul>
    </div>
  </div>
</div>

Use custom sliding for keyboard hotkeys
Use custom sliding for keyboard hotkeys
