manyi/static/angular-mod/tpl/page_post.html

<div class="bg-light lter b-b wrapper-md">
  <h1 class="m-n font-thin h3">Post</h1>
</div>
<div class="wrapper-md">
  <div class="row">
    <div class="col-sm-9">
      <div class="blog-post">                   
        <div class="panel">
          <div>
            <img src="img/c0.jpg" class="img-full">
          </div>
          <div class="wrapper-lg">
            <h2 class="m-t-none"><a href>7 things you need to know about the flat design</a></h2>
            <div>
              <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi id neque quam. Aliquam sollicitudin venenatis ipsum ac feugiat. Vestibulum ullamcorper sodales nisi nec condimentum. Mauris convallis mauris at pellentesque volutpat. 
              <br><br>
              Phasellus at ultricies neque, quis malesuada augue. Donec eleifend condimentum nisl eu consectetur. Integer eleifend, nisl venenatis consequat iaculis, lectus arcu malesuada sem, dapibus porta quam lacus eu neque.</p>
            </div>
            <div class="line line-lg b-b b-light"></div>
            <div class="text-muted">
              <i class="fa fa-user text-muted"></i> by <a href class="m-r-sm">Admin</a>
              <i class="fa fa-clock-o text-muted"></i> Feb 20, 2013
              <a href class="m-l-sm"><i class="fa fa-comment-o text-muted"></i> 2 comments</a>
            </div>
          </div>
        </div>
        <div class="panel">
          <div class="wrapper-lg">
            <h2 class="m-t-none"><a href>Bootstrap 3: What you need to know</a></h2>
            <div>
              <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi id neque quam. Aliquam sollicitudin venenatis ipsum ac feugiat. Vestibulum ullamcorper sodales nisi nec condimentum. Mauris convallis mauris at pellentesque volutpat. 
              </p>
              <h3>Html5 and CSS3</h3>
              <p>
              Phasellus at ultricies neque, quis malesuada augue. Donec eleifend condimentum nisl eu consectetur. Integer eleifend, nisl venenatis consequat iaculis, lectus arcu malesuada sem, dapibus porta quam lacus eu neque.</p>
            </div>
            <div class="line line-lg b-b b-light"></div>
            <div class="text-muted">
              <i class="fa fa-user text-muted"></i> by <a href class="m-r-sm">Admin</a>
              <i class="fa fa-clock-o text-muted"></i> Feb 15, 2013
              <a href class="m-l-sm"><i class="fa fa-comment-o text-muted"></i> 4 comments</a>
            </div>
          </div>
        </div>
      </div>
      <div class="text-center m-t-lg m-b-lg">
        <ul class="pagination pagination-md">
          <li><a href><i class="fa fa-chevron-left"></i></a></li>
          <li class="active"><a href>1</a></li>
          <li><a href>2</a></li>
          <li><a href>3</a></li>
          <li><a href>4</a></li>
          <li><a href>5</a></li>
          <li><a href><i class="fa fa-chevron-right"></i></a></li>
        </ul>
      </div>
      <h4 class="m-t-lg m-b">3 Comments</h4>
      <div>
        <div>
          <a class="pull-left thumb-sm">
            <img src="img/a0.jpg" class="img-circle">
          </a>
          <div class="m-l-xxl m-b">
            <div>
              <a href><strong>John smith</strong></a>
              <label class="label bg-info m-l-xs">Editor</label> 
              <span class="text-muted text-xs block m-t-xs">
                24 minutes ago
              </span>
            </div>
            <div class="m-t-sm">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi id neque quam. Aliquam sollicitudin venenatis ipsum ac feugiat. Vestibulum.</div>
          </div>
        </div>

        <div class="m-l-xxl">
          <a class="pull-left thumb-sm">
            <img src="img/a1.jpg" class="img-circle">
          </a>
          <div class="m-l-xxl m-b">
            <div>
              <a href><strong>John smith</strong></a>
              <label class="label bg-dark m-l-xs">Admin</label> 
              <span class="text-muted text-xs block m-t-xs">
                26 minutes ago
              </span>
            </div>
            <div class="m-t-sm">Lorem ipsum dolor sit amet, consecteter adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet.</div>
          </div>
        </div>

        <div>
          <a class="pull-left thumb-sm">
            <img src="img/a2.jpg" class="img-circle">
          </a>
          <div class="m-l-xxl m-b">
            <div>
              <a href><strong>John smith</strong></a>
              <label class="label bg-dark m-l-xs">Admin</label> 
              <span class="text-muted text-xs block m-t-xs">
                26 minutes ago
              </span>
            </div>
            <blockquote class="m-t">
              <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p>
              <small>Someone famous in <cite title="Source Title">Source Title</cite></small>
            </blockquote>
            <div class="m-t-sm">Lorem ipsum dolor sit amet, consecteter adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet.</div>
          </div>
        </div>

      </div>
      <h4 class="m-t-lg m-b">Leave a comment</h4>
      <form>
        <div class="form-group pull-in clearfix">
          <div class="col-sm-6">
            <label>Your name</label>
            <input type="text" class="form-control" placeholder="Name">
          </div>
          <div class="col-sm-6">
            <label >Email</label>
            <input type="email" class="form-control" placeholder="Enter email">
          </div>
        </div>
        <div class="form-group">
          <label>Comment</label>
          <textarea class="form-control" rows="5" placeholder="Type your comment"></textarea>
        </div>
        <div class="form-group">
          <button type="submit" class="btn btn-success">Submit comment</button>
        </div>
      </form>
    </div>
    <div class="col-sm-3">
      <h5 class="font-bold">Categories</h5>
      <ul class="list-group">
        <li class="list-group-item">
          <a href>
            <span class="badge pull-right">15</span>
            Photograph
          </a>
        </li>
        <li class="list-group-item">
          <a href>
            <span class="badge pull-right">30</span>
            Life style
          </a>
        </li>
        <li class="list-group-item">
          <a href>
            <span class="badge pull-right">9</span>
            Food
          </a>
        </li>
        <li class="list-group-item">
          <a href>
            <span class="badge pull-right">4</span>
            Travel world
          </a>
        </li>
      </ul>
      <div class="tags m-b-lg l-h-2x">
        <a href class="label bg-primary">Bootstrap</a> <a href class="label bg-primary">Application</a> <a href class="label bg-primary">Apple</a> <a href class="label bg-primary">Less</a> <a href class="label bg-primary">Theme</a> <a href class="label bg-primary">Wordpress</a>
      </div>
      <h5 class="font-bold">Recent Posts</h5>
      <div>
        <div>
          <a class="pull-left thumb thumb-wrapper m-r">
            <img src="img/b0.jpg">
          </a>
          <div class="clear">                        
            <a href class="font-semibold text-ellipsis">Bootstrap 3: What you need to know</a>
            <div class="text-xs block m-t-xs"><a href>Travel</a> 2 minutes ago</div>
          </div>
        </div>
        <div class="line"></div>
        <div>
          <a class="pull-left thumb thumb-wrapper m-r">
            <img src="img/b1.jpg">
          </a>
          <div class="clear">                        
            <a href class="font-semibold text-ellipsis">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</a>
            <div class="text-xs block m-t-xs"><a href>Design</a> 2 hours ago</div>
          </div>
        </div>
        <div class="line"></div>
        <div>
          <a class="pull-left thumb thumb-wrapper m-r">
            <img src="img/b2.jpg">
          </a>
          <div class="clear">                        
            <a href class="font-semibold text-ellipsis">Sed diam nonummy nibh euismod tincidunt ut laoreet</a>
            <div class="text-xs block m-t-xs"><a href>MFC</a> 1 week ago</div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>