Add a pagination partial
This commit is contained in:
kbe
253
docs/theme/Mono v10.0.1 HTML5/Mono v10.0.1/4. Blog/blog-fullwidth.html
vendored
Normal file
253
docs/theme/Mono v10.0.1 HTML5/Mono v10.0.1/4. Blog/blog-fullwidth.html
vendored
Normal file
@@ -0,0 +1,253 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<meta name="description" content="">
|
||||
<meta name="keywords" content="">
|
||||
<title>Mono - Blog Fullwidth</title>
|
||||
<!-- Favicon -->
|
||||
<link href="../assets/images/favicon.png" rel="shortcut icon">
|
||||
<!-- CSS -->
|
||||
<link href="../assets/plugins/bootstrap/bootstrap.min.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/owl-carousel/owl.carousel.min.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/owl-carousel/owl.theme.default.min.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/magnific-popup/magnific-popup.min.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/scrollcue/scrollcue.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/swiper/swiper-bundle.min.css" rel="stylesheet">
|
||||
<link href="../assets/css/theme.css" rel="stylesheet">
|
||||
<!-- Fonts/Icons -->
|
||||
<link href="../assets/plugins/bootstrap-icons/bootstrap-icons.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/font-awesome/css/all.css" rel="stylesheet">
|
||||
</head>
|
||||
<body data-preloader="1">
|
||||
|
||||
<!-- Header -->
|
||||
<div class="header center header-color-dark">
|
||||
<div class="container">
|
||||
<!-- Logo -->
|
||||
<div class="header-logo">
|
||||
<h3 class="uppercase letter-spacing-1"><a href="#">mono</a></h3>
|
||||
<!--
|
||||
<img class="logo-dark" src="../assets/images/your-logo-dark.png" alt="">
|
||||
<img class="logo-light" src="../assets/images/your-logo-light.png" alt="">
|
||||
-->
|
||||
</div>
|
||||
<!-- Menu -->
|
||||
<div class="header-menu">
|
||||
<ul class="nav">
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#">Link Only</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#">Dropdown</a>
|
||||
<ul class="nav-dropdown">
|
||||
<li class="nav-dropdown-item"><a class="nav-dropdown-link" href="#">Dropdown Item</a></li>
|
||||
<li class="nav-dropdown-item"><a class="nav-dropdown-link" href="#">Dropdown Item</a></li>
|
||||
<li class="nav-dropdown-item"><a class="nav-dropdown-link" href="#">Dropdown Item</a></li>
|
||||
<li class="nav-dropdown-item"><a class="nav-dropdown-link" href="#">Dropdown Item</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#">Subdropdown</a>
|
||||
<ul class="nav-dropdown">
|
||||
<li class="nav-dropdown-item">
|
||||
<a class="nav-dropdown-link" href="#">Dropdown Item</a>
|
||||
<ul class="nav-subdropdown">
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-dropdown-item">
|
||||
<a class="nav-dropdown-link" href="#">Dropdown Item</a>
|
||||
<ul class="nav-subdropdown">
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#">Subdropdown LG</a>
|
||||
<ul class="nav-dropdown">
|
||||
<li class="nav-dropdown-item">
|
||||
<a class="nav-dropdown-link" href="#">Dropdown Item</a>
|
||||
<div class="nav-subdropdown nav-subdropdown-lg">
|
||||
<div class="row g-2 g-lg-3">
|
||||
<div class="col-12 col-lg-6">
|
||||
<ul>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="col-12 col-lg-6">
|
||||
<ul>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div><!-- end row -->
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- Menu Extra -->
|
||||
<div class="header-menu-extra">
|
||||
<ul class="list-inline-sm">
|
||||
<li><a href="#"><i class="bi bi-facebook"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-twitter-x"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-linkedin"></i></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- Menu Toggle -->
|
||||
<button class="header-toggle">
|
||||
<span></span>
|
||||
</button>
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
<!-- end Header -->
|
||||
|
||||
<div class="section-sm bg-gray-lighter">
|
||||
<div class="container text-center">
|
||||
<h3 class="font-family-playfair">mono blog.</h3>
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
|
||||
<!-- Blog section -->
|
||||
<div class="section">
|
||||
<div class="container">
|
||||
<div class="row g-4">
|
||||
<div class="col-12 col-sm-10 offset-sm-1 col-md-8 offset-md-2">
|
||||
<!-- Blog Post box 1 -->
|
||||
<div class="mb-5">
|
||||
<div class="img-link-box">
|
||||
<a href="#">
|
||||
<img src="../assets/images/col-1.jpg" alt="">
|
||||
</a>
|
||||
</div>
|
||||
<div class="mt-4">
|
||||
<div class="d-flex justify-content-between mb-2">
|
||||
<div class="d-inline-flex">
|
||||
<a class="font-family-poppins font-small fw-medium uppercase" href="#">Lifestyle</a>
|
||||
</div>
|
||||
<div class="d-inline-flex">
|
||||
<span class="font-small">Jan 24, 2019</span>
|
||||
</div>
|
||||
</div>
|
||||
<h4><a class="text-link-1" href="#">Benefits of Minimalism</a></h4>
|
||||
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem.</p>
|
||||
<div class="mt-3">
|
||||
<a class="button-text-1" href="#">Read More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Blog Post box 2 -->
|
||||
<div class="mb-5">
|
||||
<div class="img-link-box">
|
||||
<a href="#">
|
||||
<img src="../assets/images/col-1.jpg" alt="">
|
||||
</a>
|
||||
</div>
|
||||
<div class="mt-4">
|
||||
<div class="d-flex justify-content-between mb-2">
|
||||
<div class="d-inline-flex">
|
||||
<a class="font-family-poppins font-small fw-medium uppercase" href="#">Knowledge</a>
|
||||
</div>
|
||||
<div class="d-inline-flex">
|
||||
<span class="font-small">Jan 24, 2019</span>
|
||||
</div>
|
||||
</div>
|
||||
<h4><a class="text-link-1" href="#">10 Books that I will recommend</a></h4>
|
||||
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem.</p>
|
||||
<div class="mt-3">
|
||||
<a class="button-text-1" href="#">Read More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Blog Post box 3 -->
|
||||
<div class="mb-5">
|
||||
<div class="img-link-box">
|
||||
<a href="#">
|
||||
<img src="../assets/images/col-1.jpg" alt="">
|
||||
</a>
|
||||
</div>
|
||||
<div class="mt-4">
|
||||
<div class="d-flex justify-content-between mb-2">
|
||||
<div class="d-inline-flex">
|
||||
<a class="font-family-poppins font-small fw-medium uppercase" href="#">Health</a>
|
||||
</div>
|
||||
<div class="d-inline-flex">
|
||||
<span class="font-small">Jan 24, 2019</span>
|
||||
</div>
|
||||
</div>
|
||||
<h4><a class="text-link-1" href="#">Benefits of house plants</a></h4>
|
||||
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem.</p>
|
||||
<div class="mt-3">
|
||||
<a class="button-text-1" href="#">Read More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Pagination -->
|
||||
<nav>
|
||||
<ul class="pagination justify-content-center mt-5">
|
||||
<li class="page-item"><a class="page-link" href="#">«</a></li>
|
||||
<li class="page-item active"><a class="page-link" href="#">1</a></li>
|
||||
<li class="page-item"><a class="page-link" href="#">2</a></li>
|
||||
<li class="page-item"><a class="page-link" href="#">3</a></li>
|
||||
<li class="page-item"><a class="page-link" href="#">»</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
</div><!-- end row -->
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
<!-- end Blog section -->
|
||||
|
||||
<footer>
|
||||
<div class="section bg-dark">
|
||||
<div class="container">
|
||||
<div class="row g-4 align-items-center">
|
||||
<div class="col-12 col-md-6 text-center text-md-start">
|
||||
<ul class="list-inline-dash">
|
||||
<li><a href="#">FAQ</a></li>
|
||||
<li><a href="#">Careers</a></li>
|
||||
<li><a href="#">Clients</a></li>
|
||||
</ul>
|
||||
<p class="mt-2">© 2025 FlaTheme, All Rights Reserved.</p>
|
||||
</div>
|
||||
<div class="col-12 col-md-6 text-center text-md-end">
|
||||
<ul class="list-inline">
|
||||
<li><a href="#"><i class="bi bi-facebook"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-twitter-x"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-pinterest"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-instagram"></i></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div><!-- end row -->
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<!-- Scroll to top button -->
|
||||
<div class="scrolltotop icon-lg">
|
||||
<a class="button-circle button-circle-md button-circle-dark" href="#"><i class="bi bi-arrow-up-short"></i></a>
|
||||
</div>
|
||||
<!-- end Scroll to top button -->
|
||||
|
||||
<!-- ***** JAVASCRIPTS ***** -->
|
||||
<script src="../assets/plugins/jquery.min.js"></script>
|
||||
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY"></script>
|
||||
<script src="../assets/plugins/plugins.js"></script>
|
||||
<script src="../assets/js/functions.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
260
docs/theme/Mono v10.0.1 HTML5/Mono v10.0.1/4. Blog/blog-masonry.html
vendored
Normal file
260
docs/theme/Mono v10.0.1 HTML5/Mono v10.0.1/4. Blog/blog-masonry.html
vendored
Normal file
@@ -0,0 +1,260 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<meta name="description" content="">
|
||||
<meta name="keywords" content="">
|
||||
<title>Mono - Blog Masonry</title>
|
||||
<!-- Favicon -->
|
||||
<link href="../assets/images/favicon.png" rel="shortcut icon">
|
||||
<!-- CSS -->
|
||||
<link href="../assets/plugins/bootstrap/bootstrap.min.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/owl-carousel/owl.carousel.min.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/owl-carousel/owl.theme.default.min.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/magnific-popup/magnific-popup.min.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/scrollcue/scrollcue.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/swiper/swiper-bundle.min.css" rel="stylesheet">
|
||||
<link href="../assets/css/theme.css" rel="stylesheet">
|
||||
<!-- Fonts/Icons -->
|
||||
<link href="../assets/plugins/bootstrap-icons/bootstrap-icons.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/font-awesome/css/all.css" rel="stylesheet">
|
||||
</head>
|
||||
<body data-preloader="1">
|
||||
|
||||
<!-- Header -->
|
||||
<div class="header center header-color-dark">
|
||||
<div class="container">
|
||||
<!-- Logo -->
|
||||
<div class="header-logo">
|
||||
<h3 class="uppercase letter-spacing-1"><a href="#">mono</a></h3>
|
||||
<!--
|
||||
<img class="logo-dark" src="../assets/images/your-logo-dark.png" alt="">
|
||||
<img class="logo-light" src="../assets/images/your-logo-light.png" alt="">
|
||||
-->
|
||||
</div>
|
||||
<!-- Menu -->
|
||||
<div class="header-menu">
|
||||
<ul class="nav">
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#">Link Only</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#">Dropdown</a>
|
||||
<ul class="nav-dropdown">
|
||||
<li class="nav-dropdown-item"><a class="nav-dropdown-link" href="#">Dropdown Item</a></li>
|
||||
<li class="nav-dropdown-item"><a class="nav-dropdown-link" href="#">Dropdown Item</a></li>
|
||||
<li class="nav-dropdown-item"><a class="nav-dropdown-link" href="#">Dropdown Item</a></li>
|
||||
<li class="nav-dropdown-item"><a class="nav-dropdown-link" href="#">Dropdown Item</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#">Subdropdown</a>
|
||||
<ul class="nav-dropdown">
|
||||
<li class="nav-dropdown-item">
|
||||
<a class="nav-dropdown-link" href="#">Dropdown Item</a>
|
||||
<ul class="nav-subdropdown">
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-dropdown-item">
|
||||
<a class="nav-dropdown-link" href="#">Dropdown Item</a>
|
||||
<ul class="nav-subdropdown">
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#">Subdropdown LG</a>
|
||||
<ul class="nav-dropdown">
|
||||
<li class="nav-dropdown-item">
|
||||
<a class="nav-dropdown-link" href="#">Dropdown Item</a>
|
||||
<div class="nav-subdropdown nav-subdropdown-lg">
|
||||
<div class="row g-2 g-lg-3">
|
||||
<div class="col-12 col-lg-6">
|
||||
<ul>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="col-12 col-lg-6">
|
||||
<ul>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div><!-- end row -->
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- Menu Extra -->
|
||||
<div class="header-menu-extra">
|
||||
<ul class="list-inline-sm">
|
||||
<li><a href="#"><i class="bi bi-facebook"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-twitter-x"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-linkedin"></i></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- Menu Toggle -->
|
||||
<button class="header-toggle">
|
||||
<span></span>
|
||||
</button>
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
<!-- end Header -->
|
||||
|
||||
<div class="section-sm bg-gray-lighter">
|
||||
<div class="container text-center">
|
||||
<h3 class="font-family-playfair">mono blog.</h3>
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
|
||||
<!-- Blog Posts -->
|
||||
<div class="section">
|
||||
<div class="container">
|
||||
<div class="masonry column-3 spacing-3">
|
||||
<!-- Masonry Item 1 -->
|
||||
<div class="masonry-item">
|
||||
<div class="hoverbox-6 mb-3">
|
||||
<a href="#">
|
||||
<img src="../assets/images/col-2-square.jpg" alt="">
|
||||
<div class="content top bg-dark">
|
||||
<span class="font-family-poppins font-small fw-normal uppercase text-white">Feb 6</span>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<h5 class="fw-medium"><a class="text-link-1" href="#">Blog Post with Image</a></h5>
|
||||
<p>Aenean commodo ligula eget dolor. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus...</p>
|
||||
</div>
|
||||
<!-- Masonry Item 2 -->
|
||||
<div class="masonry-item">
|
||||
<div class="hoverbox-6 mb-3">
|
||||
<a href="#">
|
||||
<img src="../assets/images/col-2.jpg" alt="">
|
||||
<div class="content top bg-dark">
|
||||
<span class="font-family-poppins font-small fw-normal uppercase text-white">Feb 6</span>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<h5 class="fw-medium"><a class="text-link-1" href="#">Blog Post with Image</a></h5>
|
||||
<p>Aenean commodo ligula eget dolor. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus...</p>
|
||||
</div>
|
||||
<!-- Masonry Item 3 -->
|
||||
<div class="masonry-item">
|
||||
<div class="hoverbox-6 mb-3">
|
||||
<a href="#">
|
||||
<img src="../assets/images/col-2-square.jpg" alt="">
|
||||
<div class="content top bg-dark">
|
||||
<span class="font-family-poppins font-small fw-normal uppercase text-white">Feb 6</span>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<h5 class="fw-medium"><a class="text-link-1" href="#">Blog Post with Image</a></h5>
|
||||
<p>Aenean commodo ligula eget dolor. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus...</p>
|
||||
</div>
|
||||
<!-- Masonry Item 4 -->
|
||||
<div class="masonry-item">
|
||||
<div class="hoverbox-6 mb-3">
|
||||
<a href="#">
|
||||
<img src="../assets/images/col-2-square.jpg" alt="">
|
||||
<div class="content top bg-dark">
|
||||
<span class="font-family-poppins font-small fw-normal uppercase text-white">Feb 6</span>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<h5 class="fw-medium"><a class="text-link-1" href="#">Blog Post with Image</a></h5>
|
||||
<p>Aenean commodo ligula eget dolor. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus...</p>
|
||||
</div>
|
||||
<!-- Masonry Item 5 -->
|
||||
<div class="masonry-item">
|
||||
<div class="hoverbox-6 mb-3">
|
||||
<a href="#">
|
||||
<img src="../assets/images/col-2.jpg" alt="">
|
||||
<div class="content top bg-dark">
|
||||
<span class="font-family-poppins font-small fw-normal uppercase text-white">Feb 6</span>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<h5 class="fw-medium"><a class="text-link-1" href="#">Blog Post with Image</a></h5>
|
||||
<p>Aenean commodo ligula eget dolor. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus...</p>
|
||||
</div>
|
||||
<!-- Masonry Item 6 -->
|
||||
<div class="masonry-item">
|
||||
<div class="hoverbox-6 mb-3">
|
||||
<a href="#">
|
||||
<img src="../assets/images/col-2.jpg" alt="">
|
||||
<div class="content top bg-dark">
|
||||
<span class="font-family-poppins font-small fw-normal uppercase text-white">Feb 6</span>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<h5 class="fw-medium"><a class="text-link-1" href="#">Blog Post with Image</a></h5>
|
||||
<p>Aenean commodo ligula eget dolor. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus...</p>
|
||||
</div>
|
||||
</div><!-- end masonry -->
|
||||
<!-- Pagination -->
|
||||
<nav>
|
||||
<ul class="pagination justify-content-center mt-5">
|
||||
<li class="page-item"><a class="page-link" href="#">«</a></li>
|
||||
<li class="page-item active"><a class="page-link" href="#">1</a></li>
|
||||
<li class="page-item"><a class="page-link" href="#">2</a></li>
|
||||
<li class="page-item"><a class="page-link" href="#">3</a></li>
|
||||
<li class="page-item"><a class="page-link" href="#">»</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
<!-- end Blog Posts -->
|
||||
|
||||
<footer>
|
||||
<div class="section bg-dark">
|
||||
<div class="container">
|
||||
<div class="row g-4 align-items-center">
|
||||
<div class="col-12 col-md-6 text-center text-md-start">
|
||||
<ul class="list-inline-dash">
|
||||
<li><a href="#">FAQ</a></li>
|
||||
<li><a href="#">Careers</a></li>
|
||||
<li><a href="#">Clients</a></li>
|
||||
</ul>
|
||||
<p class="mt-2">© 2025 FlaTheme, All Rights Reserved.</p>
|
||||
</div>
|
||||
<div class="col-12 col-md-6 text-center text-md-end">
|
||||
<ul class="list-inline">
|
||||
<li><a href="#"><i class="bi bi-facebook"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-twitter-x"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-pinterest"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-instagram"></i></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div><!-- end row -->
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<!-- Scroll to top button -->
|
||||
<div class="scrolltotop icon-lg">
|
||||
<a class="button-circle button-circle-md button-circle-dark" href="#"><i class="bi bi-arrow-up-short"></i></a>
|
||||
</div>
|
||||
<!-- end Scroll to top button -->
|
||||
|
||||
<!-- ***** JAVASCRIPTS ***** -->
|
||||
<script src="../assets/plugins/jquery.min.js"></script>
|
||||
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY"></script>
|
||||
<script src="../assets/plugins/plugins.js"></script>
|
||||
<script src="../assets/js/functions.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
355
docs/theme/Mono v10.0.1 HTML5/Mono v10.0.1/4. Blog/blog-sidebar-left.html
vendored
Normal file
355
docs/theme/Mono v10.0.1 HTML5/Mono v10.0.1/4. Blog/blog-sidebar-left.html
vendored
Normal file
@@ -0,0 +1,355 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<meta name="description" content="">
|
||||
<meta name="keywords" content="">
|
||||
<title>Mono - Blog Sidebar Left</title>
|
||||
<!-- Favicon -->
|
||||
<link href="../assets/images/favicon.png" rel="shortcut icon">
|
||||
<!-- CSS -->
|
||||
<link href="../assets/plugins/bootstrap/bootstrap.min.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/owl-carousel/owl.carousel.min.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/owl-carousel/owl.theme.default.min.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/magnific-popup/magnific-popup.min.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/scrollcue/scrollcue.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/swiper/swiper-bundle.min.css" rel="stylesheet">
|
||||
<link href="../assets/css/theme.css" rel="stylesheet">
|
||||
<!-- Fonts/Icons -->
|
||||
<link href="../assets/plugins/bootstrap-icons/bootstrap-icons.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/font-awesome/css/all.css" rel="stylesheet">
|
||||
</head>
|
||||
<body data-preloader="1">
|
||||
|
||||
<!-- Header -->
|
||||
<div class="header right header-color-dark">
|
||||
<div class="container">
|
||||
<!-- Logo -->
|
||||
<div class="header-logo">
|
||||
<h3 class="uppercase letter-spacing-1"><a href="#">mono</a></h3>
|
||||
<!--
|
||||
<img class="logo-dark" src="../assets/images/your-logo-dark.png" alt="">
|
||||
<img class="logo-light" src="../assets/images/your-logo-light.png" alt="">
|
||||
-->
|
||||
</div>
|
||||
<!-- Menu -->
|
||||
<div class="header-menu">
|
||||
<ul class="nav">
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#">Link Only</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#">Dropdown</a>
|
||||
<ul class="nav-dropdown">
|
||||
<li class="nav-dropdown-item"><a class="nav-dropdown-link" href="#">Dropdown Item</a></li>
|
||||
<li class="nav-dropdown-item"><a class="nav-dropdown-link" href="#">Dropdown Item</a></li>
|
||||
<li class="nav-dropdown-item"><a class="nav-dropdown-link" href="#">Dropdown Item</a></li>
|
||||
<li class="nav-dropdown-item"><a class="nav-dropdown-link" href="#">Dropdown Item</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#">Subdropdown</a>
|
||||
<ul class="nav-dropdown">
|
||||
<li class="nav-dropdown-item">
|
||||
<a class="nav-dropdown-link" href="#">Dropdown Item</a>
|
||||
<ul class="nav-subdropdown">
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-dropdown-item">
|
||||
<a class="nav-dropdown-link" href="#">Dropdown Item</a>
|
||||
<ul class="nav-subdropdown">
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#">Subdropdown LG</a>
|
||||
<ul class="nav-dropdown">
|
||||
<li class="nav-dropdown-item">
|
||||
<a class="nav-dropdown-link" href="#">Dropdown Item</a>
|
||||
<div class="nav-subdropdown nav-subdropdown-lg">
|
||||
<div class="row g-2 g-lg-3">
|
||||
<div class="col-12 col-lg-6">
|
||||
<ul>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="col-12 col-lg-6">
|
||||
<ul>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div><!-- end row -->
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- Menu Extra -->
|
||||
<div class="header-menu-extra">
|
||||
<ul class="list-inline-sm">
|
||||
<li><a href="#"><i class="bi bi-facebook"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-twitter-x"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-linkedin"></i></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- Menu Toggle -->
|
||||
<button class="header-toggle">
|
||||
<span></span>
|
||||
</button>
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
<!-- end Header -->
|
||||
|
||||
<div class="section-sm bg-gray-lighter">
|
||||
<div class="container text-center">
|
||||
<h3 class="font-family-playfair">mono blog.</h3>
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
|
||||
<!-- Blog section -->
|
||||
<div class="section">
|
||||
<div class="container">
|
||||
<div class="row g-5">
|
||||
|
||||
<!-- Blog Posts -->
|
||||
<div class="col-12 col-lg-8 order-lg-2">
|
||||
<!-- Blog Post box 1 -->
|
||||
<div class="mb-5">
|
||||
<div class="img-link-box">
|
||||
<a href="#">
|
||||
<img src="../assets/images/col-1.jpg" alt="">
|
||||
</a>
|
||||
</div>
|
||||
<div class="mt-4">
|
||||
<div class="d-flex justify-content-between mb-2">
|
||||
<div class="d-inline-flex">
|
||||
<a class="font-family-poppins font-small fw-medium uppercase" href="#">Lifestyle</a>
|
||||
</div>
|
||||
<div class="d-inline-flex">
|
||||
<span class="font-small">Jan 24, 2019</span>
|
||||
</div>
|
||||
</div>
|
||||
<h4><a class="text-link-1" href="#">Benefits of Minimalism</a></h4>
|
||||
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem.</p>
|
||||
<div class="mt-3">
|
||||
<a class="button-text-1" href="#">Read More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Blog Post box 2 -->
|
||||
<div class="mb-5">
|
||||
<div class="img-link-box">
|
||||
<a href="#">
|
||||
<img src="../assets/images/col-1.jpg" alt="">
|
||||
</a>
|
||||
</div>
|
||||
<div class="mt-4">
|
||||
<div class="d-flex justify-content-between mb-2">
|
||||
<div class="d-inline-flex">
|
||||
<a class="font-family-poppins font-small fw-medium uppercase" href="#">Knowledge</a>
|
||||
</div>
|
||||
<div class="d-inline-flex">
|
||||
<span class="font-small">Jan 24, 2019</span>
|
||||
</div>
|
||||
</div>
|
||||
<h4><a class="text-link-1" href="#">10 Books that I will recommend</a></h4>
|
||||
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem.</p>
|
||||
<div class="mt-3">
|
||||
<a class="button-text-1" href="#">Read More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Blog Post box 3 -->
|
||||
<div class="mb-5">
|
||||
<div class="img-link-box">
|
||||
<a href="#">
|
||||
<img src="../assets/images/col-1.jpg" alt="">
|
||||
</a>
|
||||
</div>
|
||||
<div class="mt-4">
|
||||
<div class="d-flex justify-content-between mb-2">
|
||||
<div class="d-inline-flex">
|
||||
<a class="font-family-poppins font-small fw-medium uppercase" href="#">Health</a>
|
||||
</div>
|
||||
<div class="d-inline-flex">
|
||||
<span class="font-small">Jan 24, 2019</span>
|
||||
</div>
|
||||
</div>
|
||||
<h4><a class="text-link-1" href="#">Benefits of house plants</a></h4>
|
||||
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem.</p>
|
||||
<div class="mt-3">
|
||||
<a class="button-text-1" href="#">Read More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Pagination -->
|
||||
<nav>
|
||||
<ul class="pagination justify-content-center mt-5">
|
||||
<li class="page-item"><a class="page-link" href="#">«</a></li>
|
||||
<li class="page-item active"><a class="page-link" href="#">1</a></li>
|
||||
<li class="page-item"><a class="page-link" href="#">2</a></li>
|
||||
<li class="page-item"><a class="page-link" href="#">3</a></li>
|
||||
<li class="page-item"><a class="page-link" href="#">»</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
<!-- end Blog Posts -->
|
||||
|
||||
<!-- Blog Sidebar -->
|
||||
<div class="col-12 col-lg-4 order-lg-1 d-none d-lg-block">
|
||||
<!-- Sidebar box 1 - About me -->
|
||||
<div class="border p-4 mb-4 text-center">
|
||||
<h6 class="font-small fw-medium uppercase mb-4">About Me</h6>
|
||||
<img class="img-mask-avatar-md mb-3" src="../assets/images/img-avatar-md.jpg" alt="">
|
||||
<p>Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</p>
|
||||
<ul class="list-inline mt-3">
|
||||
<li><a href="#"><i class="bi bi-facebook"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-twitter-x"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-pinterest"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-instagram"></i></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- Sidebar box 2 - Categories -->
|
||||
<div class="border p-4 mb-4">
|
||||
<h6 class="font-small fw-medium uppercase mb-4 text-center">Categories</h6>
|
||||
<ul class="list-unstyled">
|
||||
<li class="pb-2 border-bottom"><a class="d-flex justify-content-between" href="#">Art <span>11</span></a></li>
|
||||
<li class="pb-2 border-bottom"><a class="d-flex justify-content-between" href="#">Fashion <span>4</span></a></li>
|
||||
<li class="pb-2 border-bottom"><a class="d-flex justify-content-between" href="#">Lifestyle <span>12</span></a></li>
|
||||
<li class="pb-2 border-bottom"><a class="d-flex justify-content-between" href="#">Nature <span>8</span></a></li>
|
||||
<li class="pb-2"><a class="d-flex justify-content-between" href="#">Travel <span>15</span></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- Sidebar box 3 - Popular Posts -->
|
||||
<div class="border p-4 mb-4">
|
||||
<h6 class="font-small fw-medium uppercase mb-4 text-center">Popular Posts</h6>
|
||||
<!-- Popular post 1 -->
|
||||
<div class="d-flex align-items-center mb-3">
|
||||
<a href="#">
|
||||
<img src="../assets/images/img-avatar-sm.jpg" alt="">
|
||||
</a>
|
||||
<div class="ps-3">
|
||||
<h6 class="fw-normal mb-0"><a class="text-link-1" href="#">Blog Post with Image</a></h6>
|
||||
<span class="font-small">January 07, 2018</span>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Popular post 2 -->
|
||||
<div class="d-flex align-items-center mb-3">
|
||||
<a href="#">
|
||||
<img src="../assets/images/img-avatar-sm.jpg" alt="">
|
||||
</a>
|
||||
<div class="ps-3">
|
||||
<h6 class="fw-normal mb-0"><a class="text-link-1" href="#">Blog Post with Image</a></h6>
|
||||
<span class="font-small">January 07, 2018</span>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Popular post 3 -->
|
||||
<div class="d-flex align-items-center">
|
||||
<a href="#">
|
||||
<img src="../assets/images/img-avatar-sm.jpg" alt="">
|
||||
</a>
|
||||
<div class="ps-3">
|
||||
<h6 class="fw-normal mb-0"><a class="text-link-1" href="#">Blog Post with Image</a></h6>
|
||||
<span class="font-small">January 07, 2018</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Sidebar box 4 - Banner Image -->
|
||||
<div class="mb-4">
|
||||
<a href="#">
|
||||
<img src="../assets/images/col-3.jpg" alt="">
|
||||
</a>
|
||||
</div>
|
||||
<!-- Sidebar box 5 - Tags -->
|
||||
<div class="border p-4 mb-4">
|
||||
<h6 class="font-small fw-medium uppercase mb-4 text-center">Tags</h6>
|
||||
<ul class="list-inline">
|
||||
<li><a class="button-text-1" href="#">Art</a></li>
|
||||
<li><a class="button-text-1" href="#">Design</a></li>
|
||||
<li><a class="button-text-1" href="#">Event</a></li>
|
||||
<li><a class="button-text-1" href="#">Fashion</a></li>
|
||||
<li><a class="button-text-1" href="#">Food</a></li>
|
||||
<li><a class="button-text-1" href="#">Inspiration</a></li>
|
||||
<li><a class="button-text-1" href="#">Movie</a></li>
|
||||
<li><a class="button-text-1" href="#">Music</a></li>
|
||||
<li><a class="button-text-1" href="#">Nature</a></li>
|
||||
<li><a class="button-text-1" href="#">Office</a></li>
|
||||
<li><a class="button-text-1" href="#">Painting</a></li>
|
||||
<li><a class="button-text-1" href="#">Photography</a></li>
|
||||
<li><a class="button-text-1" href="#">People</a></li>
|
||||
<li><a class="button-text-1" href="#">Work</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- Sidebar box 6 - Facebook Like box -->
|
||||
<div class="border p-4 mb-4 text-center">
|
||||
<h6 class="font-small fw-medium uppercase mb-4">Follow on</h6>
|
||||
<ul class="list-inline">
|
||||
<li><a href="#"><i class="bi bi-facebook"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-twitter-x"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-pinterest"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-behance"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-instagram"></i></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<!-- end Blog Sidebar -->
|
||||
</div><!-- end row -->
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
<!-- end Blog section -->
|
||||
|
||||
<footer>
|
||||
<div class="section bg-dark">
|
||||
<div class="container">
|
||||
<div class="row g-4 align-items-center">
|
||||
<div class="col-12 col-md-6 text-center text-md-start">
|
||||
<ul class="list-inline-dash">
|
||||
<li><a href="#">FAQ</a></li>
|
||||
<li><a href="#">Careers</a></li>
|
||||
<li><a href="#">Clients</a></li>
|
||||
</ul>
|
||||
<p class="mt-2">© 2025 FlaTheme, All Rights Reserved.</p>
|
||||
</div>
|
||||
<div class="col-12 col-md-6 text-center text-md-end">
|
||||
<ul class="list-inline">
|
||||
<li><a href="#"><i class="bi bi-facebook"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-twitter-x"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-pinterest"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-instagram"></i></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div><!-- end row -->
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<!-- Scroll to top button -->
|
||||
<div class="scrolltotop icon-lg">
|
||||
<a class="button-circle button-circle-md button-circle-dark" href="#"><i class="bi bi-arrow-up-short"></i></a>
|
||||
</div>
|
||||
<!-- end Scroll to top button -->
|
||||
|
||||
<!-- ***** JAVASCRIPTS ***** -->
|
||||
<script src="../assets/plugins/jquery.min.js"></script>
|
||||
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY"></script>
|
||||
<script src="../assets/plugins/plugins.js"></script>
|
||||
<script src="../assets/js/functions.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
354
docs/theme/Mono v10.0.1 HTML5/Mono v10.0.1/4. Blog/blog-sidebar-right.html
vendored
Normal file
354
docs/theme/Mono v10.0.1 HTML5/Mono v10.0.1/4. Blog/blog-sidebar-right.html
vendored
Normal file
@@ -0,0 +1,354 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<meta name="description" content="">
|
||||
<meta name="keywords" content="">
|
||||
<title>Mono - Blog Sidebar Right</title>
|
||||
<!-- Favicon -->
|
||||
<link href="../assets/images/favicon.png" rel="shortcut icon">
|
||||
<!-- CSS -->
|
||||
<link href="../assets/plugins/bootstrap/bootstrap.min.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/owl-carousel/owl.carousel.min.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/owl-carousel/owl.theme.default.min.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/magnific-popup/magnific-popup.min.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/scrollcue/scrollcue.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/swiper/swiper-bundle.min.css" rel="stylesheet">
|
||||
<link href="../assets/css/theme.css" rel="stylesheet">
|
||||
<!-- Fonts/Icons -->
|
||||
<link href="../assets/plugins/bootstrap-icons/bootstrap-icons.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/font-awesome/css/all.css" rel="stylesheet">
|
||||
</head>
|
||||
<body data-preloader="1">
|
||||
|
||||
<!-- Header -->
|
||||
<div class="header right header-color-dark">
|
||||
<div class="container">
|
||||
<!-- Logo -->
|
||||
<div class="header-logo">
|
||||
<h3 class="uppercase letter-spacing-1"><a href="#">mono</a></h3>
|
||||
<!--
|
||||
<img class="logo-dark" src="../assets/images/your-logo-dark.png" alt="">
|
||||
<img class="logo-light" src="../assets/images/your-logo-light.png" alt="">
|
||||
-->
|
||||
</div>
|
||||
<!-- Menu -->
|
||||
<div class="header-menu">
|
||||
<ul class="nav">
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#">Link Only</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#">Dropdown</a>
|
||||
<ul class="nav-dropdown">
|
||||
<li class="nav-dropdown-item"><a class="nav-dropdown-link" href="#">Dropdown Item</a></li>
|
||||
<li class="nav-dropdown-item"><a class="nav-dropdown-link" href="#">Dropdown Item</a></li>
|
||||
<li class="nav-dropdown-item"><a class="nav-dropdown-link" href="#">Dropdown Item</a></li>
|
||||
<li class="nav-dropdown-item"><a class="nav-dropdown-link" href="#">Dropdown Item</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#">Subdropdown</a>
|
||||
<ul class="nav-dropdown">
|
||||
<li class="nav-dropdown-item">
|
||||
<a class="nav-dropdown-link" href="#">Dropdown Item</a>
|
||||
<ul class="nav-subdropdown">
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-dropdown-item">
|
||||
<a class="nav-dropdown-link" href="#">Dropdown Item</a>
|
||||
<ul class="nav-subdropdown">
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#">Subdropdown LG</a>
|
||||
<ul class="nav-dropdown">
|
||||
<li class="nav-dropdown-item">
|
||||
<a class="nav-dropdown-link" href="#">Dropdown Item</a>
|
||||
<div class="nav-subdropdown nav-subdropdown-lg">
|
||||
<div class="row g-2 g-lg-3">
|
||||
<div class="col-12 col-lg-6">
|
||||
<ul>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="col-12 col-lg-6">
|
||||
<ul>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div><!-- end row -->
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- Menu Extra -->
|
||||
<div class="header-menu-extra">
|
||||
<ul class="list-inline-sm">
|
||||
<li><a href="#"><i class="bi bi-facebook"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-twitter-x"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-linkedin"></i></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- Menu Toggle -->
|
||||
<button class="header-toggle">
|
||||
<span></span>
|
||||
</button>
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
<!-- end Header -->
|
||||
|
||||
<div class="section-sm bg-gray-lighter">
|
||||
<div class="container text-center">
|
||||
<h3 class="font-family-playfair">mono blog.</h3>
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
|
||||
<!-- Blog section -->
|
||||
<div class="section">
|
||||
<div class="container">
|
||||
<div class="row g-5">
|
||||
<!-- Blog Posts -->
|
||||
<div class="col-12 col-lg-8">
|
||||
<!-- Blog Post box 1 -->
|
||||
<div class="mb-5">
|
||||
<div class="img-link-box">
|
||||
<a href="#">
|
||||
<img src="../assets/images/col-1.jpg" alt="">
|
||||
</a>
|
||||
</div>
|
||||
<div class="mt-4">
|
||||
<div class="d-flex justify-content-between mb-2">
|
||||
<div class="d-inline-flex">
|
||||
<a class="font-family-poppins font-small fw-medium uppercase" href="#">Lifestyle</a>
|
||||
</div>
|
||||
<div class="d-inline-flex">
|
||||
<span class="font-small">Jan 24, 2019</span>
|
||||
</div>
|
||||
</div>
|
||||
<h4><a class="text-link-1" href="#">Benefits of Minimalism</a></h4>
|
||||
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem.</p>
|
||||
<div class="mt-3">
|
||||
<a class="button-text-1" href="#">Read More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Blog Post box 2 -->
|
||||
<div class="mb-5">
|
||||
<div class="img-link-box">
|
||||
<a href="#">
|
||||
<img src="../assets/images/col-1.jpg" alt="">
|
||||
</a>
|
||||
</div>
|
||||
<div class="mt-4">
|
||||
<div class="d-flex justify-content-between mb-2">
|
||||
<div class="d-inline-flex">
|
||||
<a class="font-family-poppins font-small fw-medium uppercase" href="#">Knowledge</a>
|
||||
</div>
|
||||
<div class="d-inline-flex">
|
||||
<span class="font-small">Jan 24, 2019</span>
|
||||
</div>
|
||||
</div>
|
||||
<h4><a class="text-link-1" href="#">10 Books that I will recommend</a></h4>
|
||||
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem.</p>
|
||||
<div class="mt-3">
|
||||
<a class="button-text-1" href="#">Read More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Blog Post box 3 -->
|
||||
<div class="mb-5">
|
||||
<div class="img-link-box">
|
||||
<a href="#">
|
||||
<img src="../assets/images/col-1.jpg" alt="">
|
||||
</a>
|
||||
</div>
|
||||
<div class="mt-4">
|
||||
<div class="d-flex justify-content-between mb-2">
|
||||
<div class="d-inline-flex">
|
||||
<a class="font-family-poppins font-small fw-medium uppercase" href="#">Health</a>
|
||||
</div>
|
||||
<div class="d-inline-flex">
|
||||
<span class="font-small">Jan 24, 2019</span>
|
||||
</div>
|
||||
</div>
|
||||
<h4><a class="text-link-1" href="#">Benefits of house plants</a></h4>
|
||||
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem.</p>
|
||||
<div class="mt-3">
|
||||
<a class="button-text-1" href="#">Read More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Pagination -->
|
||||
<nav>
|
||||
<ul class="pagination justify-content-center mt-5">
|
||||
<li class="page-item"><a class="page-link" href="#">«</a></li>
|
||||
<li class="page-item active"><a class="page-link" href="#">1</a></li>
|
||||
<li class="page-item"><a class="page-link" href="#">2</a></li>
|
||||
<li class="page-item"><a class="page-link" href="#">3</a></li>
|
||||
<li class="page-item"><a class="page-link" href="#">»</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
<!-- end Blog Posts -->
|
||||
|
||||
<!-- Blog Sidebar -->
|
||||
<div class="col-12 col-lg-4 d-none d-lg-block">
|
||||
<!-- Sidebar box 1 - About me -->
|
||||
<div class="border p-4 mb-4 text-center">
|
||||
<h6 class="font-small fw-medium uppercase mb-4">About Me</h6>
|
||||
<img class="img-mask-avatar-md mb-3" src="../assets/images/img-avatar-md.jpg" alt="">
|
||||
<p>Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</p>
|
||||
<ul class="list-inline mt-3">
|
||||
<li><a href="#"><i class="bi bi-facebook"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-twitter-x"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-pinterest"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-instagram"></i></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- Sidebar box 2 - Categories -->
|
||||
<div class="border p-4 mb-4">
|
||||
<h6 class="font-small fw-medium uppercase mb-4 text-center">Categories</h6>
|
||||
<ul class="list-unstyled">
|
||||
<li class="pb-2 border-bottom"><a class="d-flex justify-content-between" href="#">Art <span>11</span></a></li>
|
||||
<li class="pb-2 border-bottom"><a class="d-flex justify-content-between" href="#">Fashion <span>4</span></a></li>
|
||||
<li class="pb-2 border-bottom"><a class="d-flex justify-content-between" href="#">Lifestyle <span>12</span></a></li>
|
||||
<li class="pb-2 border-bottom"><a class="d-flex justify-content-between" href="#">Nature <span>8</span></a></li>
|
||||
<li class="pb-2"><a class="d-flex justify-content-between" href="#">Travel <span>15</span></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- Sidebar box 3 - Popular Posts -->
|
||||
<div class="border p-4 mb-4">
|
||||
<h6 class="font-small fw-medium uppercase mb-4 text-center">Popular Posts</h6>
|
||||
<!-- Popular post 1 -->
|
||||
<div class="d-flex align-items-center mb-3">
|
||||
<a href="#">
|
||||
<img src="../assets/images/img-avatar-sm.jpg" alt="">
|
||||
</a>
|
||||
<div class="ps-3">
|
||||
<h6 class="fw-normal mb-0"><a class="text-link-1" href="#">Blog Post with Image</a></h6>
|
||||
<span class="font-small">January 07, 2018</span>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Popular post 2 -->
|
||||
<div class="d-flex align-items-center mb-3">
|
||||
<a href="#">
|
||||
<img src="../assets/images/img-avatar-sm.jpg" alt="">
|
||||
</a>
|
||||
<div class="ps-3">
|
||||
<h6 class="fw-normal mb-0"><a class="text-link-1" href="#">Blog Post with Image</a></h6>
|
||||
<span class="font-small">January 07, 2018</span>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Popular post 3 -->
|
||||
<div class="d-flex align-items-center">
|
||||
<a href="#">
|
||||
<img src="../assets/images/img-avatar-sm.jpg" alt="">
|
||||
</a>
|
||||
<div class="ps-3">
|
||||
<h6 class="fw-normal mb-0"><a class="text-link-1" href="#">Blog Post with Image</a></h6>
|
||||
<span class="font-small">January 07, 2018</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Sidebar box 4 - Banner Image -->
|
||||
<div class="mb-4">
|
||||
<a href="#">
|
||||
<img src="../assets/images/col-3.jpg" alt="">
|
||||
</a>
|
||||
</div>
|
||||
<!-- Sidebar box 5 - Tags -->
|
||||
<div class="border p-4 mb-4">
|
||||
<h6 class="font-small fw-medium uppercase mb-4 text-center">Tags</h6>
|
||||
<ul class="list-inline">
|
||||
<li><a class="button-text-1" href="#">Art</a></li>
|
||||
<li><a class="button-text-1" href="#">Design</a></li>
|
||||
<li><a class="button-text-1" href="#">Event</a></li>
|
||||
<li><a class="button-text-1" href="#">Fashion</a></li>
|
||||
<li><a class="button-text-1" href="#">Food</a></li>
|
||||
<li><a class="button-text-1" href="#">Inspiration</a></li>
|
||||
<li><a class="button-text-1" href="#">Movie</a></li>
|
||||
<li><a class="button-text-1" href="#">Music</a></li>
|
||||
<li><a class="button-text-1" href="#">Nature</a></li>
|
||||
<li><a class="button-text-1" href="#">Office</a></li>
|
||||
<li><a class="button-text-1" href="#">Painting</a></li>
|
||||
<li><a class="button-text-1" href="#">Photography</a></li>
|
||||
<li><a class="button-text-1" href="#">People</a></li>
|
||||
<li><a class="button-text-1" href="#">Work</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- Sidebar box 6 - Facebook Like box -->
|
||||
<div class="border p-4 mb-4 text-center">
|
||||
<h6 class="font-small fw-medium uppercase mb-4">Follow on</h6>
|
||||
<ul class="list-inline">
|
||||
<li><a href="#"><i class="bi bi-facebook"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-twitter-x"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-pinterest"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-behance"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-instagram"></i></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<!-- end Blog Sidebar -->
|
||||
</div><!-- end row -->
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
<!-- end Blog section -->
|
||||
|
||||
<footer>
|
||||
<div class="section bg-dark">
|
||||
<div class="container">
|
||||
<div class="row g-4 align-items-center">
|
||||
<div class="col-12 col-md-6 text-center text-md-start">
|
||||
<ul class="list-inline-dash">
|
||||
<li><a href="#">FAQ</a></li>
|
||||
<li><a href="#">Careers</a></li>
|
||||
<li><a href="#">Clients</a></li>
|
||||
</ul>
|
||||
<p class="mt-2">© 2025 FlaTheme, All Rights Reserved.</p>
|
||||
</div>
|
||||
<div class="col-12 col-md-6 text-center text-md-end">
|
||||
<ul class="list-inline">
|
||||
<li><a href="#"><i class="bi bi-facebook"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-twitter-x"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-pinterest"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-instagram"></i></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div><!-- end row -->
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<!-- Scroll to top button -->
|
||||
<div class="scrolltotop icon-lg">
|
||||
<a class="button-circle button-circle-md button-circle-dark" href="#"><i class="bi bi-arrow-up-short"></i></a>
|
||||
</div>
|
||||
<!-- end Scroll to top button -->
|
||||
|
||||
<!-- ***** JAVASCRIPTS ***** -->
|
||||
<script src="../assets/plugins/jquery.min.js"></script>
|
||||
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY"></script>
|
||||
<script src="../assets/plugins/plugins.js"></script>
|
||||
<script src="../assets/js/functions.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
324
docs/theme/Mono v10.0.1 HTML5/Mono v10.0.1/4. Blog/single-post-1-carousel.html
vendored
Normal file
324
docs/theme/Mono v10.0.1 HTML5/Mono v10.0.1/4. Blog/single-post-1-carousel.html
vendored
Normal file
@@ -0,0 +1,324 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<meta name="description" content="">
|
||||
<meta name="keywords" content="">
|
||||
<title>Mono - Single Post 1 | Carousel Post</title>
|
||||
<!-- Favicon -->
|
||||
<link href="../assets/images/favicon.png" rel="shortcut icon">
|
||||
<!-- CSS -->
|
||||
<link href="../assets/plugins/bootstrap/bootstrap.min.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/owl-carousel/owl.carousel.min.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/owl-carousel/owl.theme.default.min.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/magnific-popup/magnific-popup.min.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/scrollcue/scrollcue.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/swiper/swiper-bundle.min.css" rel="stylesheet">
|
||||
<link href="../assets/css/theme.css" rel="stylesheet">
|
||||
<!-- Fonts/Icons -->
|
||||
<link href="../assets/plugins/bootstrap-icons/bootstrap-icons.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/font-awesome/css/all.css" rel="stylesheet">
|
||||
</head>
|
||||
<body data-preloader="1">
|
||||
|
||||
<!-- Header -->
|
||||
<div class="header right transparent-light">
|
||||
<div class="container">
|
||||
<!-- Logo -->
|
||||
<div class="header-logo">
|
||||
<h3 class="uppercase letter-spacing-1"><a href="#">mono</a></h3>
|
||||
<!--
|
||||
<img class="logo-dark" src="../assets/images/your-logo-dark.png" alt="">
|
||||
<img class="logo-light" src="../assets/images/your-logo-light.png" alt="">
|
||||
-->
|
||||
</div>
|
||||
<!-- Menu -->
|
||||
<div class="header-menu">
|
||||
<ul class="nav">
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#">Link Only</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#">Dropdown</a>
|
||||
<ul class="nav-dropdown">
|
||||
<li class="nav-dropdown-item"><a class="nav-dropdown-link" href="#">Dropdown Item</a></li>
|
||||
<li class="nav-dropdown-item"><a class="nav-dropdown-link" href="#">Dropdown Item</a></li>
|
||||
<li class="nav-dropdown-item"><a class="nav-dropdown-link" href="#">Dropdown Item</a></li>
|
||||
<li class="nav-dropdown-item"><a class="nav-dropdown-link" href="#">Dropdown Item</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#">Subdropdown</a>
|
||||
<ul class="nav-dropdown">
|
||||
<li class="nav-dropdown-item">
|
||||
<a class="nav-dropdown-link" href="#">Dropdown Item</a>
|
||||
<ul class="nav-subdropdown">
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-dropdown-item">
|
||||
<a class="nav-dropdown-link" href="#">Dropdown Item</a>
|
||||
<ul class="nav-subdropdown">
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#">Subdropdown LG</a>
|
||||
<ul class="nav-dropdown">
|
||||
<li class="nav-dropdown-item">
|
||||
<a class="nav-dropdown-link" href="#">Dropdown Item</a>
|
||||
<div class="nav-subdropdown nav-subdropdown-lg">
|
||||
<div class="row g-2 g-lg-3">
|
||||
<div class="col-12 col-lg-6">
|
||||
<ul>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="col-12 col-lg-6">
|
||||
<ul>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div><!-- end row -->
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- Menu Extra -->
|
||||
<div class="header-menu-extra">
|
||||
<ul class="list-inline-sm">
|
||||
<li><a href="#"><i class="bi bi-facebook"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-twitter-x"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-linkedin"></i></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- Menu Toggle -->
|
||||
<button class="header-toggle">
|
||||
<span></span>
|
||||
</button>
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
<!-- end Header -->
|
||||
|
||||
<div class="section-xl bg-image parallax" data-bg-src="../assets/images/background.jpg">
|
||||
<div class="bg-dark-06">
|
||||
<div class="container text-center">
|
||||
<h1 class="fw-light">Carousel Post</h1>
|
||||
<ul class="list-inline-dash">
|
||||
<li><a href="#">June 6, 2018</a></li>
|
||||
<li><a href="#">Category</a></li>
|
||||
<li><a href="#">By John Doe</a></li>
|
||||
</ul>
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Blog Post section -->
|
||||
<div class="section">
|
||||
<div class="container">
|
||||
<div class="row g-4">
|
||||
<div class="col-12 col-sm-10 offset-sm-1 col-md-8 offset-md-2">
|
||||
<div class="owl-carousel owl-nav-overlay owl-dots-overlay mb-4" data-owl-items="1" data-owl-nav="true" data-owl-autoplay="true">
|
||||
<!-- Slider Item 1 -->
|
||||
<div>
|
||||
<img src="../assets/images/col-1.jpg" alt="">
|
||||
</div>
|
||||
<!-- Slider Item 2 -->
|
||||
<div>
|
||||
<img src="../assets/images/col-1.jpg" alt="">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</p>
|
||||
|
||||
<blockquote class="blockquote mt-3">
|
||||
<p>Vivamus elementum semper nisi. Aenean vulputate eleifend tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim.</p>
|
||||
<footer class="blockquote-footer"><h6 class="font-small fw-normal uppercase">Alexander Warren</h6></footer>
|
||||
</blockquote>
|
||||
|
||||
<p>Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo.</p>
|
||||
<div class="mt-4 mb-4">
|
||||
<div class="row g-4">
|
||||
<div class="col-12 col-md-6">
|
||||
<img src="../assets/images/col-2.jpg" alt="">
|
||||
</div>
|
||||
<div class="col-12 col-md-6">
|
||||
<img src="../assets/images/col-2.jpg" alt="">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<p>You can use the mark tag to <mark>highlight</mark> text. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt.</p>
|
||||
<!-- Post Tags / Share -->
|
||||
<div class="row g-4 mt-5">
|
||||
<div class="col-6">
|
||||
<h6 class="font-small fw-normal uppercase">Tags</h6>
|
||||
<ul class="list-inline-sm">
|
||||
<li><a class="text-link-1" href="#">Clothing</a></li>
|
||||
<li><a class="text-link-1" href="#">Lifestyle</a></li>
|
||||
<li><a class="text-link-1" href="#">Travel</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="col-6 text-end">
|
||||
<h6 class="font-small fw-normal uppercase">Share On</h6>
|
||||
<ul class="list-inline">
|
||||
<li><a href="#"><i class="bi bi-facebook"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-twitter-x"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-google"></i></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<!-- end Post Tags / Share -->
|
||||
</div>
|
||||
</div><!-- end row -->
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
<!-- end Blog Post section -->
|
||||
|
||||
<!-- Post Author section -->
|
||||
<div class="section bg-gray-lighter">
|
||||
<div class="container text-center">
|
||||
<div class="row g-4">
|
||||
<div class="col-12 col-sm-10 offset-sm-1 col-md-8 offset-md-2 col-lg-6 offset-lg-3">
|
||||
<img class="img-mask-avatar-lg mb-3" src="../assets/images/img-avatar-lg.jpg">
|
||||
<h5 class="fw-normal">Johnny Doe</h5>
|
||||
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. </p>
|
||||
<!-- Social links -->
|
||||
<ul class="list-inline mt-3">
|
||||
<li><a href="#"><i class="bi bi-facebook"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-twitter-x"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-pinterest"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-instagram"></i></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div><!-- end row -->
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
<!-- end Post Author section -->
|
||||
|
||||
<!-- Comments section -->
|
||||
<div class="section">
|
||||
<div class="container">
|
||||
<div class="row g-4">
|
||||
<div class="col-12 col-sm-10 offset-sm-1 col-md-8 offset-md-2">
|
||||
<h4 class="mb-5 text-center">Comments</h4>
|
||||
<!-- Comment box 1 -->
|
||||
<div class="comment-box">
|
||||
<div class="comment-user-avatar">
|
||||
<i class="fa fa-user"></i>
|
||||
</div>
|
||||
<div class="comment-content">
|
||||
<span class="comment-time">2 hours ago</span>
|
||||
<h6 class="fw-normal">John Smith</h6>
|
||||
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor.</p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Comment box 2 -->
|
||||
<div class="comment-box">
|
||||
<div class="comment-user-avatar">
|
||||
<i class="fa fa-user"></i>
|
||||
</div>
|
||||
<div class="comment-content">
|
||||
<span class="comment-time">5 hours ago</span>
|
||||
<h6 class="fw-normal">Alexander Warren</h6>
|
||||
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor.</p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Comment box 3 -->
|
||||
<div class="comment-box">
|
||||
<div class="comment-user-avatar">
|
||||
<i class="fa fa-user"></i>
|
||||
</div>
|
||||
<div class="comment-content">
|
||||
<span class="comment-time">1 day ago</span>
|
||||
<h6 class="fw-normal">Melissa Bakos</h6>
|
||||
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div><!-- end row -->
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
<!-- end Comments section -->
|
||||
|
||||
<!-- Write Comment section -->
|
||||
<div class="section border-top">
|
||||
<div class="container">
|
||||
<div class="row g-4">
|
||||
<div class="col-12 col-sm-10 offset-sm-1 col-md-8 offset-md-2">
|
||||
<h4 class="mb-5 text-center">Write a Comment</h4>
|
||||
<div class="text-end">
|
||||
<form>
|
||||
<div class="row g-4">
|
||||
<div class="col-12 col-sm-6">
|
||||
<input type="text" name="name" placeholder="Name" required>
|
||||
</div>
|
||||
<div class="col-12 col-sm-6">
|
||||
<input type="email" name="email" placeholder="E-Mail" required>
|
||||
</div>
|
||||
</div>
|
||||
<textarea name="message" placeholder="Message"></textarea>
|
||||
<button class="button button-lg button-gray" type="submit">Post Comment</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div><!-- end row -->
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
<!-- end Write Comment section -->
|
||||
|
||||
<footer>
|
||||
<div class="section bg-dark">
|
||||
<div class="container">
|
||||
<div class="row g-4 align-items-center">
|
||||
<div class="col-12 col-md-6 text-center text-md-start">
|
||||
<ul class="list-inline-dash">
|
||||
<li><a href="#">FAQ</a></li>
|
||||
<li><a href="#">Careers</a></li>
|
||||
<li><a href="#">Clients</a></li>
|
||||
</ul>
|
||||
<p class="mt-2">© 2025 FlaTheme, All Rights Reserved.</p>
|
||||
</div>
|
||||
<div class="col-12 col-md-6 text-center text-md-end">
|
||||
<ul class="list-inline">
|
||||
<li><a href="#"><i class="bi bi-facebook"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-twitter-x"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-pinterest"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-instagram"></i></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div><!-- end row -->
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<!-- Scroll to top button -->
|
||||
<div class="scrolltotop icon-lg">
|
||||
<a class="button-circle button-circle-md button-circle-dark" href="#"><i class="bi bi-arrow-up-short"></i></a>
|
||||
</div>
|
||||
<!-- end Scroll to top button -->
|
||||
|
||||
<!-- ***** JAVASCRIPTS ***** -->
|
||||
<script src="../assets/plugins/jquery.min.js"></script>
|
||||
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY"></script>
|
||||
<script src="../assets/plugins/plugins.js"></script>
|
||||
<script src="../assets/js/functions.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
342
docs/theme/Mono v10.0.1 HTML5/Mono v10.0.1/4. Blog/single-post-1-gallery.html
vendored
Normal file
342
docs/theme/Mono v10.0.1 HTML5/Mono v10.0.1/4. Blog/single-post-1-gallery.html
vendored
Normal file
@@ -0,0 +1,342 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<meta name="description" content="">
|
||||
<meta name="keywords" content="">
|
||||
<title>Mono - Single Post 1 | Gallery Post</title>
|
||||
<!-- Favicon -->
|
||||
<link href="../assets/images/favicon.png" rel="shortcut icon">
|
||||
<!-- CSS -->
|
||||
<link href="../assets/plugins/bootstrap/bootstrap.min.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/owl-carousel/owl.carousel.min.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/owl-carousel/owl.theme.default.min.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/magnific-popup/magnific-popup.min.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/scrollcue/scrollcue.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/swiper/swiper-bundle.min.css" rel="stylesheet">
|
||||
<link href="../assets/css/theme.css" rel="stylesheet">
|
||||
<!-- Fonts/Icons -->
|
||||
<link href="../assets/plugins/bootstrap-icons/bootstrap-icons.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/font-awesome/css/all.css" rel="stylesheet">
|
||||
</head>
|
||||
<body data-preloader="1">
|
||||
|
||||
<!-- Header -->
|
||||
<div class="header right transparent-light">
|
||||
<div class="container">
|
||||
<!-- Logo -->
|
||||
<div class="header-logo">
|
||||
<h3 class="uppercase letter-spacing-1"><a href="#">mono</a></h3>
|
||||
<!--
|
||||
<img class="logo-dark" src="../assets/images/your-logo-dark.png" alt="">
|
||||
<img class="logo-light" src="../assets/images/your-logo-light.png" alt="">
|
||||
-->
|
||||
</div>
|
||||
<!-- Menu -->
|
||||
<div class="header-menu">
|
||||
<ul class="nav">
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#">Link Only</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#">Dropdown</a>
|
||||
<ul class="nav-dropdown">
|
||||
<li class="nav-dropdown-item"><a class="nav-dropdown-link" href="#">Dropdown Item</a></li>
|
||||
<li class="nav-dropdown-item"><a class="nav-dropdown-link" href="#">Dropdown Item</a></li>
|
||||
<li class="nav-dropdown-item"><a class="nav-dropdown-link" href="#">Dropdown Item</a></li>
|
||||
<li class="nav-dropdown-item"><a class="nav-dropdown-link" href="#">Dropdown Item</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#">Subdropdown</a>
|
||||
<ul class="nav-dropdown">
|
||||
<li class="nav-dropdown-item">
|
||||
<a class="nav-dropdown-link" href="#">Dropdown Item</a>
|
||||
<ul class="nav-subdropdown">
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-dropdown-item">
|
||||
<a class="nav-dropdown-link" href="#">Dropdown Item</a>
|
||||
<ul class="nav-subdropdown">
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#">Subdropdown LG</a>
|
||||
<ul class="nav-dropdown">
|
||||
<li class="nav-dropdown-item">
|
||||
<a class="nav-dropdown-link" href="#">Dropdown Item</a>
|
||||
<div class="nav-subdropdown nav-subdropdown-lg">
|
||||
<div class="row g-2 g-lg-3">
|
||||
<div class="col-12 col-lg-6">
|
||||
<ul>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="col-12 col-lg-6">
|
||||
<ul>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div><!-- end row -->
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- Menu Extra -->
|
||||
<div class="header-menu-extra">
|
||||
<ul class="list-inline-sm">
|
||||
<li><a href="#"><i class="bi bi-facebook"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-twitter-x"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-linkedin"></i></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- Menu Toggle -->
|
||||
<button class="header-toggle">
|
||||
<span></span>
|
||||
</button>
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
<!-- end Header -->
|
||||
|
||||
<div class="section-xl bg-image parallax" data-bg-src="../assets/images/background.jpg">
|
||||
<div class="bg-dark-06">
|
||||
<div class="container text-center">
|
||||
<h1 class="fw-light">Gallery Post</h1>
|
||||
<ul class="list-inline-dash">
|
||||
<li><a href="#">June 6, 2018</a></li>
|
||||
<li><a href="#">Category</a></li>
|
||||
<li><a href="#">By John Doe</a></li>
|
||||
</ul>
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Blog Post section -->
|
||||
<div class="section">
|
||||
<div class="container">
|
||||
<div class="row g-4">
|
||||
<div class="col-12 col-sm-10 offset-sm-1 col-md-8 offset-md-2">
|
||||
<div class="mb-4">
|
||||
<div class="row gallery-wrapper spacing-3">
|
||||
<!-- Gallery image box 1 -->
|
||||
<div class="col-12 gallery-box">
|
||||
<div class="gallery-img">
|
||||
<a href="../assets/images/col-1.jpg" data-gallery-title="Gallery Image 1">
|
||||
<img src="../assets/images/col-1.jpg" alt="">
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Gallery image box 2 -->
|
||||
<div class="col-12 col-md-6 gallery-box">
|
||||
<div class="gallery-img">
|
||||
<a href="../assets/images/col-2.jpg" data-gallery-title="Gallery Image 2">
|
||||
<img src="../assets/images/col-2.jpg" alt="">
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Gallery image box 3 -->
|
||||
<div class="col-12 col-md-6 gallery-box">
|
||||
<div class="gallery-img">
|
||||
<a href="../assets/images/col-2.jpg" data-gallery-title="Gallery Image 3">
|
||||
<img src="../assets/images/col-2.jpg" alt="">
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div><!-- end row/gallery-wrapper -->
|
||||
</div>
|
||||
|
||||
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</p>
|
||||
|
||||
<blockquote class="blockquote mt-3">
|
||||
<p>Vivamus elementum semper nisi. Aenean vulputate eleifend tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim.</p>
|
||||
<footer class="blockquote-footer"><h6 class="font-small fw-normal uppercase">Alexander Warren</h6></footer>
|
||||
</blockquote>
|
||||
|
||||
<p>Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo.</p>
|
||||
<div class="mt-4 mb-4">
|
||||
<div class="row g-4">
|
||||
<div class="col-12 col-md-6">
|
||||
<img src="../assets/images/col-2.jpg" alt="">
|
||||
</div>
|
||||
<div class="col-12 col-md-6">
|
||||
<img src="../assets/images/col-2.jpg" alt="">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<p>You can use the mark tag to <mark>highlight</mark> text. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt.</p>
|
||||
<!-- Post Tags / Share -->
|
||||
<div class="row g-4 mt-5">
|
||||
<div class="col-6">
|
||||
<h6 class="font-small fw-normal uppercase">Tags</h6>
|
||||
<ul class="list-inline-sm">
|
||||
<li><a class="text-link-1" href="#">Clothing</a></li>
|
||||
<li><a class="text-link-1" href="#">Lifestyle</a></li>
|
||||
<li><a class="text-link-1" href="#">Travel</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="col-6 text-end">
|
||||
<h6 class="font-small fw-normal uppercase">Share On</h6>
|
||||
<ul class="list-inline">
|
||||
<li><a href="#"><i class="bi bi-facebook"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-twitter-x"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-google"></i></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<!-- end Post Tags / Share -->
|
||||
</div>
|
||||
</div><!-- end row -->
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
<!-- end Blog Post section -->
|
||||
|
||||
<!-- Post Author section -->
|
||||
<div class="section bg-gray-lighter">
|
||||
<div class="container text-center">
|
||||
<div class="row g-4">
|
||||
<div class="col-12 col-sm-10 offset-sm-1 col-md-8 offset-md-2 col-lg-6 offset-lg-3">
|
||||
<img class="img-mask-avatar-lg mb-3" src="../assets/images/img-avatar-lg.jpg">
|
||||
<h5 class="fw-normal">Johnny Doe</h5>
|
||||
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. </p>
|
||||
<!-- Social links -->
|
||||
<ul class="list-inline mt-3">
|
||||
<li><a href="#"><i class="bi bi-facebook"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-twitter-x"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-pinterest"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-instagram"></i></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div><!-- end row -->
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
<!-- end Post Author section -->
|
||||
|
||||
<!-- Comments section -->
|
||||
<div class="section">
|
||||
<div class="container">
|
||||
<div class="row g-4">
|
||||
<div class="col-12 col-sm-10 offset-sm-1 col-md-8 offset-md-2">
|
||||
<h4 class="mb-5 text-center">Comments</h4>
|
||||
<!-- Comment box 1 -->
|
||||
<div class="comment-box">
|
||||
<div class="comment-user-avatar">
|
||||
<i class="fa fa-user"></i>
|
||||
</div>
|
||||
<div class="comment-content">
|
||||
<span class="comment-time">2 hours ago</span>
|
||||
<h6 class="fw-normal">John Smith</h6>
|
||||
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor.</p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Comment box 2 -->
|
||||
<div class="comment-box">
|
||||
<div class="comment-user-avatar">
|
||||
<i class="fa fa-user"></i>
|
||||
</div>
|
||||
<div class="comment-content">
|
||||
<span class="comment-time">5 hours ago</span>
|
||||
<h6 class="fw-normal">Alexander Warren</h6>
|
||||
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor.</p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Comment box 3 -->
|
||||
<div class="comment-box">
|
||||
<div class="comment-user-avatar">
|
||||
<i class="fa fa-user"></i>
|
||||
</div>
|
||||
<div class="comment-content">
|
||||
<span class="comment-time">1 day ago</span>
|
||||
<h6 class="fw-normal">Melissa Bakos</h6>
|
||||
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div><!-- end row -->
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
<!-- end Comments section -->
|
||||
|
||||
<!-- Write Comment section -->
|
||||
<div class="section border-top">
|
||||
<div class="container">
|
||||
<div class="row g-4">
|
||||
<div class="col-12 col-sm-10 offset-sm-1 col-md-8 offset-md-2">
|
||||
<h4 class="mb-5 text-center">Write a Comment</h4>
|
||||
<div class="text-end">
|
||||
<form>
|
||||
<div class="row g-4">
|
||||
<div class="col-12 col-sm-6">
|
||||
<input type="text" name="name" placeholder="Name" required>
|
||||
</div>
|
||||
<div class="col-12 col-sm-6">
|
||||
<input type="email" name="email" placeholder="E-Mail" required>
|
||||
</div>
|
||||
</div>
|
||||
<textarea name="message" placeholder="Message"></textarea>
|
||||
<button class="button button-lg button-gray" type="submit">Post Comment</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div><!-- end row -->
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
<!-- end Write Comment section -->
|
||||
|
||||
<footer>
|
||||
<div class="section bg-dark">
|
||||
<div class="container">
|
||||
<div class="row g-4 align-items-center">
|
||||
<div class="col-12 col-md-6 text-center text-md-start">
|
||||
<ul class="list-inline-dash">
|
||||
<li><a href="#">FAQ</a></li>
|
||||
<li><a href="#">Careers</a></li>
|
||||
<li><a href="#">Clients</a></li>
|
||||
</ul>
|
||||
<p class="mt-2">© 2025 FlaTheme, All Rights Reserved.</p>
|
||||
</div>
|
||||
<div class="col-12 col-md-6 text-center text-md-end">
|
||||
<ul class="list-inline">
|
||||
<li><a href="#"><i class="bi bi-facebook"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-twitter-x"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-pinterest"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-instagram"></i></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div><!-- end row -->
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<!-- Scroll to top button -->
|
||||
<div class="scrolltotop icon-lg">
|
||||
<a class="button-circle button-circle-md button-circle-dark" href="#"><i class="bi bi-arrow-up-short"></i></a>
|
||||
</div>
|
||||
<!-- end Scroll to top button -->
|
||||
|
||||
<!-- ***** JAVASCRIPTS ***** -->
|
||||
<script src="../assets/plugins/jquery.min.js"></script>
|
||||
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY"></script>
|
||||
<script src="../assets/plugins/plugins.js"></script>
|
||||
<script src="../assets/js/functions.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
317
docs/theme/Mono v10.0.1 HTML5/Mono v10.0.1/4. Blog/single-post-1-image.html
vendored
Normal file
317
docs/theme/Mono v10.0.1 HTML5/Mono v10.0.1/4. Blog/single-post-1-image.html
vendored
Normal file
@@ -0,0 +1,317 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<meta name="description" content="">
|
||||
<meta name="keywords" content="">
|
||||
<title>Mono - Single Post 1 | Image Post</title>
|
||||
<!-- Favicon -->
|
||||
<link href="../assets/images/favicon.png" rel="shortcut icon">
|
||||
<!-- CSS -->
|
||||
<link href="../assets/plugins/bootstrap/bootstrap.min.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/owl-carousel/owl.carousel.min.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/owl-carousel/owl.theme.default.min.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/magnific-popup/magnific-popup.min.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/scrollcue/scrollcue.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/swiper/swiper-bundle.min.css" rel="stylesheet">
|
||||
<link href="../assets/css/theme.css" rel="stylesheet">
|
||||
<!-- Fonts/Icons -->
|
||||
<link href="../assets/plugins/bootstrap-icons/bootstrap-icons.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/font-awesome/css/all.css" rel="stylesheet">
|
||||
</head>
|
||||
<body data-preloader="1">
|
||||
|
||||
<!-- Header -->
|
||||
<div class="header right transparent-light">
|
||||
<div class="container">
|
||||
<!-- Logo -->
|
||||
<div class="header-logo">
|
||||
<h3 class="uppercase letter-spacing-1"><a href="#">mono</a></h3>
|
||||
<!--
|
||||
<img class="logo-dark" src="../assets/images/your-logo-dark.png" alt="">
|
||||
<img class="logo-light" src="../assets/images/your-logo-light.png" alt="">
|
||||
-->
|
||||
</div>
|
||||
<!-- Menu -->
|
||||
<div class="header-menu">
|
||||
<ul class="nav">
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#">Link Only</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#">Dropdown</a>
|
||||
<ul class="nav-dropdown">
|
||||
<li class="nav-dropdown-item"><a class="nav-dropdown-link" href="#">Dropdown Item</a></li>
|
||||
<li class="nav-dropdown-item"><a class="nav-dropdown-link" href="#">Dropdown Item</a></li>
|
||||
<li class="nav-dropdown-item"><a class="nav-dropdown-link" href="#">Dropdown Item</a></li>
|
||||
<li class="nav-dropdown-item"><a class="nav-dropdown-link" href="#">Dropdown Item</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#">Subdropdown</a>
|
||||
<ul class="nav-dropdown">
|
||||
<li class="nav-dropdown-item">
|
||||
<a class="nav-dropdown-link" href="#">Dropdown Item</a>
|
||||
<ul class="nav-subdropdown">
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-dropdown-item">
|
||||
<a class="nav-dropdown-link" href="#">Dropdown Item</a>
|
||||
<ul class="nav-subdropdown">
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#">Subdropdown LG</a>
|
||||
<ul class="nav-dropdown">
|
||||
<li class="nav-dropdown-item">
|
||||
<a class="nav-dropdown-link" href="#">Dropdown Item</a>
|
||||
<div class="nav-subdropdown nav-subdropdown-lg">
|
||||
<div class="row g-2 g-lg-3">
|
||||
<div class="col-12 col-lg-6">
|
||||
<ul>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="col-12 col-lg-6">
|
||||
<ul>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div><!-- end row -->
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- Menu Extra -->
|
||||
<div class="header-menu-extra">
|
||||
<ul class="list-inline-sm">
|
||||
<li><a href="#"><i class="bi bi-facebook"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-twitter-x"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-linkedin"></i></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- Menu Toggle -->
|
||||
<button class="header-toggle">
|
||||
<span></span>
|
||||
</button>
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
<!-- end Header -->
|
||||
|
||||
<div class="section-xl bg-image parallax" data-bg-src="../assets/images/background.jpg">
|
||||
<div class="bg-dark-06">
|
||||
<div class="container text-center">
|
||||
<h1 class="fw-light">Image Post</h1>
|
||||
<ul class="list-inline-dash">
|
||||
<li><a href="#">June 6, 2018</a></li>
|
||||
<li><a href="#">Category</a></li>
|
||||
<li><a href="#">By John Doe</a></li>
|
||||
</ul>
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Blog Post section -->
|
||||
<div class="section">
|
||||
<div class="container">
|
||||
<div class="row g-4">
|
||||
<div class="col-12 col-sm-10 offset-sm-1 col-md-8 offset-md-2">
|
||||
<div class="mb-4">
|
||||
<img src="../assets/images/col-1.jpg" alt="">
|
||||
</div>
|
||||
|
||||
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</p>
|
||||
|
||||
<blockquote class="blockquote mt-3">
|
||||
<p>Vivamus elementum semper nisi. Aenean vulputate eleifend tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim.</p>
|
||||
<footer class="blockquote-footer"><h6 class="font-small fw-normal uppercase">Alexander Warren</h6></footer>
|
||||
</blockquote>
|
||||
|
||||
<p>Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo.</p>
|
||||
<div class="mt-4 mb-4">
|
||||
<div class="row g-4">
|
||||
<div class="col-12 col-md-6">
|
||||
<img src="../assets/images/col-2.jpg" alt="">
|
||||
</div>
|
||||
<div class="col-12 col-md-6">
|
||||
<img src="../assets/images/col-2.jpg" alt="">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<p>You can use the mark tag to <mark>highlight</mark> text. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt.</p>
|
||||
<!-- Post Tags / Share -->
|
||||
<div class="row g-4 mt-5">
|
||||
<div class="col-6">
|
||||
<h6 class="font-small fw-normal uppercase">Tags</h6>
|
||||
<ul class="list-inline-sm">
|
||||
<li><a class="text-link-1" href="#">Clothing</a></li>
|
||||
<li><a class="text-link-1" href="#">Lifestyle</a></li>
|
||||
<li><a class="text-link-1" href="#">Travel</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="col-6 text-end">
|
||||
<h6 class="font-small fw-normal uppercase">Share On</h6>
|
||||
<ul class="list-inline">
|
||||
<li><a href="#"><i class="bi bi-facebook"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-twitter-x"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-google"></i></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<!-- end Post Tags / Share -->
|
||||
</div>
|
||||
</div><!-- end row -->
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
<!-- end Blog Post section -->
|
||||
|
||||
<!-- Post Author section -->
|
||||
<div class="section bg-gray-lighter">
|
||||
<div class="container text-center">
|
||||
<div class="row g-4">
|
||||
<div class="col-12 col-sm-10 offset-sm-1 col-md-8 offset-md-2 col-lg-6 offset-lg-3">
|
||||
<img class="img-mask-avatar-lg mb-3" src="../assets/images/img-avatar-lg.jpg">
|
||||
<h5 class="fw-normal">Johnny Doe</h5>
|
||||
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. </p>
|
||||
<!-- Social links -->
|
||||
<ul class="list-inline mt-3">
|
||||
<li><a href="#"><i class="bi bi-facebook"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-twitter-x"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-pinterest"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-instagram"></i></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div><!-- end row -->
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
<!-- end Post Author section -->
|
||||
|
||||
<!-- Comments section -->
|
||||
<div class="section">
|
||||
<div class="container">
|
||||
<div class="row g-4">
|
||||
<div class="col-12 col-sm-10 offset-sm-1 col-md-8 offset-md-2">
|
||||
<h4 class="mb-5 text-center">Comments</h4>
|
||||
<!-- Comment box 1 -->
|
||||
<div class="comment-box">
|
||||
<div class="comment-user-avatar">
|
||||
<i class="fa fa-user"></i>
|
||||
</div>
|
||||
<div class="comment-content">
|
||||
<span class="comment-time">2 hours ago</span>
|
||||
<h6 class="fw-normal">John Smith</h6>
|
||||
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor.</p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Comment box 2 -->
|
||||
<div class="comment-box">
|
||||
<div class="comment-user-avatar">
|
||||
<i class="fa fa-user"></i>
|
||||
</div>
|
||||
<div class="comment-content">
|
||||
<span class="comment-time">5 hours ago</span>
|
||||
<h6 class="fw-normal">Alexander Warren</h6>
|
||||
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor.</p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Comment box 3 -->
|
||||
<div class="comment-box">
|
||||
<div class="comment-user-avatar">
|
||||
<i class="fa fa-user"></i>
|
||||
</div>
|
||||
<div class="comment-content">
|
||||
<span class="comment-time">1 day ago</span>
|
||||
<h6 class="fw-normal">Melissa Bakos</h6>
|
||||
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div><!-- end row -->
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
<!-- end Comments section -->
|
||||
|
||||
<!-- Write Comment section -->
|
||||
<div class="section border-top">
|
||||
<div class="container">
|
||||
<div class="row g-4">
|
||||
<div class="col-12 col-sm-10 offset-sm-1 col-md-8 offset-md-2">
|
||||
<h4 class="mb-5 text-center">Write a Comment</h4>
|
||||
<div class="text-end">
|
||||
<form>
|
||||
<div class="row g-4">
|
||||
<div class="col-12 col-sm-6">
|
||||
<input type="text" name="name" placeholder="Name" required>
|
||||
</div>
|
||||
<div class="col-12 col-sm-6">
|
||||
<input type="email" name="email" placeholder="E-Mail" required>
|
||||
</div>
|
||||
</div>
|
||||
<textarea name="message" placeholder="Message"></textarea>
|
||||
<button class="button button-lg button-gray" type="submit">Post Comment</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div><!-- end row -->
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
<!-- end Write Comment section -->
|
||||
|
||||
<footer>
|
||||
<div class="section bg-dark">
|
||||
<div class="container">
|
||||
<div class="row g-4 align-items-center">
|
||||
<div class="col-12 col-md-6 text-center text-md-start">
|
||||
<ul class="list-inline-dash">
|
||||
<li><a href="#">FAQ</a></li>
|
||||
<li><a href="#">Careers</a></li>
|
||||
<li><a href="#">Clients</a></li>
|
||||
</ul>
|
||||
<p class="mt-2">© 2025 FlaTheme, All Rights Reserved.</p>
|
||||
</div>
|
||||
<div class="col-12 col-md-6 text-center text-md-end">
|
||||
<ul class="list-inline">
|
||||
<li><a href="#"><i class="bi bi-facebook"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-twitter-x"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-pinterest"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-instagram"></i></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div><!-- end row -->
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<!-- Scroll to top button -->
|
||||
<div class="scrolltotop icon-lg">
|
||||
<a class="button-circle button-circle-md button-circle-dark" href="#"><i class="bi bi-arrow-up-short"></i></a>
|
||||
</div>
|
||||
<!-- end Scroll to top button -->
|
||||
|
||||
<!-- ***** JAVASCRIPTS ***** -->
|
||||
<script src="../assets/plugins/jquery.min.js"></script>
|
||||
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY"></script>
|
||||
<script src="../assets/plugins/plugins.js"></script>
|
||||
<script src="../assets/js/functions.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
318
docs/theme/Mono v10.0.1 HTML5/Mono v10.0.1/4. Blog/single-post-1-video.html
vendored
Normal file
318
docs/theme/Mono v10.0.1 HTML5/Mono v10.0.1/4. Blog/single-post-1-video.html
vendored
Normal file
@@ -0,0 +1,318 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<meta name="description" content="">
|
||||
<meta name="keywords" content="">
|
||||
<title>Mono - Single Post 1 | Video Post</title>
|
||||
<!-- Favicon -->
|
||||
<link href="../assets/images/favicon.png" rel="shortcut icon">
|
||||
<!-- CSS -->
|
||||
<link href="../assets/plugins/bootstrap/bootstrap.min.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/owl-carousel/owl.carousel.min.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/owl-carousel/owl.theme.default.min.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/magnific-popup/magnific-popup.min.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/scrollcue/scrollcue.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/swiper/swiper-bundle.min.css" rel="stylesheet">
|
||||
<link href="../assets/css/theme.css" rel="stylesheet">
|
||||
<!-- Fonts/Icons -->
|
||||
<link href="../assets/plugins/bootstrap-icons/bootstrap-icons.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/font-awesome/css/all.css" rel="stylesheet">
|
||||
</head>
|
||||
<body data-preloader="1">
|
||||
|
||||
<!-- Header -->
|
||||
<div class="header right transparent-light">
|
||||
<div class="container">
|
||||
<!-- Logo -->
|
||||
<div class="header-logo">
|
||||
<h3 class="uppercase letter-spacing-1"><a href="#">mono</a></h3>
|
||||
<!--
|
||||
<img class="logo-dark" src="../assets/images/your-logo-dark.png" alt="">
|
||||
<img class="logo-light" src="../assets/images/your-logo-light.png" alt="">
|
||||
-->
|
||||
</div>
|
||||
<!-- Menu -->
|
||||
<div class="header-menu">
|
||||
<ul class="nav">
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#">Link Only</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#">Dropdown</a>
|
||||
<ul class="nav-dropdown">
|
||||
<li class="nav-dropdown-item"><a class="nav-dropdown-link" href="#">Dropdown Item</a></li>
|
||||
<li class="nav-dropdown-item"><a class="nav-dropdown-link" href="#">Dropdown Item</a></li>
|
||||
<li class="nav-dropdown-item"><a class="nav-dropdown-link" href="#">Dropdown Item</a></li>
|
||||
<li class="nav-dropdown-item"><a class="nav-dropdown-link" href="#">Dropdown Item</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#">Subdropdown</a>
|
||||
<ul class="nav-dropdown">
|
||||
<li class="nav-dropdown-item">
|
||||
<a class="nav-dropdown-link" href="#">Dropdown Item</a>
|
||||
<ul class="nav-subdropdown">
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-dropdown-item">
|
||||
<a class="nav-dropdown-link" href="#">Dropdown Item</a>
|
||||
<ul class="nav-subdropdown">
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#">Subdropdown LG</a>
|
||||
<ul class="nav-dropdown">
|
||||
<li class="nav-dropdown-item">
|
||||
<a class="nav-dropdown-link" href="#">Dropdown Item</a>
|
||||
<div class="nav-subdropdown nav-subdropdown-lg">
|
||||
<div class="row g-2 g-lg-3">
|
||||
<div class="col-12 col-lg-6">
|
||||
<ul>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="col-12 col-lg-6">
|
||||
<ul>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div><!-- end row -->
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- Menu Extra -->
|
||||
<div class="header-menu-extra">
|
||||
<ul class="list-inline-sm">
|
||||
<li><a href="#"><i class="bi bi-facebook"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-twitter-x"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-linkedin"></i></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- Menu Toggle -->
|
||||
<button class="header-toggle">
|
||||
<span></span>
|
||||
</button>
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
<!-- end Header -->
|
||||
|
||||
<div class="section-xl bg-image parallax" data-bg-src="../assets/images/background.jpg">
|
||||
<div class="bg-dark-06">
|
||||
<div class="container text-center">
|
||||
<h1 class="fw-light">Video Post</h1>
|
||||
<ul class="list-inline-dash">
|
||||
<li><a href="#">June 6, 2018</a></li>
|
||||
<li><a href="#">Category</a></li>
|
||||
<li><a href="#">By John Doe</a></li>
|
||||
</ul>
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Blog Post section -->
|
||||
<div class="section">
|
||||
<div class="container">
|
||||
<div class="row g-4">
|
||||
<div class="col-12 col-sm-10 offset-sm-1 col-md-8 offset-md-2">
|
||||
<a class="lightbox-media-box mb-4" href="https://www.youtube.com/watch?v=W-j4QGAgNu8">
|
||||
<img src="../assets/images/col-1.jpg" alt="">
|
||||
<i class="fas fa-play"></i>
|
||||
</a>
|
||||
|
||||
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</p>
|
||||
|
||||
<blockquote class="blockquote mt-3">
|
||||
<p>Vivamus elementum semper nisi. Aenean vulputate eleifend tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim.</p>
|
||||
<footer class="blockquote-footer"><h6 class="font-small fw-normal uppercase">Alexander Warren</h6></footer>
|
||||
</blockquote>
|
||||
|
||||
<p>Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo.</p>
|
||||
<div class="mt-4 mb-4">
|
||||
<div class="row g-4">
|
||||
<div class="col-12 col-md-6">
|
||||
<img src="../assets/images/col-2.jpg" alt="">
|
||||
</div>
|
||||
<div class="col-12 col-md-6">
|
||||
<img src="../assets/images/col-2.jpg" alt="">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<p>You can use the mark tag to <mark>highlight</mark> text. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt.</p>
|
||||
<!-- Post Tags / Share -->
|
||||
<div class="row g-4 mt-5">
|
||||
<div class="col-6">
|
||||
<h6 class="font-small fw-normal uppercase">Tags</h6>
|
||||
<ul class="list-inline-sm">
|
||||
<li><a class="text-link-1" href="#">Clothing</a></li>
|
||||
<li><a class="text-link-1" href="#">Lifestyle</a></li>
|
||||
<li><a class="text-link-1" href="#">Travel</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="col-6 text-end">
|
||||
<h6 class="font-small fw-normal uppercase">Share On</h6>
|
||||
<ul class="list-inline">
|
||||
<li><a href="#"><i class="bi bi-facebook"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-twitter-x"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-google"></i></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<!-- end Post Tags / Share -->
|
||||
</div>
|
||||
</div><!-- end row -->
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
<!-- end Blog Post section -->
|
||||
|
||||
<!-- Post Author section -->
|
||||
<div class="section bg-gray-lighter">
|
||||
<div class="container text-center">
|
||||
<div class="row g-4">
|
||||
<div class="col-12 col-sm-10 offset-sm-1 col-md-8 offset-md-2 col-lg-6 offset-lg-3">
|
||||
<img class="img-mask-avatar-lg mb-3" src="../assets/images/img-avatar-lg.jpg">
|
||||
<h5 class="fw-normal">Johnny Doe</h5>
|
||||
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. </p>
|
||||
<!-- Social links -->
|
||||
<ul class="list-inline mt-3">
|
||||
<li><a href="#"><i class="bi bi-facebook"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-twitter-x"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-pinterest"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-instagram"></i></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div><!-- end row -->
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
<!-- end Post Author section -->
|
||||
|
||||
<!-- Comments section -->
|
||||
<div class="section">
|
||||
<div class="container">
|
||||
<div class="row g-4">
|
||||
<div class="col-12 col-sm-10 offset-sm-1 col-md-8 offset-md-2">
|
||||
<h4 class="mb-5 text-center">Comments</h4>
|
||||
<!-- Comment box 1 -->
|
||||
<div class="comment-box">
|
||||
<div class="comment-user-avatar">
|
||||
<i class="fa fa-user"></i>
|
||||
</div>
|
||||
<div class="comment-content">
|
||||
<span class="comment-time">2 hours ago</span>
|
||||
<h6 class="fw-normal">John Smith</h6>
|
||||
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor.</p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Comment box 2 -->
|
||||
<div class="comment-box">
|
||||
<div class="comment-user-avatar">
|
||||
<i class="fa fa-user"></i>
|
||||
</div>
|
||||
<div class="comment-content">
|
||||
<span class="comment-time">5 hours ago</span>
|
||||
<h6 class="fw-normal">Alexander Warren</h6>
|
||||
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor.</p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Comment box 3 -->
|
||||
<div class="comment-box">
|
||||
<div class="comment-user-avatar">
|
||||
<i class="fa fa-user"></i>
|
||||
</div>
|
||||
<div class="comment-content">
|
||||
<span class="comment-time">1 day ago</span>
|
||||
<h6 class="fw-normal">Melissa Bakos</h6>
|
||||
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div><!-- end row -->
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
<!-- end Comments section -->
|
||||
|
||||
<!-- Write Comment section -->
|
||||
<div class="section border-top">
|
||||
<div class="container">
|
||||
<div class="row g-4">
|
||||
<div class="col-12 col-sm-10 offset-sm-1 col-md-8 offset-md-2">
|
||||
<h4 class="mb-5 text-center">Write a Comment</h4>
|
||||
<div class="text-end">
|
||||
<form>
|
||||
<div class="row g-4">
|
||||
<div class="col-12 col-sm-6">
|
||||
<input type="text" name="name" placeholder="Name" required>
|
||||
</div>
|
||||
<div class="col-12 col-sm-6">
|
||||
<input type="email" name="email" placeholder="E-Mail" required>
|
||||
</div>
|
||||
</div>
|
||||
<textarea name="message" placeholder="Message"></textarea>
|
||||
<button class="button button-lg button-gray" type="submit">Post Comment</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div><!-- end row -->
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
<!-- end Write Comment section -->
|
||||
|
||||
<footer>
|
||||
<div class="section bg-dark">
|
||||
<div class="container">
|
||||
<div class="row g-4 align-items-center">
|
||||
<div class="col-12 col-md-6 text-center text-md-start">
|
||||
<ul class="list-inline-dash">
|
||||
<li><a href="#">FAQ</a></li>
|
||||
<li><a href="#">Careers</a></li>
|
||||
<li><a href="#">Clients</a></li>
|
||||
</ul>
|
||||
<p class="mt-2">© 2025 FlaTheme, All Rights Reserved.</p>
|
||||
</div>
|
||||
<div class="col-12 col-md-6 text-center text-md-end">
|
||||
<ul class="list-inline">
|
||||
<li><a href="#"><i class="bi bi-facebook"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-twitter-x"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-pinterest"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-instagram"></i></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div><!-- end row -->
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<!-- Scroll to top button -->
|
||||
<div class="scrolltotop icon-lg">
|
||||
<a class="button-circle button-circle-md button-circle-dark" href="#"><i class="bi bi-arrow-up-short"></i></a>
|
||||
</div>
|
||||
<!-- end Scroll to top button -->
|
||||
|
||||
<!-- ***** JAVASCRIPTS ***** -->
|
||||
<script src="../assets/plugins/jquery.min.js"></script>
|
||||
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY"></script>
|
||||
<script src="../assets/plugins/plugins.js"></script>
|
||||
<script src="../assets/js/functions.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
317
docs/theme/Mono v10.0.1 HTML5/Mono v10.0.1/4. Blog/single-post-1.html
vendored
Normal file
317
docs/theme/Mono v10.0.1 HTML5/Mono v10.0.1/4. Blog/single-post-1.html
vendored
Normal file
@@ -0,0 +1,317 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<meta name="description" content="">
|
||||
<meta name="keywords" content="">
|
||||
<title>Mono - Single Post 1 | Audio Post</title>
|
||||
<!-- Favicon -->
|
||||
<link href="../assets/images/favicon.png" rel="shortcut icon">
|
||||
<!-- CSS -->
|
||||
<link href="../assets/plugins/bootstrap/bootstrap.min.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/owl-carousel/owl.carousel.min.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/owl-carousel/owl.theme.default.min.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/magnific-popup/magnific-popup.min.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/scrollcue/scrollcue.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/swiper/swiper-bundle.min.css" rel="stylesheet">
|
||||
<link href="../assets/css/theme.css" rel="stylesheet">
|
||||
<!-- Fonts/Icons -->
|
||||
<link href="../assets/plugins/bootstrap-icons/bootstrap-icons.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/font-awesome/css/all.css" rel="stylesheet">
|
||||
</head>
|
||||
<body data-preloader="1">
|
||||
|
||||
<!-- Header -->
|
||||
<div class="header right transparent-light">
|
||||
<div class="container">
|
||||
<!-- Logo -->
|
||||
<div class="header-logo">
|
||||
<h3 class="uppercase letter-spacing-1"><a href="#">mono</a></h3>
|
||||
<!--
|
||||
<img class="logo-dark" src="../assets/images/your-logo-dark.png" alt="">
|
||||
<img class="logo-light" src="../assets/images/your-logo-light.png" alt="">
|
||||
-->
|
||||
</div>
|
||||
<!-- Menu -->
|
||||
<div class="header-menu">
|
||||
<ul class="nav">
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#">Link Only</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#">Dropdown</a>
|
||||
<ul class="nav-dropdown">
|
||||
<li class="nav-dropdown-item"><a class="nav-dropdown-link" href="#">Dropdown Item</a></li>
|
||||
<li class="nav-dropdown-item"><a class="nav-dropdown-link" href="#">Dropdown Item</a></li>
|
||||
<li class="nav-dropdown-item"><a class="nav-dropdown-link" href="#">Dropdown Item</a></li>
|
||||
<li class="nav-dropdown-item"><a class="nav-dropdown-link" href="#">Dropdown Item</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#">Subdropdown</a>
|
||||
<ul class="nav-dropdown">
|
||||
<li class="nav-dropdown-item">
|
||||
<a class="nav-dropdown-link" href="#">Dropdown Item</a>
|
||||
<ul class="nav-subdropdown">
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-dropdown-item">
|
||||
<a class="nav-dropdown-link" href="#">Dropdown Item</a>
|
||||
<ul class="nav-subdropdown">
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#">Subdropdown LG</a>
|
||||
<ul class="nav-dropdown">
|
||||
<li class="nav-dropdown-item">
|
||||
<a class="nav-dropdown-link" href="#">Dropdown Item</a>
|
||||
<div class="nav-subdropdown nav-subdropdown-lg">
|
||||
<div class="row g-2 g-lg-3">
|
||||
<div class="col-12 col-lg-6">
|
||||
<ul>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="col-12 col-lg-6">
|
||||
<ul>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div><!-- end row -->
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- Menu Extra -->
|
||||
<div class="header-menu-extra">
|
||||
<ul class="list-inline-sm">
|
||||
<li><a href="#"><i class="bi bi-facebook"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-twitter-x"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-linkedin"></i></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- Menu Toggle -->
|
||||
<button class="header-toggle">
|
||||
<span></span>
|
||||
</button>
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
<!-- end Header -->
|
||||
|
||||
<div class="section-xl bg-image parallax" data-bg-src="../assets/images/background.jpg">
|
||||
<div class="bg-dark-06">
|
||||
<div class="container text-center">
|
||||
<h1 class="fw-light">Audio Post</h1>
|
||||
<ul class="list-inline-dash">
|
||||
<li><a href="#">June 6, 2018</a></li>
|
||||
<li><a href="#">Category</a></li>
|
||||
<li><a href="#">By John Doe</a></li>
|
||||
</ul>
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Blog Post section -->
|
||||
<div class="section">
|
||||
<div class="container">
|
||||
<div class="row g-4">
|
||||
<div class="col-12 col-sm-10 offset-sm-1 col-md-8 offset-md-2">
|
||||
<div class="mb-4">
|
||||
<iframe scrolling="no" allow="autoplay" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/4973256&color=%23ff5500&visual=true"></iframe>
|
||||
</div>
|
||||
|
||||
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</p>
|
||||
|
||||
<blockquote class="blockquote mt-3">
|
||||
<p>Vivamus elementum semper nisi. Aenean vulputate eleifend tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim.</p>
|
||||
<footer class="blockquote-footer"><h6 class="font-small fw-normal uppercase">Alexander Warren</h6></footer>
|
||||
</blockquote>
|
||||
|
||||
<p>Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo.</p>
|
||||
<div class="mt-4 mb-4">
|
||||
<div class="row g-4">
|
||||
<div class="col-12 col-md-6">
|
||||
<img src="../assets/images/col-2.jpg" alt="">
|
||||
</div>
|
||||
<div class="col-12 col-md-6">
|
||||
<img src="../assets/images/col-2.jpg" alt="">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<p>You can use the mark tag to <mark>highlight</mark> text. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt.</p>
|
||||
<!-- Post Tags / Share -->
|
||||
<div class="row g-4 mt-5">
|
||||
<div class="col-6">
|
||||
<h6 class="font-small fw-normal uppercase">Tags</h6>
|
||||
<ul class="list-inline-sm">
|
||||
<li><a class="text-link-1" href="#">Clothing</a></li>
|
||||
<li><a class="text-link-1" href="#">Lifestyle</a></li>
|
||||
<li><a class="text-link-1" href="#">Travel</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="col-6 text-end">
|
||||
<h6 class="font-small fw-normal uppercase">Share On</h6>
|
||||
<ul class="list-inline">
|
||||
<li><a href="#"><i class="bi bi-facebook"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-twitter-x"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-google"></i></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<!-- end Post Tags / Share -->
|
||||
</div>
|
||||
</div><!-- end row -->
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
<!-- end Blog Post section -->
|
||||
|
||||
<!-- Post Author section -->
|
||||
<div class="section bg-gray-lighter">
|
||||
<div class="container text-center">
|
||||
<div class="row g-4">
|
||||
<div class="col-12 col-sm-10 offset-sm-1 col-md-8 offset-md-2 col-lg-6 offset-lg-3">
|
||||
<img class="img-mask-avatar-lg mb-3" src="../assets/images/img-avatar-lg.jpg">
|
||||
<h5 class="fw-normal">Johnny Doe</h5>
|
||||
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. </p>
|
||||
<!-- Social links -->
|
||||
<ul class="list-inline mt-3">
|
||||
<li><a href="#"><i class="bi bi-facebook"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-twitter-x"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-pinterest"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-instagram"></i></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div><!-- end row -->
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
<!-- end Post Author section -->
|
||||
|
||||
<!-- Comments section -->
|
||||
<div class="section">
|
||||
<div class="container">
|
||||
<div class="row g-4">
|
||||
<div class="col-12 col-sm-10 offset-sm-1 col-md-8 offset-md-2">
|
||||
<h4 class="mb-5 text-center">Comments</h4>
|
||||
<!-- Comment box 1 -->
|
||||
<div class="comment-box">
|
||||
<div class="comment-user-avatar">
|
||||
<i class="fa fa-user"></i>
|
||||
</div>
|
||||
<div class="comment-content">
|
||||
<span class="comment-time">2 hours ago</span>
|
||||
<h6 class="fw-normal">John Smith</h6>
|
||||
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor.</p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Comment box 2 -->
|
||||
<div class="comment-box">
|
||||
<div class="comment-user-avatar">
|
||||
<i class="fa fa-user"></i>
|
||||
</div>
|
||||
<div class="comment-content">
|
||||
<span class="comment-time">5 hours ago</span>
|
||||
<h6 class="fw-normal">Alexander Warren</h6>
|
||||
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor.</p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Comment box 3 -->
|
||||
<div class="comment-box">
|
||||
<div class="comment-user-avatar">
|
||||
<i class="fa fa-user"></i>
|
||||
</div>
|
||||
<div class="comment-content">
|
||||
<span class="comment-time">1 day ago</span>
|
||||
<h6 class="fw-normal">Melissa Bakos</h6>
|
||||
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div><!-- end row -->
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
<!-- end Comments section -->
|
||||
|
||||
<!-- Write Comment section -->
|
||||
<div class="section border-top">
|
||||
<div class="container">
|
||||
<div class="row g-4">
|
||||
<div class="col-12 col-sm-10 offset-sm-1 col-md-8 offset-md-2">
|
||||
<h4 class="mb-5 text-center">Write a Comment</h4>
|
||||
<div class="text-end">
|
||||
<form>
|
||||
<div class="row g-4">
|
||||
<div class="col-12 col-sm-6">
|
||||
<input type="text" name="name" placeholder="Name" required>
|
||||
</div>
|
||||
<div class="col-12 col-sm-6">
|
||||
<input type="email" name="email" placeholder="E-Mail" required>
|
||||
</div>
|
||||
</div>
|
||||
<textarea name="message" placeholder="Message"></textarea>
|
||||
<button class="button button-lg button-gray" type="submit">Post Comment</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div><!-- end row -->
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
<!-- end Write Comment section -->
|
||||
|
||||
<footer>
|
||||
<div class="section bg-dark">
|
||||
<div class="container">
|
||||
<div class="row g-4 align-items-center">
|
||||
<div class="col-12 col-md-6 text-center text-md-start">
|
||||
<ul class="list-inline-dash">
|
||||
<li><a href="#">FAQ</a></li>
|
||||
<li><a href="#">Careers</a></li>
|
||||
<li><a href="#">Clients</a></li>
|
||||
</ul>
|
||||
<p class="mt-2">© 2025 FlaTheme, All Rights Reserved.</p>
|
||||
</div>
|
||||
<div class="col-12 col-md-6 text-center text-md-end">
|
||||
<ul class="list-inline">
|
||||
<li><a href="#"><i class="bi bi-facebook"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-twitter-x"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-pinterest"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-instagram"></i></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div><!-- end row -->
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<!-- Scroll to top button -->
|
||||
<div class="scrolltotop icon-lg">
|
||||
<a class="button-circle button-circle-md button-circle-dark" href="#"><i class="bi bi-arrow-up-short"></i></a>
|
||||
</div>
|
||||
<!-- end Scroll to top button -->
|
||||
|
||||
<!-- ***** JAVASCRIPTS ***** -->
|
||||
<script src="../assets/plugins/jquery.min.js"></script>
|
||||
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY"></script>
|
||||
<script src="../assets/plugins/plugins.js"></script>
|
||||
<script src="../assets/js/functions.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
309
docs/theme/Mono v10.0.1 HTML5/Mono v10.0.1/4. Blog/single-post-2.html
vendored
Normal file
309
docs/theme/Mono v10.0.1 HTML5/Mono v10.0.1/4. Blog/single-post-2.html
vendored
Normal file
@@ -0,0 +1,309 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<meta name="description" content="">
|
||||
<meta name="keywords" content="">
|
||||
<title>Mono - Single Post 2</title>
|
||||
<!-- Favicon -->
|
||||
<link href="../assets/images/favicon.png" rel="shortcut icon">
|
||||
<!-- CSS -->
|
||||
<link href="../assets/plugins/bootstrap/bootstrap.min.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/owl-carousel/owl.carousel.min.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/owl-carousel/owl.theme.default.min.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/magnific-popup/magnific-popup.min.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/scrollcue/scrollcue.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/swiper/swiper-bundle.min.css" rel="stylesheet">
|
||||
<link href="../assets/css/theme.css" rel="stylesheet">
|
||||
<!-- Fonts/Icons -->
|
||||
<link href="../assets/plugins/bootstrap-icons/bootstrap-icons.css" rel="stylesheet">
|
||||
<link href="../assets/plugins/font-awesome/css/all.css" rel="stylesheet">
|
||||
</head>
|
||||
<body data-preloader="1">
|
||||
|
||||
<!-- Header -->
|
||||
<div class="header right header-color-dark">
|
||||
<div class="container">
|
||||
<!-- Logo -->
|
||||
<div class="header-logo">
|
||||
<h3 class="uppercase letter-spacing-1"><a href="#">mono</a></h3>
|
||||
<!--
|
||||
<img class="logo-dark" src="../assets/images/your-logo-dark.png" alt="">
|
||||
<img class="logo-light" src="../assets/images/your-logo-light.png" alt="">
|
||||
-->
|
||||
</div>
|
||||
<!-- Menu -->
|
||||
<div class="header-menu">
|
||||
<ul class="nav">
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#">Link Only</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#">Dropdown</a>
|
||||
<ul class="nav-dropdown">
|
||||
<li class="nav-dropdown-item"><a class="nav-dropdown-link" href="#">Dropdown Item</a></li>
|
||||
<li class="nav-dropdown-item"><a class="nav-dropdown-link" href="#">Dropdown Item</a></li>
|
||||
<li class="nav-dropdown-item"><a class="nav-dropdown-link" href="#">Dropdown Item</a></li>
|
||||
<li class="nav-dropdown-item"><a class="nav-dropdown-link" href="#">Dropdown Item</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#">Subdropdown</a>
|
||||
<ul class="nav-dropdown">
|
||||
<li class="nav-dropdown-item">
|
||||
<a class="nav-dropdown-link" href="#">Dropdown Item</a>
|
||||
<ul class="nav-subdropdown">
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-dropdown-item">
|
||||
<a class="nav-dropdown-link" href="#">Dropdown Item</a>
|
||||
<ul class="nav-subdropdown">
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#">Subdropdown LG</a>
|
||||
<ul class="nav-dropdown">
|
||||
<li class="nav-dropdown-item">
|
||||
<a class="nav-dropdown-link" href="#">Dropdown Item</a>
|
||||
<div class="nav-subdropdown nav-subdropdown-lg">
|
||||
<div class="row g-2 g-lg-3">
|
||||
<div class="col-12 col-lg-6">
|
||||
<ul>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="col-12 col-lg-6">
|
||||
<ul>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
<li class="nav-subdropdown-item"><a class="nav-subdropdown-link" href="#">Subdropdown Item</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div><!-- end row -->
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- Menu Extra -->
|
||||
<div class="header-menu-extra">
|
||||
<ul class="list-inline-sm">
|
||||
<li><a href="#"><i class="bi bi-facebook"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-twitter-x"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-linkedin"></i></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- Menu Toggle -->
|
||||
<button class="header-toggle">
|
||||
<span></span>
|
||||
</button>
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
<!-- end Header -->
|
||||
|
||||
<div class="section">
|
||||
<div class="container">
|
||||
<div class="row g-4">
|
||||
<div class="col-12 col-md-10 offset-md-1">
|
||||
<h1 class="fw-normal">Blog Post Title</h1>
|
||||
<ul class="list-inline-dash">
|
||||
<li><a href="#">by Admin</a></li>
|
||||
<li><a href="#">Category</a></li>
|
||||
<li><a href="#">Feb 6, 2019</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div><!-- end row -->
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
|
||||
<!-- Featured Image -->
|
||||
<div class="container">
|
||||
<img src="../assets/images/col-1.jpg" alt="">
|
||||
</div><!-- end container -->
|
||||
<!-- end Featured Image -->
|
||||
|
||||
<!-- Post Content -->
|
||||
<div class="section">
|
||||
<div class="container">
|
||||
<div class="row g-4">
|
||||
<div class="col-12 col-md-10 offset-md-1">
|
||||
|
||||
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</p>
|
||||
|
||||
<blockquote class="blockquote mt-3">
|
||||
<p>Vivamus elementum semper nisi. Aenean vulputate eleifend tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim.</p>
|
||||
<footer class="blockquote-footer"><h6 class="font-small fw-normal uppercase">Alexander Warren</h6></footer>
|
||||
</blockquote>
|
||||
|
||||
<p>Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo.</p>
|
||||
|
||||
<div class="mt-3 mb-3">
|
||||
<div class="row g-3">
|
||||
<div class="col-12 col-md-6">
|
||||
<img src="../assets/images/col-2.jpg" alt="">
|
||||
</div>
|
||||
<div class="col-12 col-md-6">
|
||||
<img src="../assets/images/col-2.jpg" alt="">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<p>You can use the mark tag to <mark>highlight</mark> text. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt.</p>
|
||||
|
||||
</div>
|
||||
</div><!-- end row -->
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
<!-- end Post Content -->
|
||||
|
||||
<div class="section-xs border-top">
|
||||
<div class="container">
|
||||
<div class="row g-4">
|
||||
<div class="col-6">
|
||||
<h6 class="font-small fw-medium uppercase">Tags</h6>
|
||||
<ul class="list-inline-sm">
|
||||
<li><a href="#">Lifestyle</a></li>
|
||||
<li><a href="#">Travel</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="col-6 text-end">
|
||||
<h6 class="font-small fw-medium uppercase">Share On</h6>
|
||||
<ul class="list-inline">
|
||||
<li><a href="#"><i class="bi bi-facebook"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-twitter-x"></i></a></li>
|
||||
<li><a href="#"><i class="bi bi-google"></i></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div><!-- end row -->
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
|
||||
<!-- Comments section -->
|
||||
<div class="section bg-gray-lighter">
|
||||
<div class="container">
|
||||
<div class="row g-4">
|
||||
<div class="col-12 col-md-10 offset-md-1">
|
||||
<h4 class="fw-normal mb-5">Comments</h4>
|
||||
<!-- Comment box 1 -->
|
||||
<div class="comment-box">
|
||||
<div class="comment-user-avatar bg-dark">
|
||||
<i class="fa fa-user text-white"></i>
|
||||
</div>
|
||||
<div class="comment-content">
|
||||
<span class="comment-time">2 hours ago</span>
|
||||
<h6 class="fw-normal">John Smith</h6>
|
||||
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Comment box 2 -->
|
||||
<div class="comment-box">
|
||||
<div class="comment-user-avatar bg-dark">
|
||||
<i class="fa fa-user text-white"></i>
|
||||
</div>
|
||||
<div class="comment-content">
|
||||
<span class="comment-time">5 hours ago</span>
|
||||
<h6 class="fw-normal">Alexander Warren</h6>
|
||||
<p>Phasellus viverra nulla ut metus varius laoreet. Quisque rutrum. Aenean imperdiet. Etiam ultricies nisi vel augue. Curabitur ullamcorper ultricies nisi. Nam eget dui. Etiam rhoncus.</p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Comment box 3 -->
|
||||
<div class="comment-box">
|
||||
<div class="comment-user-avatar bg-dark">
|
||||
<i class="fa fa-user text-white"></i>
|
||||
</div>
|
||||
<div class="comment-content">
|
||||
<span class="comment-time">1 day ago</span>
|
||||
<h6 class="fw-normal">Melissa Bakos</h6>
|
||||
<p>Maecenas tempus, tellus eget condimentum rhoncus, sem quam semper libero, sit amet adipiscing sem neque sed ipsum.</p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- end Comment box 3 -->
|
||||
</div>
|
||||
</div><!-- end row -->
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
<!-- end Comments section -->
|
||||
|
||||
<!-- Write Comment section -->
|
||||
<div class="section">
|
||||
<div class="container">
|
||||
<div class="row g-4">
|
||||
<div class="col-12 col-md-10 offset-md-1">
|
||||
<h4 class="fw-normal mb-5">Write a Comment</h4>
|
||||
<form>
|
||||
<div class="row g-4">
|
||||
<div class="col-12 col-sm-6">
|
||||
<input type="text" name="name" placeholder="Name" required>
|
||||
</div>
|
||||
<div class="col-12 col-sm-6">
|
||||
<input type="email" name="email" placeholder="E-Mail" required>
|
||||
</div>
|
||||
</div>
|
||||
<textarea name="message" placeholder="Message"></textarea>
|
||||
<button class="button button-lg button-outline-gray" type="submit">Post Comment</button>
|
||||
</form>
|
||||
</div>
|
||||
</div><!-- end row -->
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
<!-- end Write Comment section -->
|
||||
|
||||
<footer>
|
||||
<div class="section bg-dark">
|
||||
<div class="container">
|
||||
<div class="row g-4 align-items-center">
|
||||
<div class="col-12 col-md-6">
|
||||
<h3>mono</h3>
|
||||
<ul class="list-inline-dash mt-4">
|
||||
<li><a href="#">FAQ</a></li>
|
||||
<li><a href="#">About</a></li>
|
||||
<li><a href="#">Contact</a></li>
|
||||
</ul>
|
||||
<p class="mt-2">© 2025 FlaTheme, All Rights Reserved.</p>
|
||||
</div>
|
||||
<div class="col-12 col-md-6 text-md-end">
|
||||
<ul class="list-unstyled">
|
||||
<li>121 King St, Melbourne VIC 3000</li>
|
||||
<li>contact@example.com</li>
|
||||
<li>+(123) 456 789 01</li>
|
||||
</ul>
|
||||
<ul class="list-inline-sm icon-sm mt-3">
|
||||
<li><a class="button-circle button-circle-sm button-circle-outline-white" href="#"><i class="bi bi-facebook"></i></a></li>
|
||||
<li><a class="button-circle button-circle-sm button-circle-outline-white" href="#"><i class="bi bi-twitter-x"></i></a></li>
|
||||
<li><a class="button-circle button-circle-sm button-circle-outline-white" href="#"><i class="bi bi-instagram"></i></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div><!-- end row -->
|
||||
</div><!-- end container -->
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<!-- Scroll to top button -->
|
||||
<div class="scrolltotop icon-lg">
|
||||
<a class="button-circle button-circle-md button-circle-dark" href="#"><i class="bi bi-arrow-up-short"></i></a>
|
||||
</div>
|
||||
<!-- end Scroll to top button -->
|
||||
|
||||
<!-- ***** JAVASCRIPTS ***** -->
|
||||
<script src="../assets/plugins/jquery.min.js"></script>
|
||||
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY"></script>
|
||||
<script src="../assets/plugins/plugins.js"></script>
|
||||
<script src="../assets/js/functions.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user