News Articles

News article lists can be displayed without preview text.


Alternate Text Goes Here
This Is The Article Title

Conveniently matrix technically sound infrastructures through timely methodologies. Intrinsicly evisculate clicks-and-mortar ROI for flexible e-tailers. Seamlessly communicate highly efficient architectures and clicks-and-mortar e-markets. Authoritatively grow standardized deliverables before proactive infomediaries. Continually create process-centric interfaces before optimal scenarios. Holisticly disintermediate 24/365 deliverables rather than intuitive resources.

This Is The Article Title For An Article Without A Thumbnail And It's A Really, Really Long Title

Conveniently matrix technically sound infrastructures through timely methodologies. Intrinsicly evisculate clicks-and-mortar ROI for flexible e-tailers. Seamlessly communicate highly efficient architectures and clicks-and-mortar e-markets.

Alternate Text Goes Here
This Is The Article Title

Conveniently matrix technically sound infrastructures through timely methodologies. Intrinsicly evisculate clicks-and-mortar ROI for flexible e-tailers.


<div class="news-articles news-articles--list" id="">

    <div class="news-article" id="">

        <div class="news-article-image image">
            <a href="[URL]"><img width="XXX" height="YYY" alt="[Alternate Text Goes Here]" src="path/to/foo.jpg"></a>
        </div>
    
        <div class="news-article-details">

            <div class="news-article-header">
        
                <div class="news-article-meta news-article-meta--date">
                    <span class="date-month">May</span><span class="separator"> </span><span class="date-day">15</span><span class="separator">, </span><span class="date-year">2014</span>
                </div>
        
                <div class="news-article-title">
                    <h5><a href="[URL]">[Article Title Goes Here]</a></h5>
                </div>
    
                <div class="news-article-meta news-article-meta--author">
                    <span class="prefix">by</span><span class="author-name">[Author Name Goes Here]</span>
                </div>        

            </div>
        
            <div class="news-article-description">

                [Article Description Goes Here]

            </div>
            
        </div>
    
    </div>
    
    [...]

    <div class="news-article" id="">

        <div class="news-article-image image">
            <a href="[URL]"><img width="XXX" height="YYY" alt="[Alternate Text Goes Here]" src="path/to/foo.jpg"></a>
        </div>
    
        <div class="news-article-details">

            <div class="news-article-header">
        
                <div class="news-article-meta news-article-meta--date">
                    <span class="date-month">May</span><span class="separator"> </span><span class="date-day">15</span><span class="separator">, </span><span class="date-year">2014</span>
                </div>
        
                <div class="news-article-title">
                    <h5><a href="[URL]">[Article Title Goes Here]</a></h5>
                </div>
    
                <div class="news-article-meta news-article-meta--author">
                    <span class="prefix">by</span><span class="author-name">[Author Name Goes Here]</span>
                </div>        

            </div>
        
            <div class="news-article-description">

                [Article Description Goes Here]

            </div>
            
        </div>
    
    </div>
    
    <div class="news-articles-archive">
        <a href="[URL]">Archive Link</a>
    </div>
    
</div>

Class Reference

Class Info
news-articles Primary container. Should be added to a div.
news-articles--list Denotes a list of news articles.
news-articles--article Denotes a single article view.
news-article Denotes a single news article. Should be added to a div.
news-article-image Denotes an article's image. Should be added to a div.
news-article-details Contains the article's header, meta info, and description. Should be added to a div. Only appears on article list view.
news-article-header Denotes an article's header, including title and meta info (date, author). Should be added to a div.
news-article-title The article's title container. Should be added to a div.
news-article-meta Denotes a "news article meta info" container. Should be added to a div.
news-article-meta--date The article's post date container. Should be added to a span.
news-article-meta--author The article's author container. Should be added to a span.
news-article-description Denotes an article's description. Should be added to a div. Only appears on article list view.
news-article-content Denotes an article's content (e.g., image, text) Should be added to a div. Only appears on single article view.
news-article-comments Denotes an article's comments. Should be added to a div. Only appears on single article view.
news-articles-archive Denotes a link to the article archive. Should be added to a div. Only appears on article list view.
news-article-return Denotes a "return to articles list" link. Should be added to a div. Only appears on single article view.