superdesk/superdesk-client-core

<div class="sd-page__main-content">
  <div class="sd-page__header sd-page__header--white">
    <h2 class="sd-page__page-heading" translate>Templates</h2>
  </div>
  <div class="sd-page__header">
        <sd-search-handler ng-model="query.template_name" data-debounce="200"></sd-search-handler>
        <div class="sortbar">
           <span class="lab" translate>Filter:</span>
           <div class="dropdown" dropdown sd-dropdown-position>
             <button id="order_button" class="dropdown__toggle" dropdown__toggle>{{ filters[activeFilter].label | translate }} <b class="dropdown__caret"></b>
             </button>
             <ul class="dropdown__menu" id="order_selector" style="max-height: 400px;overflow-y: scroll;">
                <li ng-repeat="f in filters track by $index" ng-class="{active: activeFilter === $index}">
                  <a href="" ng-click="filterBy($index)">{{ f.label | translate }}</a>
                </li>
             </ul>
           </div>
        </div>
        <span class="sd-page__element-grow"></span>
        <button class="btn btn--primary" ng-click="edit()">
          <i class="icon-plus-sign icon--white"></i><span translate>Add New</span>
        </button>
  </div>

  <div class="sd-page__content">
      <div class="flex-grid box wrap-items small-1 medium-3 large-4 xlarge-6">
          <div class="flex-item card-box template-card" ng-repeat="template in content_templates._items | filter:query | templatesBy:filters[activeFilter]" ng-if="desks" data-test-id="content-template--{{template.template_name}}">
              <div class="card-box__header" ng-class="{'card-box__header--dark': !template.is_public}" >
                  <div class="dropdown" dropdown>
                      <button class="dropdown__toggle" dropdown__toggle data-test-id="template-actions">
                          <i class="icon-dots-vertical"></i>
                      </button>
                      <ul class="dropdown__menu more-activity-menu pull-right" data-test-id="template-actions--options">
                          <li><div class="dropdown__menu-label" translate>Actions</div></li>
                          <li class="dropdown__menu-divider"></li>
                          <li><button ng-click="edit(template)" title="{{:: 'Edit Template' | translate }}"><i class="icon-pencil"></i>{{:: 'Edit'| translate}}</button></li>
                          <li ng-if="template.template_type !== 'kill'"><button ng-click="remove(template)" title="{{:: 'Remove Template' | translate }}"><i class="icon-trash"></i>{{:: 'Remove'| translate}}</button></li>
                      </ul>
                  </div>
                  <div class="card-box__heading">{{ template.template_name }}</div>
              </div>
              <div class="card-box__content">
                  <ul class="card-box__content-list">
                      <li>
                          <h4 class="with-value">{{ :: 'Template type' | translate }} <span class="value-label">{{ template.template_type | translate }}</span></h4>
                      </li>
                      <li ng-if="isPrivate(template)">
                          <h4>{{ :: 'Owner' | translate }}</h4>
                          <span>{{ getTemplateOwner(template) }}</span>
                      </li>
                      <li ng-if="getTemplateDesks(template)">
                          <h4>{{ :: 'Desk(s)' | translate }}</h4>
                          <span>{{getTemplateDesks(template)}}</span>
                      </li>
                      <li ng-if="template.schedule_desk">
                          <h4>{{ :: 'Sched. Desk / Stage' | translate }}</h4>
                          <span>{{getScheduleDesk(template)}}</span>
                          <span ng-if="getScheduleStage(template)"> / {{getScheduleStage(template)}}</span>
                      </li>
                      <li ng-if="template.schedule.is_active">
                          <h4>{{ :: 'Automated item creation' | translate }}</h4>
                          <span ng-repeat="day in template.schedule.day_of_week">
                              {{ :: weekdays[day] | translate }}
                              <span ng-if="$index < template.schedule.day_of_week.length-1">, </span>
                          </span>
                      </li>
                      <li ng-if="template.schedule.cron_list.length">
                          <h4>{{ :: 'Scheduled Time(s)' | translate }}</h4>
                          <i class="icon-time"></i> <span ng-repeat="cron in template.schedule.cron_list" class="creation-time"> {{ cron.split(' ')[1] + ':' + cron.split(' ')[0] }}<span ng-if="!$last">,&nbsp;</span><span>
                      </li>
                  </ul>
              </div>
          </div>
      </div>
  </div>
</div>

<div sd-template-editor-modal ng-if="template"></div>