Elements

These modular elements can be readily used and customized across pages and in different blocks.


	<div class="media blog-media">
		<a href=""><img class="d-flex" src="assets/img/blog/b1.jpg" alt="Generic placeholder image"></a>
		<div class="circle">
			<h5 class="day">20</h5>
			<span class="month">sep</span>
		</div>
		<div class="media-body">
			<a href="">
				<h5 class="mt-0">Standard Blog Post</h5>
			</a>
			Sodales aliquid, in eget ac cupidatat velit autem numquam ullam ducimus occaecati placeat error.
			<a href="" class="post-link">Read More</a>
			<ul>
				<li>by: Admin</li>
				<li class="text-right">06 Comments</li>
			</ul>
		</div>
	</div>

	<!-- blog single post -->
	<div class="blog-post">
		<div class="media blog-media flex-wrap post-single">
	
		</div>
	</div>
how to use
  • Follow the code example to get the following style. You you want to customize the style you can add classes or modify the existing class property
  • Wrap all blog post contents in .blog-post wrapper
  • For single post style use class .flex-wrap .post-single with .media wrapper

Example: Blog Classic

Generic placeholder image
20
sep
Standard Blog Post
 Sodales aliquid, in eget ac cupidatat velit autem numquam ullam ducimus occaecati placeat error. Read More
  • by: Admin
  • 06 Comments
Generic placeholder image
19
sep
Ipsa maxime similique
 Sodales aliquid, in eget ac cupidatat velit autem numquam ullam ducimus occaecati placeat error. Read More
  • by: Admin
  • 06 Comments
Generic placeholder image
06
sep
reprehenderit facere
 Sodales aliquid, in eget ac cupidatat velit autem numquam ullam ducimus occaecati placeat error. Read More
  • by: Admin
  • 06 Comments
Generic placeholder image
25
sep
dolor veniam aspernatur
 Sodales aliquid, in eget ac cupidatat velit autem numquam ullam ducimus occaecati placeat error. Read More
  • by: Admin
  • 06 Comments

Example: Blog Single Post

blog image
14
sep

Aenean ut arcu ultrices

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam

Eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.

Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora.