<div class='list'>
  <div class='well'>
  <ul class='nav nav-list'>
    {{#each content}}
    <li {{bindAttr class="this.selected:active"}}><a {{action selectStyle this target="controller"}}>{{this.description}}</a></li>
    {{/each}}
  </ul>
  </div>

  <button {{action newCustomization target="controller"}} class='btn btn-primary'>New</button> 
</div>

{{#if content.selectedItem}}
<div class='current-style'> 
  <div class='admin-controls'>
    <ul class="nav nav-pills">
      <li {{bindAttr class="view.stylesheetActive:active"}}>
        <a {{action selectStylesheet href="true" target="view"}}>{{i18n admin.customize.css}}</a>
      </li>
      <li {{bindAttr class="view.headerActive:active"}}>
        <a {{action selectHeader href="true" target="view"}}>{{i18n admin.customize.header}}</a>
      </li>
    </ul>
  </div>  

  {{#with content.selectedItem}}
    {{view Ember.TextField class="style-name" valueBinding="name"}}
    {{#if view.headerActive}}
      {{view Discourse.AceEditorView contentBinding="header" mode="html"}}
    {{/if}}
    {{#if view.stylesheetActive}}
      {{view Discourse.AceEditorView contentBinding="stylesheet" mode="css"}}
    {{/if}}
  {{/with}}
  <br>
  <div class='status-actions'>
    <span>{{i18n admin.customize.override_default}} {{view Ember.Checkbox checkedBinding="content.selectedItem.override_default_style"}}</span>
    <span>{{i18n admin.customize.enabled}}  {{view Ember.Checkbox checkedBinding="content.selectedItem.enabled"}}</span>
    {{#unless content.selectedItem.changed}}
    <a class='preview-link' {{bindAttr href="content.selectedItem.previewUrl"}} target='_blank'>{{i18n admin.customize.preview}}</a>
    | 
    <a href="/?preview-style=" target='_blank'>{{i18n admin.customize.undo_preview}}</a><br>
    {{/unless}}
  </div>

  <div class='buttons'>
    <button {{action save target="controller"}} {{bindAttr disabled="content.selectedItem.disableSave"}} class='btn btn-primary'>{{i18n admin.customize.save}}</button> 
    <a {{action destroy target="controller"}} class='delete-link'>{{i18n admin.customize.delete}}</a> 
    <span class='saving'>{{content.savingStatus}}</span>
  </div>

</div>
{{/if}}
<div class='clearfix'></div>