Foreign Affairs Style Guide

Magazine -- Special Package list item

This is a special package list item on a magazine page..

Data Sources:

Special Package Header
- selector: .list__header--red
- data_source: field_issue_ssection_header
- comments: Used as a header for special items list
Item Title
- selector: .title
- data_source: node title
- comments: The Special Package item is a reference field(field_issue_ssection_articles) to a content. The data source is from the referenced entity
Item Subtitle
- selector: .deck
- data_source: field_subtitle
- comments: The Special Package item is a reference field(field_issue_ssection_articles) to a content. The data source is from the referenced entity
Item Author
- selector: .author
- data_source: field_display_authors
- comments: The Special Package item is a reference field(field_issue_ssection_articles) to a content. The data source is from the referenced entity
Item Image
- selector: .magazine-list-item__image
- data_source: field_image
- comments: The Special Package item is a reference field(field_issue_ssection_articles) to a content. The data source is from the referenced entity

Images Styles:

Name: medium-crop

The Clinton Legacy

How Will History Judge the Soft Power Secretary of State

Author Name

<article class="magazine-list-article">
  <a class="magazine-list-item__image-link" href="#">
    <img class="magazine-list-item__image" src="/fa_prototype/assets/images/anthology-list-item__image.jpg" />
  </a>
  <div class="data-block">
    <a class="link-block" href="#">
      <h2 class="title">The Clinton Legacy</h2>
    </a>
    <p class="deck"><a href="#">How Will History Judge the Soft Power Secretary of State</a></p>
    <p class="author"><a href="#" rel='author'>Author Name</a></p>
    <a class="magazine-save-article" href="#"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 12 18"><defs></defs><polygon points="0 0 0 18 6.03 13.96 12 18 12 0 0 0"/></svg></a>
  </div>
</article>