old-holivud2/app/views/video_analyses/_keyboard_shortcuts.html.erb

<div class="mt-1">
  <%= link_to "#keyboard_shortcuts", data: { toggle: "collapse" } do %>
    <%= fa_icon "info-circle" %> View Keyboard Shortcuts
  <% end %>
</div>
<div class="collapse" id="keyboard_shortcuts">
  <ul class="list-group">
    <li class="list-group-item">
      <div class="d-flex flex-row justify-content-between">
        <div>
          <%= fa_icon "play" %> <%= fa_icon "stop" %>
        </div>
        <div class="ml-5">
          <span class="keyboard-key">space</span>
        </div>
      </div>
    </li>
    <li class="list-group-item">
      <div class="d-flex flex-row justify-content-between">
        <div>
          <%= fa_icon "step-backward" %> <small>Back 5s</small>
        </div>
        <div class="ml-5">
          <span class="keyboard-key">&#8592;</span>
        </div>
      </div>
    </li>
    <li class="list-group-item">
      <div class="d-flex flex-row justify-content-between">
        <div>
          <%= fa_icon "step-forward" %> <small>Forward 5s</small>
        </div>
        <div class="ml-5">
          <span class="keyboard-key">&#8594;</span>
        </div>
      </div>
    </li>
    <li class="list-group-item">
      <div class="d-flex flex-row justify-content-between">
        <div>
          <%= fa_icon "trash" %> <small>Delete Marker</small>
        </div>
        <div class="ml-5">
          <span class="keyboard-key">d</span>
        </div>
      </div>
    </li>
  </ul>
</div>