-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy patharticle.html
106 lines (98 loc) · 6.15 KB
/
article.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
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.2/css/all.css" integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr" crossorigin="anonymous">
<link href="https://fonts.googleapis.com/css?family=Lato|Staatliches" rel="stylesheet">
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" media="screen and (max-width: 768px)" href="css/mobile.css">
<link rel="shortcut icon" type="image/x-icon" href="favicon.ico">
<title>NewsGrid | Latest News</title>
</head>
<body>
<nav id="main-nav">
<div class="container">
<img src="img/logo.png" alt="NewsGrid" class="logo">
<div class="social">
<a href="http://facebook.com" target="_blank"><i class="fab fa-facebook fa-2x"></i></a>
<a href="http://twitter.com" target="_blank"><i class="fab fa-twitter fa-2x"></i></a>
<a href="http://instagram.com" target="_blank"><i class="fab fa-instagram fa-2x"></i></a>
<a href="http://youtube.com" target="_blank"><i class="fab fa-youtube fa-2x"></i></a>
</div>
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="about.html">About</a></li>
</ul>
</div>
</nav>
<section id="article">
<div class="container">
<div class="page-container">
<article class="card">
<img src="img/articles/ent1.jpg" alt="">
<h1 class="l-heading">You Expected A Different Title</h1>
<div class="meta">
<small><i class="fas fa-user"></i> Written by John Doe January 12, 2019</small>
<div class="category category-ent">Entertainment</div>
</div>
<p>What you didn't expect was consectetur adipisicing elit. Commodi adipisci asperiores reiciendis qui optio expedita excepturi sed velit nobis accusamus facere quasi nostrum fuga omnis suscipit dolor et quibusdam laboriosam rem itaque ex officiis inventore, placeat id. Modi porro dignissimos accusamus laborum quas dolorem eum. Quasi voluptas doloribus quibusdam odio?</p>
<p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Inventore, non. Quam dolores eius, temporibus explicabo consequuntur laudantium quia animi nostrum deserunt doloremque molestias aliquid numquam ex maiores iste magnam fugit perspiciatis! Dolorem cupiditate molestias, quidem qui suscipit hic quis enim, dicta aspernatur consequatur deleniti veniam adipisci atque officia! Inventore hic cupiditate laboriosam accusamus, perferendis delectus aspernatur accusantium fugiat in fuga ratione tempora modi blanditiis officiis consequatur consequuntur corrupti eum molestias quas, alias incidunt esse reprehenderit beatae ipsum. Eveniet laborum nobis numquam veritatis nam doloribus minima alias et mollitia, quo repudiandae ad vel ratione sunt nemo rem asperiores molestias, nihil impedit, rerum pariatur. Laboriosam architecto explicabo perspiciatis, deserunt amet incidunt ratione blanditiis neque, pariatur fugiat eligendi facere est. Animi voluptate culpa aliquam, adipisci ducimus debitis. Soluta architecto vitae facilis quis, eos cum amet rerum vero tempore, repudiandae itaque. Voluptatum magnam in blanditiis nesciunt cupiditate voluptatem omnis, veniam porro obcaecati adipisci corporis.</p>
</article>
<aside id="categories" class="card">
<h2>Categories</h2>
<ul class="list">
<li><a href="#"><i class="fas fa-chevron-right"></i> Sports</a></li>
<li><a href="#"><i class="fas fa-chevron-right"></i> Entertainment</a></li>
<li><a href="#"><i class="fas fa-chevron-right"></i> Technology</a></li>
<li><a href="#"><i class="fas fa-chevron-right"></i> Fashion</a></li>
<li><a href="#"><i class="fas fa-chevron-right"></i> Shopping</a></li>
</ul>
</aside>
<aside class="card bg-secondary">
<h2>Join Our Club</h2>
<p>It's exclusive solely for the purpose of making you feel better than everyone else.</p>
<a href="#" class="btn btn-dark btn-block">Join Now</a>
</aside>
</div>
</div>
</section>
<!-- Footer -->
<footer id="main-footer" class="py-2">
<div class="container footer-container">
<div>
<img src="img/logo_light.png" alt="NewsGrid">
<p>All the news you need in the <em>tightest</em> grid you'll ever find. Nesciunt voluptates ut dolor et animi necessitatibus unde sit explicabo vero.</p>
</div>
<div>
<h3>Email Newsletter</h3>
<p>You will get annoyed but you <em>can</em> unsubscribe.</p>
<form name="contact" method="POST" data-netlify="true">
<input type="email" name="email" placeholder="Enter Email">
<input type="submit" value="Subscribe" class='btn btn-primary'>
</form>
</div>
<div>
<h3>Site Links</h3>
<ul class="list">
<li><a href="#">Help & Support</a></li>
<li><a href="#">Privacy Policy</a></li>
<li><a href="#">About Us</a></li>
<li><a href="#">Contact</a></li>
</ul>
</div>
<div>
<h2>Join Our Club</h2>
<p>It's exclusive solely for the purpose of making you feel better than everyone else.</p>
<a href="#" class="btn btn-secondary">Join Now</a>
</div>
<div>
<p>
Copyright © 2019, All Rights Reserved
</p>
</div>
</div>
</footer>
</body>
</html>