Skip to content

Instantly share code, notes, and snippets.

@wisbey

wisbey/media-block-aside

Last active December 20, 2015 16:39
Show Gist options
  • Save wisbey/6163404 to your computer and use it in GitHub Desktop.
Save wisbey/6163404 to your computer and use it in GitHub Desktop.
Download ZIP
Media block with aside
Raw
media-block-aside
<div class="row">
<div class="l-content-full-width block __media __with-aside">
<h2>Media block with aside</h2>
<div class="row">
<div class="l-content">
<figure>
<img src="http://placehold.it/1000x500&text=img" alt="Image Alt">
<div class="credits">Pete Richardson 'i love this place' MA Fashion and Tetiles.</div>
<figcaption>
This is a information for the image above, it can be either accreditation or a caption. This should not run more than 2 lines. (optional)
</figcaption>
</figure>
<div class="__text">
<h3>Title</h3>
<p class="leader">Quisque fermentum eros sit amet odio suscipit, sit amet porta mi pharetra. In hac habitasse platea dictumst. Nulla facilisi. Morbi interdum fermentum faucibus.</p>
<p>Quisque fermentum eros sit amet odio suscipit, sit amet porta mi pharetra. In hac habitasse platea dictumst. Nulla facilisi. Morbi interdum fermentum faucibus.</p>
<p><a href="#" class="button-link"><span class="hide-descriptive-text">Follow this link to go to more information about</span>Optional button</a></p>
</div>
</div>
<aside>
<p>Quisque fermentum eros sit amet odio suscipit, sit amet porta mi pharetra. In hac habitasse platea dictumst. Nulla facilisi. Morbi interdum fermentum faucibus.</p>
</aside>
</div>
</div>
</div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment