NewsGrid/article.html at master · Stav93/NewsGrid · GitHub

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
107
108
109
<!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.6.3/css/all.css" integrity="sha384-UHRtZLI+pbxtHCWp1t77Bi1L4ZtiqrqD80Kn4Z8NTSRyMA2Fd33n5dQ8lWUE00s/" 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>
  <!-- NavBar -->
  <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">Lorem ipsum dolor sit amet.</h1>
          <div class="meta">
            <small>
              <i class="fas fa-user"></i> Written By John Doe
              January 12, 2019
            </small>
            <div class="category category-ent">Entertaiment</div>
          </div>
          <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Delectus pariatur corporis eum enim esse vel sint est perspiciatis porro facere non sit aspernatur illum molestiae voluptate amet rem dolores ullam ab illo dolorem, recusandae consequuntur incidunt. Harum inventore architecto dolores officiis et minus nesciunt maxime debitis consequatur sed! Voluptatum, iste.</p>
          <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Veritatis quam soluta dolore laudantium nam? Praesentium tenetur minima laudantium a nihil maxime incidunt, quo, eius aperiam facilis amet nesciunt nobis? Non accusamus explicabo incidunt nulla asperiores officiis neque illo reiciendis, commodi ea aliquam amet, fuga dolores distinctio odio assumenda provident harum adipisci veniam suscipit eos est culpa quisquam! Quae tempora nobis perspiciatis quaerat cumque illum doloribus unde dolorem nemo accusamus aliquid molestiae assumenda harum, quis veritatis qui temporibus ut explicabo? Atque accusantium vero commodi officia tempore nisi culpa. Eligendi dolorem repellat voluptates vitae deleniti quasi provident dignissimos et, placeat magni illo amet corrupti odio! Eos libero, ullam voluptates repellat officiis voluptas totam soluta facilis alias itaque, ipsam neque necessitatibus nulla reprehenderit amet reiciendis pariatur sequi a. Eius maxime voluptatem excepturi consectetur. Fuga eaque veniam culpa? Quae odit facere amet assumenda. Nobis recusandae harum repudiandae error voluptatibus veritatis beatae ad neque amet.</p>
        </article>

        <aside id="category" 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> Fasion</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. Quos, veniam.</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="">
        <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolore dicta tempore culpa quas perferendis ea magni, sit eius placeat quos.</p>
      </div>
      <div>
        <h3>Email Newsletter</h3>
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</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>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Sed, ratione?</p>
        <a href="#" class="btn btn-secondary">Join Now</a>
      </div>
      <div>
        <p>
          Copyright &copy; 2022, all rights reserved
        </p>
      </div>
    </div>
  </footer>

</body>
</html>