Blogs are great for giving light to the inner workings of your life, company, product, etc. We've aimed for a simple and clean blog feel with emphasis on the content.
View DemoTitle Transition
A captivating, full page transition that elegantly leads into the article text.
<div class="title-transition section white valign-wrapper">
<div class="row valign">
<div class="col s6 offset-s3 blog-title fade-transition">
<h1>Something Interesting</h1>
<span class="date">January 31, 2016</span>
</div>
</div>
</div>Author Element
Use this author element to show who wrote the article and when. The author avatar has a border hover animation as well.
2016
January 31st
<div class="blog-author">
<div class="divider"></div>
<div class="avatar-wrapper">
<div class="avatar">
<img src="http://placehold.it/128x128" alt="">
</div>
</div>
<div class="author">
<span>Author</span>
Jane Doe
</div>
<div class="date">
<span>2016</span>
January 31st
</div>
<div class="divider"></div>
</div>Related Element
You can show related articles with this element. It is similar in style to the author element giving things a cohesive look.
<div class="blog-related">
<ul>
<li>
<a href="#">
<span class="avatar-wrapper">
<span class="avatar">
<img src="http://placehold.it/128x128" alt="">
</span>
</span>
<span class="title">The Greatest Blog Article</span>
<span class="date">12 / 23 / 2015</span>
</a>
</li>
<li>
<a href="#">
<span class="avatar-wrapper">
<span class="avatar">
<img src="http://placehold.it/128x128" alt="">
</span>
</span>
<span class="title">Interesting New Technology</span>
<span class="date">10 / 4 / 2015</span>
</a>
</li>
</ul>
</div>