-
Notifications
You must be signed in to change notification settings - Fork 0
/
post.html
81 lines (72 loc) · 3.83 KB
/
post.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="./css/style.css">
<link rel="stylesheet" href="./css/utilities.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.1/css/all.min.css" integrity="sha512-+4zCK9k+qNFUR5X+cKL9EIR+ZOhtIloNl9GIKS57V1MyNsYpYcUrUeQc9vNfzsWfV28IaLL3i96P9sdNyeRssA==" crossorigin="anonymous" />
<title>Posts | FirstNotch</title>
</head>
<body id="Home">
<header class="hero blog">
<div id="navbar" class="navbar">
<h1 class="logo">
<span class="text-primary"><i class="fas fa-book-open"></i> First</span>Notch
</h1>
<nav>
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="index.html#about">About</a></li>
<li><a href="index.html#cases">Cases</a></li>
<li><a href="index.html#blog">Blog</a></li>
<li><a href="index.html#contact">Contact</a></li>
</ul>
</nav>
</div>
<div class="content">
<h1>Post</h1>
</div>
</header>
<main>
<section class="post top">
<h2>Blog Post #1</h2>
<p class="meta">
<i class="fas fa-user"></i> Posted by <strong>Alex Masterson</strong> | June 13, 2020
</p>
<img src="/images/blog/blog1.jpg" alt="">
<p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Dolor corporis voluptatem, temporibus enim suscipit officia distinctio ratione asperiores hic, quasi tempore? Nulla animi itaque quidem recusandae enim veniam? Culpa, quam!</p>
<p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Similique sint quod id fugit quidem odit harum aut officiis nisi qui aliquam, velit maiores? Minus hic vero modi accusantium aliquid quam debitis alias! Corrupti repudiandae repellat quae dolorem dicta. Nemo officia officiis, quo laudantium amet minus, fugit eos sed nesciunt corporis odio culpa adipisci optio architecto aut. Odio fuga voluptate consectetur.</p>
<p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Possimus exercitationem magni sunt, rem facere corporis molestias! Exercitationem culpa dolorum repellat in, sint molestiae consequatur expedita, amet impedit optio non ipsam illum pariatur temporibus fuga dicta repudiandae sed aut dignissimos natus. Provident quos natus consequatur rerum, dicta itaque obcaecati laborum inventore!</p>
</section>
</main>
<footer class="footer bg-dark">
<div class="social">
<a href="https://github.com/sanchitsharma1" target="_blank"><i class="fab fa-github fa-2x"></i></a>
<a href="https://instagram.com/_sanchit.sharma" target="_blank"><i class="fab fa-instagram fa-2x"></i></a>
<a href="#"><i class="fab fa-twitter fa-2x"></i></a>
<a href="https://www.linkedin.com/in/sanchit-sharma-3a4150157/"><i class="fab fa-linkedin fa-2x"></i></a>
</div>
<p>Copyright © 2020 - FirstNotch</p>
</footer>
<script>
const navbar = document.getElementById('navbar');
let scrolled = false;
window.onscroll = function() {
if(window.pageYOffset > 100) {
navbar.classList.remove('top');
if(!scrolled) {
navbar.style.transform = 'translateY(-70px)';
}
setTimeout(function() {
navbar.style.transform = 'translateY(0)';
scrolled = true;
}, 200);
} else {
navbar.classList.add('top');
scrolled = false;
}
};
</script>
</body>
</html>