givanse/mvc-tree

<h4 class="bg-info text-info">Pattern Elements</h4>

<div>
  <div class="col-xs-12 col-md-6">
  </div>
  <div class="hidden-sm col-md-6">
    {{c-select
      options=availablePatterns
      selected=selectedPatternId
      prompt='compare to:'
      action='showSelectedPattern'
    }}
  </div>
</div>

<!-- definitions current -->
<div class="col-xs-12 col-md-6">
  <ul class="list-group">
    {{#each currDefinitions as |definition|}}
      <li class="list-group-item">
        <b>{{definition.term}}</b>: {{definition.text}}
      </li>
    {{/each}}
  </ul>
</div>

<!-- definitions comparing to -->
<div class="col-md-6">
  <div class="visible-sm-block">
    <!-- TODO: refactors this CSS, clean the select copy pasta, use contextual component -->
    {{c-select
      options=availablePatterns
      selected=selectedPatternId
      prompt='compare to:'
      action='showSelectedPattern'
    }}
  </div>
  <ul class="list-group compare_to">
    {{#each selectedPattern.definitions as |definition|}}
      <li class="list-group-item">
        <b>{{definition.term}}</b>: {{definition.text}}
      </li>
    {{/each}}
  </ul>
</div>