Select Git revision
Kruták László authored
blog.html 10.37 KiB
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta charset="utf-8">
<title>Blog Template</title>
<meta name="generator" content="Bootply" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.min.css" rel="stylesheet">
<!--[if lt IE 9]>
<script src="//html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<link href="css/styles.css" rel="stylesheet">
</head>
<body>
<header class="navbar navbar-default navbar-fixed-top" role="banner">
<div class="container">
<div class="navbar-header">
<button class="navbar-toggle" type="button" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a href="/" class="navbar-brand">Home</a>
</div>
<nav class="collapse navbar-collapse" role="navigation">
<ul class="nav navbar-nav">
<li>
<a href="#">Category</a>
</li>
<li>
<a href="#">Category</a>
</li>
<li>
<a href="#">Category</a>
</li>
<li>
<a href="#">Category</a>
</li>
</ul>
<ul class="nav navbar-right navbar-nav">
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown"><i class="glyphicon glyphicon-search"></i></a>
<ul class="dropdown-menu" style="padding:12px;">
<form class="form-inline">
<button type="submit" class="btn btn-default pull-right"><i class="glyphicon glyphicon-search"></i></button><input type="text" class="form-control pull-left" placeholder="Search">
</form>
</ul>
</li>
</ul>
</nav>
</div>
</header>
<div id="masthead">
<div class="container">
<div class="row">
<div class="col-md-7">
<h1>Blog
<p class="lead">Catchy Subtitle Here</p>
</h1>
</div>
<div class="col-md-5">
<div class="well well-lg">
<div class="row">
<div class="col-sm-12">
Ad Space
</div> </div>
</div>
</div>
</div>
</div><!-- /cont -->
</div>
<div class="container">
<div class="row">
<div class="col-md-12">
<div class="panel">
<div class="panel-body">
<!--/stories-->
<div class="row">
<br>
<div class="col-md-2 col-sm-3 text-center">
<a class="story-img" href="#"><img src="//placehold.it/100" style="width:100px;height:100px" class="img-circle"></a>
</div>
<div class="col-md-10 col-sm-9">
<h3>Post Entry Title</h3>
<div class="row">
<div class="col-xs-9">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis pharetra varius quam sit amet vulputate.
Quisque mauris augue, molestie tincidunt condimentum vitae, gravida a libero. Aenean sit amet felis
dolor, in sagittis nisi. Sed ac orci quis tortor imperdiet venenatis. Duis elementum auctor accumsan.
Aliquam in felis sit amet augue.</p>
<p class="lead"><button class="btn btn-default">Read More</button></p>
<p class="pull-right"><span class="label label-default">keyword</span> <span class="label label-default">tag</span> <span class="label label-default">post</span></p>
<ul class="list-inline"><li><a href="#">2 Days Ago</a></li><li><a href="#"><i class="glyphicon glyphicon-comment"></i> 4 Comments</a></li><li><a href="#"><i class="glyphicon glyphicon-share"></i> 34 Shares</a></li></ul>
</div>
<div class="col-xs-3"></div>
</div>
<br><br>
</div>
</div>
<hr>
<div class="row">
<br>
<div class="col-md-2 col-sm-3 text-center">
<a class="story-img" href="#"><img src="//placehold.it/100" style="width:100px;height:100px" class="img-circle"></a>
</div>
<div class="col-md-10 col-sm-9">
<h3>Story Title Here</h3>
<div class="row">
<div class="col-xs-9">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis pharetra varius quam sit amet vulputate.
Quisque mauris augue, molestie tincidunt condimentum vitae, gravida a libero. Aenean sit amet felis
dolor, in sagittis nisi. Sed ac orci quis tortor imperdiet venenatis. Duis elementum auctor accumsan.
Aliquam in felis sit amet augue.</p>
<p class="lead"><button class="btn btn-default">Read More</button></p>
<p class="pull-right"><span class="label label-default">keyword</span> <span class="label label-default">tag</span> <span class="label label-default">post</span></p>
<ul class="list-inline"><li><a href="#">3 Days Ago</a></li><li><a href="#"><i class="glyphicon glyphicon-comment"></i> 1 Comments</a></li><li><a href="#"><i class="glyphicon glyphicon-share"></i> 34 Shares</a></li></ul>
</div>
<div class="col-xs-3"></div>
</div>
<br><br>
</div>
</div>
<hr>
<div class="row">
<br> <div class="col-md-2 col-sm-3 text-center">
<a class="story-img" href="#"><img src="//placehold.it/100" style="width:100px;height:100px" class="img-circle"></a>
</div>
<div class="col-md-10 col-sm-9">
<h3>Post Heading Here</h3>
<div class="row">
<div class="col-xs-9">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis pharetra varius quam sit amet vulputate.
Quisque mauris augue, molestie tincidunt condimentum vitae, gravida a libero. Aenean sit amet felis
dolor, in sagittis nisi. Sed ac orci quis tortor imperdiet venenatis. Duis elementum auctor accumsan.
Aliquam in felis sit amet augue.</p>
<p class="lead"><button class="btn btn-default">Read More</button></p>
<p class="pull-right"><span class="label label-default">keyword</span> <span class="label label-default">tag</span> <span class="label label-default">post</span></p>
<ul class="list-inline"><li><a href="#">5 Days Ago</a></li><li><a href="#"><i class="glyphicon glyphicon-comment"></i> 0 Comments</a></li><li><a href="#"><i class="glyphicon glyphicon-share"></i> 45 Shares</a></li></ul>
</div>
<div class="col-xs-3"></div>
</div>
<br><br>
</div>
</div>
<hr>
<div class="row">
<br>
<div class="col-md-2 col-sm-3 text-center">
<a class="story-img" href="#"><img src="//placehold.it/100" style="width:100px;height:100px" class="img-circle"></a>
</div>
<div class="col-md-10 col-sm-9">
<h3>Another Entry Title</h3>
<div class="row">
<div class="col-xs-9">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis pharetra varius quam sit amet vulputate.
Quisque mauris augue, molestie tincidunt condimentum vitae, gravida a libero. Aenean sit amet felis
dolor, in sagittis nisi. Sed ac orci quis tortor imperdiet venenatis. Duis elementum auctor accumsan.
Aliquam in felis sit amet augue.</p>
<p class="lead"><button class="btn btn-default">Read More</button></p>
<p class="pull-right"><span class="label label-default">keyword</span> <span class="label label-default">tag</span> <span class="label label-default">post</span></p>
<ul class="list-inline"><li><a href="#">1 Week Ago</a></li><li><a href="#"><i class="glyphicon glyphicon-comment"></i> 4 Comments</a></li><li><a href="#"><i class="glyphicon glyphicon-share"></i> 34 Shares</a></li></ul>
</div>
<div class="col-xs-3"></div>
</div>
<br><br>
</div>
</div>
<hr>
<!--/stories-->
<a href="/" class="btn btn-primary pull-right btnNext">More <i class="glyphicon glyphicon-chevron-right"></i></a>
</div>
</div>
</div><!--/col-12-->
</div>
</div>
<hr>
<div class="container" id="footer">
<div class="row">
<div class="col col-sm-12">
<h1>Follow Us</h1>
<div class="btn-group">
<a class="btn btn-twitter btn-lg" href="#"><i class="icon-twitter icon-large"></i> Twitter</a> <a class="btn btn-facebook btn-lg" href="#"><i class="icon-facebook icon-large"></i> Facebook</a>
<a class="btn btn-google-plus btn-lg" href="#"><i class="icon-google-plus icon-large"></i> Google+</a>
</div>
</div>
</div>
</div>
<hr>
<footer>
<div class="container">
<div class="row">
<div class="col-sm-6">
<ul class="list-inline">
<li><i class="icon-facebook icon-2x"></i></li>
<li><i class="icon-twitter icon-2x"></i></li>
<li><i class="icon-google-plus icon-2x"></i></li>
<li><i class="icon-pinterest icon-2x"></i></li>
</ul>
</div>
<div class="col-sm-6">
<p class="pull-right">Built with <i class="icon-heart-empty"></i> at <a href="http://www.bootply.com">Bootply</a></p>
</div>
</div>
</div>
</footer>
<!-- script references -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
</body>
</html>