Adore-Candles-E-commerce-website/index.html at main · azeenGAN/Adore-Candles-E-commerce-website · 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
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Adore Candles</title>
    <link rel="icon" type="image/x-icon" href="Images/favicon.jpg">
    <link rel="stylesheet" href="adjust.css">
    <link rel="stylesheet" href="css/templatemo.css">
    <link rel="stylesheet" href="css/bootstrap.min.css">

    <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=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;1,200&display=swap"
    rel="stylesheet">

    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css"
    rel="stylesheet" integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN"
    crossorigin="anonymous">
    <link href='https://unpkg.com/boxicons@2.1.4/css/boxicons.min.css' rel='stylesheet'>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">

</head>

<body>
  <nav class="navbar navbar-expand-lg bg-dark navbar-light d-none d-lg-block " id="templatemo_nav_top">
    <div class="container text-light">
        <div class="w-100 d-flex justify-content-between">
            <div>
              <i style="margin-right: 5px; color:rgb(248, 249, 250)" class='bx bxs-envelope' ></i>
                <a class="navbar-sm-brand text-light text-decoration-none" href="mailto:adorepk@gmail.com">adorepk@gmail.com</a>
                <i style="margin-right: 5px; color:rgb(248, 249, 250)"  class='bx bxs-phone'></i>
                <a class="navbar-sm-brand text-light text-decoration-none" href="tel:0317-7373218">0317-7373218</a>
            </div>
            <div id="lmao">
                <a class="text-light" href="https://fb.com/templatemo" target="_blank" rel="sponsored"><i style="font-size: 16px; color:rgb(209, 206, 206)"class='bx bxl-facebook'></i></a>
                <a class="text-light" href="https://www.instagram.com/adorecandles.pk/?hl=en" target="_blank"><i style="color:rgb(209, 206, 206)" class='bx bxl-instagram'></i></a>
                <a class="text-light" href="https://twitter.com/" target="_blank"><i style="color:rgb(209, 206, 206)"  class='bx bxl-twitter'></i></a>
                <a class="text-light" href="https://www.linkedin.com/" target="_blank"><i style="color:rgb(209, 206, 206)" class='bx bxl-gmail' ></i></a>
            </div>
        </div>
    </div>
</nav>
 <!-- Header -->
 <nav  class="navbar navbar-expand-lg navbar-light shadow ">
  <div class="container d-flex justify-content-between align-items-center">

      <a class="navbar-brand text-secondary logo h1 align-self-center" href="index.html">
          Adore
      </a>

      <button class="navbar-toggler border-0" type="button" data-bs-toggle="collapse" data-bs-target="#templatemo_main_nav" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
          <span class="navbar-toggler-icon"></span>
      </button>

      <div class="align-self-center collapse navbar-collapse flex-fill  d-lg-flex justify-content-lg-between" id="templatemo_main_nav">
          <div class="flex-fill">
              <ul class="nav navbar-nav d-flex justify-content-between mx-lg-auto">
                  <li class="nav-item">
                      <a class="nav-link" href="index.html">Home</a>
                  </li>
                  <li class="nav-item">
                      <a class="nav-link" href="story.html">Our story</a>
                  </li>
                  <li class="nav-item">
                      <a class="nav-link" href="shop.html">Shop</a>
                  </li>
                  <li class="nav-item">
                      <a class="nav-link" href="saleitem.html">Sale items</a>
                  </li>
              </ul>
          </div>
          <div class="navbar align-self-center d-flex">
              <div class="d-lg-none flex-sm-fill mt-3 mb-4 col-7 col-sm-auto pr-3">
                  <div class="input-group">
                      <input type="text" class="form-control" id="inputMobileSearch" placeholder="Search ...">
                      <div class="input-group-text">
                          <i class="fa fa-fw fa-search"></i>
                      </div>
                  </div>
              </div>
              <a class="nav-icon d-none d-lg-inline" href="#" data-bs-toggle="modal" data-bs-target="#templatemo_search">
                  <i class='bx bx-search'></i>
              </a>
              <a class="nav-icon position-relative text-decoration-none" href="#">
                <i class='bx bx-shopping-bag' ></i>
                  <span class="position-absolute top-0 left-100 translate-middle badge rounded-pill bg-light text-dark">0</span>
              </a>

          </div>
      </div>

  </div>
</nav>
    <div class="main">
      <!-- <div class="navbar"></div> -->
        <div id="carouselExampleFade" class="carousel slide carousel-fade">
            <div class="carousel-inner">
              <div class="carousel-item active">
                <img src="Images/corosel1 (1).jpg" class="d-block  alt="...">
              </div>
              <div class="carousel-item">
                <img src="Images/corosel2.jpg" class="d-block " alt="...">
              </div>
              <div class="carousel-item">
                <img src="Images/corosel3.jpg" class="d-block " alt="...">
              </div>
              <div class="carousel-item">
                <img src="Images/corosel4.jpg" class="d-block " alt="...">
              </div>
            </div>
            <button class="carousel-control-prev" color="primary" type="button" data-bs-target="#carouselExampleFade" data-bs-slide="prev">
              <span class="carousel-control-prev-icon" ></span>
              <span class="visually-hidden">Previous</span>
            </button>
            <button class="carousel-control-next" type="button" data-bs-target="#carouselExampleFade" data-bs-slide="next">
              <span class="carousel-control-next-icon" aria-hidden="true"></span>
              <span class="visually-hidden">Next</span>
            </button>
          </div>
        </div>
          <div class="middle">
            <div class="container">
            <img src="Images/cardimg5.jpg">
        </div>
            <p><i>
                "Our candles feature a premium blend of Coconut-Apricot wax and natural cotton wicks.
                 Crafted from a vegan combination of natural coconut and apricot, our luxurious wax boasts a smooth,
                 creamy white appearance. It is not only eco-friendly but also enhances the fragrance experience with an
                 excellent throw. The candles exhibit an even
                 burn and efficient wax consumption.

                 Our wax is not only <strong>gluten-free</strong> but also free from toxins, parabens and <br>phthalates,
                 sourced from renewable and sustainable materials".
                 </i></p>
                </div>
        <div class="container1">
            <p class="large123 " id="dd"> <i >Why you should buy ?</i></p>
            <div class="discription">
                <ul>
                    <li id="dd">
                        <h3>Cost-Effective </h3><p> Making candles at home can be cost-effective in the long run, as you can purchase ingredients in bulk and create multiple candles from a single batch. This can save money compared to buying premium candles from stores.</p>
                    </li>

                    <li id="dd">
                        <h3>create Outlet </h3><p>Candle making is a creative and rewarding hobby. It allows individuals to express their artistic side by experimenting with different colors, scents, and container options.</p>
                    </li>

                    <li id="dd">
                        <h3>Avoid Toxins </h3><p> Some commercially available candles may contain additives or fragrances that release toxins when burned. By making your own candles, you have the option to use natural fragrances and avoid potentially harmful substances.</p>
                    </li>

                    <li id="dd">
                        <h3>Reduce Waste </h3><p>  Making candles at home allows you to reuse and recycle materials. You can repurpose old containers or use materials that are more easily recyclable, contributing to a reduction in waste.</p>
                    </li >
                </ul>
            </div>
            <h1 class="noname"><i>Our best sellers</i></h1>
            <div class="card-group  dil">
              <div class="card col-12 dill">
                <img src="Images/cardimg.jpg" class="card-img-top" alt="...">
                <div class="card-body">
                  <h5 class="card-title">Cutest Teddy Gift</h5>
                  <p class="card-text dilll">Nothing looks more promising than ADORE candles when it comes to home decor. Our candles can make your space more aesthetic and appealing with their pretty colours.</p>
                  <p class="card-text"><small class="text-body-secondary">Last updated 3 mins ago</small></p>
                </div>
              </div>
              <div style="border-left: 0.8px solid rgba(0, 0, 0, 0.176)" class="card col-12 dill">
                <img src="Images/cardim2.jpg" class="card-img-top" alt="...">
                <div class="card-body">
                  <h5 class="card-title">Ombre Bubble Candles</h5>
                  <p class="card-text dilll">These cute and stunning ombre bubble candles are the treat to our sore eyes 🫧 These will be launched tomorrow. Stay tuned to get your hands on these as soon as possible.</p>
                  <p class="card-text"><small class="text-body-secondary">Last updated 3 mins ago</small></p>
                </div>
              </div>
              <div style="border-left: 0.8px solid rgba(0, 0, 0, 0.176)" class="card col-12 dill">
                <img src="Images/cardim3.jpg" class="card-img-top" alt="...">
                <div id="uuu" class="card-body">
                  <h5 class="card-title">Cute spookies</h5>
                  <p class="card-text dilll">Discover our enchanting collection of spooky and cute candles that add a touch of magic to any space. our candles are crafted to illuminate your surroundings with charm and a hint of mystery.</p>
                  <p class="card-text"><small class="text-body-secondary">Last updated 3 mins ago</small></p>
                </div>
              </div>
            </div>

              <h1 id="ddd" class="hasname" ><i><b>Want</b> party favors? Wedding favors? Return gifts? <br>we've got you!!!</i></h1>
              <div class="bulk">
                <img src="Images/7.jpg">
                <p><i>
                  Now taking bulk orders for mini bubble candles to make your events special.
                  Colours, scent, and packaging can be customized.<strong>To place order in bulk</strong> you can select
                  the quantity in your cart, or if not you can approach us through <a target="_blank" style="text-decoration: underline;  color: rgb(88, 0, 88);" href="https://www.instagram.com/adorecandles.pk/?hl=en" ><b>instagram</b></a>.
                </i></p>
            </div>
            </div>

    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-C6RzsynM9kWDrMNeT87bh95OGNyZPhcTNXj1NW7RuBCsyN/o0jlpcV8Qyq46cDfL" crossorigin="anonymous"></script>
        <script src="power.js"></script>
</body>
<div id="footer"></div>
</html>