smriti-github.io/About Us.html at main · Smriti-debug/smriti-github.io · 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
110
111
112
113
114
115
116
117
118
<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title> Coffee Shop </title>
        <link rel="stylesheet" href="style.css">
        <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
        <link rel="preconnect" href="https://fonts.googleapis.com">
        <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
        <link href="https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap" rel="stylesheet">
        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.6.0/css/all.min.css">
        </head>
        <body style="background-color:whitesmoke;">
            <div class="all-content">
                <nav class="navbar navbar-expand-lg" id="navbar">
                    <div class="container-fluid">
                      <a class="navbar-brand" href="#" id="logo img"> <img src="coffee.png" alt="" width="150" height="150"></a>
                      <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
                        <span><i class="fa-solid fa-bars" style="color:white; font-size: 50px;"></i></span>
                      </button>
                      <div class="collapse navbar-collapse" id="navbarSupportedContent">
                        <ul class="navbar-nav me-auto mb-2 mb-lg-0">
                          <li class="nav-item">
                            <a class="nav-link active" aria-current="page" href="#">Home</a>
                          </li>
                          <li class="nav-item">
                            <a class="nav-link" href="About Us.html">About</a>
                          </li>
                          <li class="nav-item">
                            <a class="nav-link" href="Menu.html">Menu</a>
                          </li>
                          <li class="nav-item">
                            <a class="nav-link" href="Product.html">Product</a>
                          </li>
                          <li class="nav-item">
                            <a class="nav-link" href="Gallery.html">Gallery</a>
                          </li>
                          <li class="nav-item">
                            <a class="nav-link" href="Contact Us.html">Contact</a>
                          </li>
                        </ul>
                        <form class="d-flex">
                          <input class="form-control me-2" type="search" placeholder="Search" aria-label="Search">
                          <button class="btn btn-outline-success" type="submit">Search</button>
                        </form>
                      </div>
                    </div>
                  </nav>
<section id="about">
    <div class="container">
    <div class="heading">About <span>Us</span></div>
    <div class="row">
        <div class="col-md-6">
        <div class="card">
            <img src="image a.jpg" alt="">
            </div>
        </div>
        <div class="col-md-6">
            <h3>What Makes Our Coffee Special?</h3>
            <p>Our coffee is perfection in itself as it provides exceptional quality from bean to cup, handcrafted roasting for perfect flavor, responsibly sourced and ethically crafted. "A Flavor profile you'll fall in love with" that freshens your taste at every sip. It is crafted with passion and precision, a beautiful coffee for every occasion.<br>
            <br>“From the lush hills of Colombia to your cup – a journey of flavor.”<br> <br> A rich symphony of dark chocolate, caramel, and citrus crafted for those who seek more than just a cup. We promote organic, ethically sourced and environmentally friendly aspects. We provide a perfect place where you enjoy the sip of coffee to the consent of environment.<br>
            So, please serve yourself with an absolutely perfect coffee.
            </p>
            <button id="about-btn">Learn More.....</button>
        </div>
    </div>
</div>
</section>

<section id="top-cards">
    <div class="heading2">Top <span>Categories</span></div>
    <div class="container">
    <div class="row">

        <div class="col-md-4 py-3 py-md-0">
            <div class="card">
                <img src="hi.webp" alt="">
            </div>
          </div>

        <div class="col-md-4 py-3 py-md-0">
            <div class="card">
                <img src="smriti1.webp" alt="">
            </div>
          </div>

            <div class="col-md-4 py-3 py-md-0">
                <div class="card">
                    <img src="nono.jpg" alt="">
                </div>
            </div>


    </div>
    </div>
</section>
<footer id="footer">
    <div class="footer-logo text-center"><img src="image.png" alt=""></div>
    <div class="social-links text-center">
      <i class="fa-brands fa-twitter"></i>
      <i class="fa-brands fa-facebook-f"></i>
      <i class="fa-brands fa-instagram"></i>
      <i class="fa-brands fa-pinterest-p"></i>
    </div>
  <div class="copyright text-center">
    Designed By <a href="#"><span>Smriti Sapkota </span></a>
  </div>

  <div class="credits text-center">
    &copy; Copyright <strong> <span>Coffee Shop</span></strong>. All Rights Reserved.
  </div>
</footer>
  <a href="#" class="arrow"><i> <img src="arrow.jpg" alt="" width="50px"></i></a>
          </div>
</body>
</html>