@(metaData:Page, article: Article, storyPackage: List[Trail])(implicit request: RequestHeader) @main(metaData, Switches.all){ }{

@metaData.webTitle

Article header

@{ val datelineHTML = views.html.fragments.dateline(article.webPublicationDate, article.isLive).toString() fragments.module("dateline", "Dateline", datelineHTML, "Will show a 'LIVE' label where the content is a currently-updating liveblog.") } @{ val relativeDateHTML = views.html.fragments.relativeDate(article.webPublicationDate, article.isLive, isFront=false).toString() fragments.module("relative-date", "Relative dateline", relativeDateHTML, "Updated using JavaScript to be relative to the client's current locale. Note: The 'four hours ago'-style notation only happens within the first day of publication.") } @{ val headlineHTML = views.html.fragments.headline(article.headline).toString() fragments.module("headline", "Headline", headlineHTML, "This should always be an H1 for SEO purposes, so ensure this module is used sparingly and appropriately.") } @{ val standfirstHTML = views.html.fragments.standfirst(article).toString() fragments.module("standfirst", "Standfirst", standfirstHTML, "Uses a paragraph rather than a heading as they can become quite lengthy in many cases.") } @article.mainPicture.map{ mainPicture => @article.mainPicture(width=220).map{ smallCrop => @{ val mainPictureHTML = views.html.fragments.img(mainPicture, smallCrop).toString() fragments.module("main-picture", "Main Picture", mainPictureHTML, "Makes use of our responsive images technique – images are replaced with their 'fullsrc' version if the connection is speed is fast enough and the device width is large enough. Images can be forced to upgrade regardless of these tests by adding the 'force-upgrade' data attribute, as used here. Images will not be upgraded if the width of the 'fullsrc' image is not greater than the thumbnail width.") } } } @{ val bylineHTML = views.html.fragments.byline(article.byline, article).toString() fragments.module("byline", "Byline", bylineHTML, "Linked to the author's contributor tag page (if found).") }

Quotes

Tweet

A tweet block

  1. Output
  2. Source code
— Angelique Chrisafis (@Html("@achrisafis")) December 21, 2012

Baffled local builder said he kept getting filmed. "Workman walks down street, must be very exciting" #bugarach #endoftheworld

    <blockquote class="tweet">
        <span class="tweet-user">— Angelique Chrisafis (@Html("@achrisafis"))</span>
        <a href="https://twitter.com/achrisafis/status/282088154050203648" data-datetime="2012-12-21T11:40:31+00:00"
            data-link-name="in body link" class="tweet-date">December 21, 2012</a>
        <p class="tweet-body">Baffled local builder said he kept getting filmed. "Workman walks down street, must be very exciting"
            <a href="https://twitter.com/search/%23bugarach" data-link-name="in body link">#bugarach</a>
            <a href="https://twitter.com/search/%23endoftheworld" data-link-name="in body link">#endoftheworld</a>
        </p>
    </blockquote>
                            

Quote

A quote.

N.B. This currently relies on a parent HTML class of .block

  1. Output
  2. Source code

In all the excitement over the discovery of a Higgs-like particle at Cern this year, physicists at the lab were probably not thinking about the end of the world. But the Standard Model of particle physics – of which the Higgs boson is part and which describes fundamental particles and forces of nature – hides a terrifying secret: a theoretical composite particle that is so stable it can transform any other particle of matter into a copy of itself.

    <blockquote >
        <p>In all the excitement over the discovery of a <a href="/science/2012/jul/04/higgs-boson-cern-scientists-discover" data-link-name="in body link">Higgs-like particle</a> at Cern this year, physicists at the lab were probably not thinking about the end of the world. But the Standard Model of particle physics – of which the Higgs boson is part and which describes fundamental particles and forces of nature – hides a terrifying secret: a theoretical composite particle that is so stable it can transform any other particle of matter into a copy of itself.</p>
    </blockquote>
                            

Pull quote

A pull quote

N.B. This currently relies on a parent HTML class of .from-content-api

  1. Output
  2. Source code

In all the excitement over the discovery of a Higgs-like particle at Cern this year, physicists at the lab were probably not thinking about the end of the world. But the Standard Model of particle physics – of which the Higgs boson is part and which describes fundamental particles and forces of nature – hides a terrifying secret: a theoretical composite particle that is so stable it can transform any other particle of matter into a copy of itself.

    <blockquote class="quoted">
        <p>In all the excitement over the discovery of a <a href="/science/2012/jul/04/higgs-boson-cern-scientists-discover" data-link-name="in body link">Higgs-like particle</a> at Cern this year, physicists at the lab were probably not thinking about the end of the world. But the Standard Model of particle physics – of which the Higgs boson is part and which describes fundamental particles and forces of nature – hides a terrifying secret: a theoretical composite particle that is so stable it can transform any other particle of matter into a copy of itself.</p>
    </blockquote>
                            

Trailblocks

@{ val trailFeaturedHTML = views.html.fragments.trailblocks.section(Seq(storyPackage(0)), numWithImages = 0, related = false, showFeatured = true).toString() fragments.module("trail-featured", "Trail: featured", trailFeaturedHTML, "Generally used for a large trail as seen on network/section fronts.") } @{ val trailThumbnailHTML = views.html.fragments.trailblocks.section(Seq(storyPackage(0)), numWithImages = 1, related = false, showFeatured = false).toString() fragments.module("trail-thumbnail", "Trail: thumbnail", trailThumbnailHTML, "Typically displayed in threes when showing multiple trails.") } @{ val trailHeadlineHTML = views.html.fragments.trailblocks.section(Seq(storyPackage(0)), numWithImages = 0, related = false, showFeatured = false).toString() fragments.module("trail-headline", "Trail: headline", trailHeadlineHTML, "Usually used to show underneath three 'trail: thumbnail' trails.") }

Headers

@{ val sectionHeadHTML = views.html.fragments.headers.sectionHead("Life & Style").toString() fragments.module("section-head", "Section head", sectionHeadHTML, "Usually used as page head on section & tag pages.") } @{ val edition = Edition(request) val frontSectionHeadHTML = views.html.fragments.headers.frontSectionHead(ItemTrailblockDescription("lifeandstyle", "Life & Style", 5)(edition), Some(edition)).toString() fragments.module("front-section-head", "Front section head", frontSectionHeadHTML, "Usually used as section head on network front") }
}