-
Notifications
You must be signed in to change notification settings - Fork 0
/
articleabm.html
93 lines (88 loc) · 5.39 KB
/
articleabm.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
<!DOCTYPE html>
<html lang="en">
<head>
<script src="https://kit.fontawesome.com/36bad91d7d.js"></script>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Article</title>
<link href="https://fonts.googleapis.com/css?family=Lato|Staatliches&display=swap" rel="stylesheet">
<link rel="stylesheet" href="strand.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">
</head>
<body>
<nav id="main-nav">
<div class="container">
<img src="images/ty.png" alt="NewsGrid" class="logo">
<div class="social">
<a href="https://facebook.com" target="_blank"><i class="fab fa-facebook fa-2x"></i></a>
<a href="https://twitter.com" target="_blank"><i class="fab fa-twitter fa-2x"></i></a>
<a href="https://instagram.com" target="_blank"><i class="fab fa-instagram fa-2x"></i></a>
<a href="https://youtube.com" target="_blank"><i class="fab fa-youtube fa-2x"></i></a>
</div>
<ul>
<li><a href="stem.html">Home</a></li>
</ul>
</div>
</nav>
<section id="article">
<div class="container">
<div class="page-container">
<article class="card">
<img src="images/uu.jpg" alt="">
<h1 class="l-heading">Lorem ipsum dolor sit amet.</h1>
<div class="meta">
<small>
<i class="fas fa-user"></i> Source Google
</small>
<div class="category category-ent">EDUCATION</div>
</div>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Unde, molestiae quo. Debitis ipsum deleniti perferendis sed ipsam hic quas qui, culpa, architecto aliquid ad ex veritatis blanditiis dolores error dolor et a, dignissimos tempora. Eos perferendis animi dicta quos, doloremque eligendi asperiores odio, laudantium rerum, voluptates expedita alias nihil minima.</p>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Provident, doloremque saepe error, laudantium fugit quas architecto soluta in, excepturi sit recusandae! Quisquam libero id provident ut perferendis sed distinctio iste quam aut, accusamus velit neque dignissimos at praesentium debitis voluptates minima vero doloremque aspernatur suscipit in quod ullam quasi? Quis dolore ut, quae repellat architecto ad, sit sed quasi iure distinctio doloribus, itaque eius ipsa voluptatum consequuntur soluta officiis alias quia. Veritatis eius odio deleniti autem atque asperiores, optio quaerat ipsa quo corrupti magnam nihil fuga dolore fugit rerum quod necessitatibus libero distinctio eaque nostrum? Saepe doloremque nihil quos dolore debitis rerum ducimus sapiente a laudantium eius nisi atque nesciunt, molestias nemo qui repellendus voluptates praesentium labore architecto ea amet, provident iste harum ipsum! Numquam tenetur nostrum saepe laboriosam, veritatis quod. Fugit cupiditate ipsa, aspernatur alias voluptatem sapiente provident excepturi, deserunt pariatur sint voluptas quae ipsum ab inventore, consectetur cumque?</p>
</article>
<aside id="catagories" 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>Lorem ipsum dolor sit amet consectetur adipisicing elit. Tempore, consectetur.</p>
<a href="" class="btn btn-dark btn-block">Join Now</a>
</aside>
</div>
</div>
</section>
<!-- Footer -->
<footer id="main-footer">
<div class="container footer-container">
<div>
<img src="img/logo_light.png" alt="NewsGrid">
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. A adipisci odio ipsa quae sunt accusantium corporis, blanditiis fugiat voluptates! Quam.</p>
</div>
<div>
</div>
<div>
<h3>Site Links</h3>
<ul class="list">
<li><a href="#">Help & Suport</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>
</div>
<div>
<p>Coded by © Marc </p>
</div>
</div>
</footer>
</body>
</html>