gramps
373ebc8c93
952 days continuous production uptime, 40k+ tp/s single node. Original corpo Bitbucket history not included — clean archive commit.
527 lines
25 KiB
HTML
Executable File
527 lines
25 KiB
HTML
Executable File
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<!-- Required meta tags always come first -->
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
|
<meta http-equiv="x-ua-compatible" content="ie=edge">
|
|
<title>Material Design Bootstrap Template</title>
|
|
<!-- Font Awesome -->
|
|
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
|
|
<!-- Bootstrap core CSS -->
|
|
<link href="../css/bootstrap.min.css" rel="stylesheet">
|
|
<!-- Material Design Bootstrap -->
|
|
<link href="../css/mdb.min.css" rel="stylesheet">
|
|
<style>
|
|
.navbar {
|
|
background-color: #6f7782;
|
|
}
|
|
footer.page-footer {
|
|
background-color: #6f7782;
|
|
}
|
|
|
|
</style>
|
|
</head>
|
|
|
|
<body>
|
|
|
|
<!--Main Navigation-->
|
|
<header>
|
|
|
|
<nav class="navbar navbar-expand-lg navbar-dark">
|
|
<div class="container">
|
|
<a class="navbar-brand" href="#"><strong>Navbar</strong></a>
|
|
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent"
|
|
aria-expanded="false" aria-label="Toggle navigation">
|
|
<span class="navbar-toggler-icon"></span>
|
|
</button>
|
|
<div class="collapse navbar-collapse" id="navbarSupportedContent">
|
|
<ul class="navbar-nav mr-auto">
|
|
<li class="nav-item active">
|
|
<a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link" href="#">Features</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link" href="#">Pricing</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link" href="#">Opinions</a>
|
|
</li>
|
|
</ul>
|
|
<ul class="navbar-nav nav-flex-icons">
|
|
<li class="nav-item">
|
|
<a class="nav-link"><i class="fa fa-facebook"></i></a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link"><i class="fa fa-twitter"></i></a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link"><i class="fa fa-instagram"></i></a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
|
|
</header>
|
|
<!--Main Navigation-->
|
|
|
|
<!--Main Layout-->
|
|
<main>
|
|
|
|
<div class="container">
|
|
|
|
<!--Section: Blog v.4-->
|
|
<section class="section section-blog-fw mt-5 pb-3 wow fadeIn">
|
|
|
|
<!--Grid row-->
|
|
<div class="row">
|
|
<div class="col-md-12">
|
|
<!--Featured image-->
|
|
<div class="card card-cascade wider reverse">
|
|
<div class="view view-cascade overlay">
|
|
<img src="https://mdbootstrap.com/img/Photos/Slides/img%20(134).jpg" alt="Wide sample post image">
|
|
<a>
|
|
<div class=""></div>
|
|
</a>
|
|
</div>
|
|
|
|
<!--Post data-->
|
|
<div class="card-body card-body-cascade text-center">
|
|
<h2><a><strong>This is title of the news</strong></a></h2>
|
|
<p>Written by <a>Abby Madison</a>, 26/08/2016</p>
|
|
|
|
<!--Social shares-->
|
|
<div class="social-counters ">
|
|
|
|
<!--Facebook-->
|
|
<a class="btn btn-fb ">
|
|
<i class="fa fa-facebook left "></i>
|
|
<span class="hidden-md-down ">Facebook</span>
|
|
</a>
|
|
<span class="counter ">46</span>
|
|
|
|
<!--Twitter-->
|
|
<a class="btn btn-tw ">
|
|
<i class="fa fa-twitter left "></i>
|
|
<span class="hidden-md-down ">Twitter</span>
|
|
</a>
|
|
<span class="counter ">22</span>
|
|
|
|
<!--Dribbble-->
|
|
<a class="btn btn-dribbble ">
|
|
<i class="fa fa-dribbble left "></i>
|
|
<span class="hidden-md-down ">Dribbble</span>
|
|
</a>
|
|
<span class="counter ">31</span>
|
|
|
|
<!--Comments-->
|
|
<a class="btn btn-blue-grey ">
|
|
<i class="fa fa-comments-o left "></i>
|
|
<span class="hidden-md-down ">Comments</span>
|
|
</a>
|
|
<span class="counter ">18</span>
|
|
|
|
</div>
|
|
<!--Social shares-->
|
|
|
|
</div>
|
|
<!--Post data-->
|
|
</div>
|
|
|
|
<!--Excerpt-->
|
|
<div class="excerpt mt-5 wow fadeIn" data-wow-delay="0.3s">
|
|
<p>At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum
|
|
deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate
|
|
non provident, similique sunt in culpa qui officia deserunt mollitia animi, id est laborum
|
|
et dolorum fuga. Et harum quidem rerum facilis est et expedita distinctio.
|
|
</p>
|
|
|
|
<p>Nam libero tempore, cum soluta nobis est eligendi optio cumque nihil impedit quo minus id quod
|
|
maxime placeat facere possimus, omnis voluptas assumenda est, omnis dolor repellendus. Temporibus
|
|
autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet ut et voluptates
|
|
repudiandae sint et molestiae non recusandae. Itaque earum rerum hic tenetur a sapiente delectus,
|
|
ut aut reiciendis voluptatibus maiores alias consequatur aut perferendis doloribus.</p>
|
|
|
|
<blockquote class="blockquote mt-4 mb-4">
|
|
<p class="mb-0"><em>Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet ut et voluptates repudiandae sint et molestiae non recusandae. Itaque earum rerum hic tenetur a sapiente delectus.</em></p>
|
|
<footer class="blockquote-footer">Someone famous in <cite title="Source Title">Source Title</cite></footer>
|
|
</blockquote>
|
|
|
|
|
|
<p>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.
|
|
</p>
|
|
|
|
<p>Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit,
|
|
sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat
|
|
voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit
|
|
laboriosam, nisi ut aliquid ex ea commodi consequatur? Quis autem vel eum iure reprehenderit
|
|
qui in ea voluptate velit esse quam nihil molestiae consequatur.</p>
|
|
|
|
|
|
<div class="mt-4 d-flex justify-content-end">
|
|
<span class="badge pink">Travel</span>
|
|
<span class="badge badge-primary mx-1">Adventure</span>
|
|
<span class="badge grey mr-1">Photography</span>
|
|
<span class="badge badge-info">Education</span>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!--Grid row-->
|
|
|
|
</section>
|
|
<!--Section: Blog v.4-->
|
|
|
|
<hr class="mb-5 mt-4">
|
|
|
|
<!--Section: Blog v.2-->
|
|
<section class="section extra-margins pb-3 wow fadeIn" data-wow-delay="0.3s">
|
|
|
|
<!--Section heading-->
|
|
<h3 class="text-center my-5 text-center h3 pt-3">Recent posts</h3>
|
|
|
|
<!--Grid row-->
|
|
<div class="row">
|
|
|
|
<!--Grid column-->
|
|
<div class="col-lg-4 col-md-12 mb-4">
|
|
|
|
<!--Card Light-->
|
|
<div class="card">
|
|
<!--Card image-->
|
|
<div class="view overlay">
|
|
<img src="https://mdbootstrap.com/img/Photos/Lightbox/Original/img%20%28147%29.jpg" class="card-img-top" alt="">
|
|
<a>
|
|
<div class="mask"></div>
|
|
</a>
|
|
</div>
|
|
<!--/.Card image-->
|
|
<!--Card content-->
|
|
<div class="card-body">
|
|
<!--Social shares button-->
|
|
<a class="activator mr-3"><i class="fa fa-share-alt"></i></a>
|
|
<!--Title-->
|
|
<h4 class="card-title">Card title</h4>
|
|
<hr>
|
|
<!--Text-->
|
|
<p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
|
|
<a class="link-text"><h5>Read more <i class="fa fa-chevron-right"></i></h5></a>
|
|
</div>
|
|
<!--/.Card content-->
|
|
</div>
|
|
<!--/.Card Light-->
|
|
|
|
</div>
|
|
<!--Grid column-->
|
|
|
|
<!--Grid column-->
|
|
<div class="col-lg-4 col-md-6 mb-4">
|
|
|
|
<!--Card Light-->
|
|
<div class="card">
|
|
<!--Card image-->
|
|
<div class="view overlay">
|
|
<img src="https://mdbootstrap.com/img/Photos/Lightbox/Original/img%20%2850%29.jpg" class="card-img-top" alt="">
|
|
<a>
|
|
<div class="mask"></div>
|
|
</a>
|
|
</div>
|
|
<!--/.Card image-->
|
|
<!--Card content-->
|
|
<div class="card-body">
|
|
<!--Social shares button-->
|
|
<a class="activator mr-3"><i class="fa fa-share-alt"></i></a>
|
|
<!--Title-->
|
|
<h4 class="card-title">Card title</h4>
|
|
<hr>
|
|
<!--Text-->
|
|
<p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
|
|
<a class="link-text"><h5>Read more <i class="fa fa-chevron-right"></i></h5></a>
|
|
</div>
|
|
<!--/.Card content-->
|
|
</div>
|
|
<!--/.Card Light-->
|
|
|
|
</div>
|
|
<!--Grid column-->
|
|
|
|
<!--Grid column-->
|
|
<div class="col-lg-4 col-md-6 mb-4">
|
|
|
|
<!--Card Light-->
|
|
<div class="card">
|
|
<!--Card image-->
|
|
<div class="view overlay">
|
|
<img src="https://mdbootstrap.com/img/Photos/Lightbox/Original/img%20%2897%29.jpg" class="card-img-top" alt="">
|
|
<a>
|
|
<div class="mask"></div>
|
|
</a>
|
|
</div>
|
|
<!--/.Card image-->
|
|
<!--Card content-->
|
|
<div class="card-body">
|
|
<!--Social shares button-->
|
|
<a class="activator mr-3"><i class="fa fa-share-alt"></i></a>
|
|
<!--Title-->
|
|
<h4 class="card-title">Card title</h4>
|
|
<hr>
|
|
<!--Text-->
|
|
<p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
|
|
<a class="link-text"><h5>Read more <i class="fa fa-chevron-right"></i></h5></a>
|
|
</div>
|
|
<!--/.Card content-->
|
|
</div>
|
|
<!--/.Card Light-->
|
|
|
|
</div>
|
|
<!--Grid column-->
|
|
|
|
</div>
|
|
<!--Grid row-->
|
|
|
|
</section>
|
|
<!--Section: Blog v.2-->
|
|
|
|
<!--Author box-->
|
|
<section>
|
|
|
|
<div class="jumbotron p-5 text-center text-md-left author-box wow fadeIn" data-wow-delay="0.3s">
|
|
<!--Name-->
|
|
<h4 class="h3-responsive text-center font-weight-bold dark-grey-text">About author</h4>
|
|
<hr>
|
|
<div class="row">
|
|
<!--Avatar-->
|
|
<div class="col-12 col-md-2 mb-md-0 mb-4">
|
|
<img src="http://mdbootstrap.com/img/Photos/Avatars/img%20(32).jpg" class="img-fluid rounded-circle z-depth-2">
|
|
</div>
|
|
<!--Author Data-->
|
|
<div class="col-12 col-md-10">
|
|
<h5 class="font-weight-bold dark-grey-text mb-3">
|
|
<strong>John Doe</strong>
|
|
</h5>
|
|
<div class="personal-sm pb-3">
|
|
<a class="fb-ic pr-2"><i class="fa fa-facebook mr-2"> </i></a>
|
|
<a class="tw-ic pr-2"><i class="fa fa-twitter mr-2"> </i></a>
|
|
<a class="gplus-ic pr-2"><i class="fa fa-google-plus mr-2"> </i></a>
|
|
<a class="li-ic pr-2"><i class="fa fa-linkedin mr-2"> </i></a>
|
|
</div>
|
|
<p>Nam libero tempore, cum soluta nobis est eligendi optio cumque nihil impedit quo minus.</p>
|
|
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sint esse nulla quia quam veniam commodi
|
|
dicta, iusto inventore. Voluptatum pariatur eveniet ea, officiis vitae praesentium beatae
|
|
quas libero, esse facere.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</section>
|
|
<!--/.Author box-->
|
|
|
|
<!--Section: Comments list-->
|
|
<section class="mb-4 pt-5 wow fadeIn" data-wow-delay="0.3s">
|
|
|
|
<!--Main wrapper-->
|
|
<div class="comments-list text-center text-md-left mb-5">
|
|
<div class="text-center mb-4">
|
|
<h3 class="font-weight-bold pt-3 mb-5">Comments <span class="badge pink">3</span></h3>
|
|
</div>
|
|
<!--First row-->
|
|
<div class="row mb-4">
|
|
<!--Image column-->
|
|
<div class="col-sm-2 col-12 mb-md-0 mb-3">
|
|
<img src="https://mdbootstrap.com/img/Photos/Avatars/img (9).jpg" class="avatar rounded-circle z-depth-1-half">
|
|
</div>
|
|
<!--/.Image column-->
|
|
|
|
<!--Content column-->
|
|
<div class="col-sm-10 col-12">
|
|
<a>
|
|
<h4 class="font-weight-bold">Tom Smith</h4>
|
|
</a>
|
|
<div class="mt-2">
|
|
<ul class="list-unstyled">
|
|
<li class="comment-date"><i class="fa fa-clock-o"></i> 05/10/2015</li>
|
|
</ul>
|
|
</div>
|
|
<p class="grey-text">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.</p>
|
|
</div>
|
|
<!--/.Content column-->
|
|
|
|
</div>
|
|
<!--/.First row-->
|
|
|
|
<!--Second row-->
|
|
<div class="row mb-4">
|
|
<!--Image column-->
|
|
<div class="col-sm-2 col-12 mb-md-0 mb-3">
|
|
<img src="https://mdbootstrap.com/img/Photos/Avatars/img (31).jpg" class="avatar rounded-circle z-depth-1-half">
|
|
</div>
|
|
<!--/.Image column-->
|
|
|
|
<!--Content column-->
|
|
<div class="col-sm-10 col-12">
|
|
<a>
|
|
<h4 class="font-weight-bold">Marta Tev</h4>
|
|
</a>
|
|
<div class="mt-2">
|
|
<ul class="list-unstyled">
|
|
<li class="comment-date"><i class="fa fa-clock-o"></i> 08/10/2015</li>
|
|
</ul>
|
|
</div>
|
|
<p class="grey-text">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.</p>
|
|
</div>
|
|
<!--/.Content column-->
|
|
|
|
</div>
|
|
<!--/.Second row-->
|
|
|
|
<!--Third row-->
|
|
<div class="row mb-4">
|
|
|
|
<!--Image column-->
|
|
<div class="col-sm-2 col-12 mb-md-0 mb-3">
|
|
<img src="https://mdbootstrap.com/img/Photos/Avatars/img (10).jpg" class="avatar rounded-circle z-depth-1-half">
|
|
</div>
|
|
<!--/.Image column-->
|
|
<!--Content column-->
|
|
<div class="col-sm-10 col-12">
|
|
<a>
|
|
<h4 class="font-weight-bold">Anna Maria</h4>
|
|
</a>
|
|
<div class="mt-2">
|
|
<ul class="list-unstyled">
|
|
<li class="comment-date"><i class="fa fa-clock-o"></i> 17/10/2015</li>
|
|
</ul>
|
|
</div>
|
|
<p class="grey-text">At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum
|
|
deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate
|
|
non provident, similique sunt in culpa qui officia.
|
|
</p>
|
|
</div>
|
|
<!--/.Content column-->
|
|
</div>
|
|
<!--/.Third row-->
|
|
</div>
|
|
<!--/.Main wrapper-->
|
|
|
|
</section>
|
|
<!--/Section: Comments list-->
|
|
|
|
|
|
<!--Section: Leave a reply (Logged In User)-->
|
|
<section class="pb-5 mt-5 wow fadeIn" data-wow-delay="0.3s">
|
|
|
|
<!--Leave a reply form-->
|
|
<div class="reply-form">
|
|
<h3 class="text-center my-5 h3 pt-3">Leave a reply </h3>
|
|
<p class="text-center">(Logged In User)</p>
|
|
|
|
<!--Third row-->
|
|
<div class="row text-center text-md-left">
|
|
<!--Image column-->
|
|
<div class="col-sm-2 col-12 mb-md-0 mt-4">
|
|
<img src="https://mdbootstrap.com/img/Photos/Avatars/img (32).jpg" alt="Sample avatar image" class="img-fluid avatar rounded-circle z-depth-2">
|
|
</div>
|
|
<!--/.Image column-->
|
|
|
|
<!--Content column-->
|
|
<div class="col-sm-10 col-12">
|
|
<div class="md-form">
|
|
<textarea type="text" id="form-mess" class="md-textarea form-control" rows="3"></textarea>
|
|
<label for="form-mess">Your message</label>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="col-md-12 text-center mt-4">
|
|
<button class="btn btn-pink btn-rounded">Submit</button>
|
|
</div>
|
|
<!--/.Content column-->
|
|
|
|
</div>
|
|
<!--/.Third row-->
|
|
</div>
|
|
<!--/.Leave a reply form-->
|
|
|
|
</section>
|
|
<!--/Section: Leave a reply (Logged In User)-->
|
|
|
|
</div>
|
|
|
|
</main>
|
|
<!--Main Layout-->
|
|
|
|
<!--Footer-->
|
|
<footer class="page-footer pt-0">
|
|
|
|
<!--Footer Links-->
|
|
<div class="container">
|
|
|
|
<!--First row-->
|
|
<div class="row">
|
|
|
|
<!--First column-->
|
|
<div class="col-md-12 wow fadeIn" data-wow-delay="0.3s">
|
|
|
|
<div class="text-center d-flex justify-content-center my-4">
|
|
|
|
<!--Facebook-->
|
|
<a class="p-2 m-2 fa-lg fb-ic"><i class="fa fa-facebook white-text fa-lg pr-md-4"> </i></a>
|
|
<!--Twitter-->
|
|
<a class="p-2 m-2 fa-lg tw-ic"><i class="fa fa-twitter white-text fa-lg pr-md-4"> </i></a>
|
|
<!--Google +-->
|
|
<a class="p-2 m-2 fa-lg gplus-ic"><i class="fa fa-google-plus white-text fa-lg pr-md-4"> </i></a>
|
|
<!--Linkedin-->
|
|
<a class="p-2 m-2 fa-lg li-ic"><i class="fa fa-linkedin white-text fa-lg pr-md-4"> </i></a>
|
|
<!--Instagram-->
|
|
<a class="p-2 m-2 fa-lg ins-ic"><i class="fa fa-instagram white-text fa-lg pr-md-4"> </i></a>
|
|
<!--Pinterest-->
|
|
<a class="p-2 m-2 fa-lg pin-ic"><i class="fa fa-pinterest white-text fa-lg pr-md-4"> </i></a>
|
|
</div>
|
|
|
|
</div>
|
|
<!--/First column-->
|
|
|
|
</div>
|
|
<!--/First row-->
|
|
|
|
</div>
|
|
<!--/Footer Links-->
|
|
|
|
<!--Copyright-->
|
|
<div class="footer-copyright py-3 text-center wow fadeIn" data-wow-delay="0.3s">
|
|
<div class="container-fluid">
|
|
© 2018 Copyright: <a href="https://mdbootstrap.com/bootstrap-tutorial/" target="_blank"> MDBootstrap.com </a>
|
|
</div>
|
|
</div>
|
|
<!--/.Copyright-->
|
|
|
|
</footer>
|
|
<!--/Footer-->
|
|
|
|
<!-- SCRIPTS -->
|
|
<!-- JQuery -->
|
|
<script type="text/javascript" src="../js/jquery-3.3.1.min.js"></script>
|
|
<!-- Bootstrap tooltips -->
|
|
<script type="text/javascript" src="../js/popper.min.js"></script>
|
|
<!-- Bootstrap core JavaScript -->
|
|
<script type="text/javascript" src="../js/bootstrap.min.js"></script>
|
|
<!-- MDB core JavaScript -->
|
|
<script type="text/javascript" src="../js/mdb.min.js"></script>
|
|
<script>
|
|
new WOW().init();
|
|
</script>
|
|
</body>
|
|
</html>
|