Media Object

index.html

<!--Using markup from docs-->
<div class="media-object stack-for-small">
    <div class="media-object-section">
        <div class="thumbnail">
            <img src= "//placehold.it/150x150">
        </div>
    </div>
    <div class="media-object-section main-section">
        <h3>Using normal markup </h3>
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Asperiores maiores sunt vero! Nisi, qui!</p>
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ab, beatae cumque distinctio molestiae necessitatibus nostrum reiciendis repellendus tenetur. A consequatur dolor dolores dolorum ipsum maxime, quia sed tempore voluptatibus voluptatum!</p>
        <a href="/internships/single.html" class="button">Read More</a>
    </div>
</div>


<hr>

<!--Using component-->
<div class="MediaObject stack-for-small">
    <div class="MediaObject__section">
        <div class="thumbnail">
            <img src= "//placehold.it/150x150">
        </div>
    </div>
    <div class="MediaObject__section main-section">
        <h3>Component</h3>
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Asperiores maiores sunt vero! Nisi, qui!</p>
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ab, beatae cumque distinctio molestiae necessitatibus nostrum reiciendis repellendus tenetur. A consequatur dolor dolores dolorum ipsum maxime, quia sed tempore voluptatibus voluptatum!</p>
        <a href="/internships/single.html" class="button">Read More</a>
    </div>
</div>

MediaObject.scss

.MediaObject {
  @include media-object-container;


  &__section{
    @include media-object-section();
  }
}