superdesk/superdesk-client-core

<div class="package-item item {{ :: data.type }}" ng-class="{locked: isLocked, published: isPublished, killed: isKilled}">
  <div class="package-item__drag-handle"></div>
  <figure class="package-item__icon-holder" ng-if="data.type === 'composite' || data.type === 'text'">
    <i class="filetype-icon-large-{{ :: data.type }}"></i>
  </figure>

  <div class="package-item__thumb-holder" ng-if="data.type !== 'composite' && data.type !== 'text'">
    <div class="alert-error" ng-show="error" translate>Problems occurred while fetching data.</div>
    <div class="loading" ng-show="data == null && error == null"></div>
    <div class="error-icon" ng-show="error != null"><i class="filetype-icon-large-{{data.type}}"></i></div>
    <div ng-if="data.type === 'picture' || data.type === 'graphic'" sd-item-rendition data-item="data" data-rendition="thumbnail" ng-click="preview(data)"></div>
    <audio ng-if="data.type === 'audio'" controls="controls" sd-sources data-renditions="data.renditions" ng-show="data"></audio>
    <div ng-if="data.type === 'video'"><i class="filetype-icon-large-video"></i></div>
  </div>

  <div class="package-item__item-text-group">
    <div class="package-item__item-headline">
      <div ng-show=":: data.headline || data.slugline || data.description_text">{{ :: data.headline || data.slugline || data.description_text}}</div>
      <div ng-show=":: data.anpa_take_key">{{ :: data.anpa_take_key}}</div>
      <div ng-hide=":: data.headline || data.slugline || data.description_text" translate>Blank headline received</div>
    </div>
    <div>
      <span ng-if="data.pubstatus === 'canceled'" title="unpublished" class="state-label state-unpublished">unpublished</span>
      <span ng-if="label" class="state-label state-in_progress" translate>label: <b>{{label.name}}</b></span></span>
      <span class="package-item__item-creator">
        Created <time sd-datetime data-date="data.firstcreated" data-from-now="true"></time>
        <span ng-if="userLookup[data.original_creator]">by <b>{{userLookup[data.original_creator].display_name}}</b></span>
      </span>
    </div>

    <div class="package-item__item-abstract" ng-if="data.abstract" ng-bind-html="data.abstract"></div>
  </div>

  <div class="package-item__action-menu" sd-item-actions-menu data-item="data" data-active="data"></div>

  <div class="package-details" ng-if="data.type === 'composite'"><i class="svg-icon-right"></i></div>
  <div class="alert-error" ng-show="error" translate ng-if="data.type == 'composite' || data.type == 'text'">Problems occurred while fetching data.</div>
</div>