tech2etc · sadamali-oc · Aug 26, 2024 · Aug 27, 2024 · Aug 27, 2024 · Aug 27, 2024
diff --git a/README.md b/README.md
@@ -1,33 +1 @@
-# Build-and-Deploy-Ecommerce-Website-With-HTML-CSS-JavaScript
 
-[<img alt="Build-and-Deploy-Ecommerce-Website-With-HTML-CSS-JavaScript" width="100%" src="https://github.com/tech2etc/Youtube-Tutorials/blob/main/Build%20and%20Deploy%20Ecommerce%20Website%20With%20HTML%20CSS%20JavaScript%20Full%20Responsive%20Ecommerce%20Course%20FREE.PNG?raw=true" />](https://youtu.be/P8YuWEkTeuE/)
-
-## About this course
-LEARN HOW TO BUILD AND DEPLOY FULL RESPONSIVE ECOMMERCE WEBSITE USING HTML CSS & JAVASCRIPT. This is a free HTML CSS Course. And in this course we will learn how to build and deploy a full multipage ecommerce website completely from scratch step by step. Will Create from responsive navbar using html CSS JavaScript to responsive footer in one video.
-
-## Why This Course?
-- Responsive Ecommerce Website Tutorial Using HTML CSS & JavaScript.
-- Completely For Beginners.
-- Multipage Ecommerce Website Project.
-- Best Beginner Friendly Free Course On YouTube.
-- Learn How to build amazing professional and responsive websites.
-- Learn the fundamentals of web design.
-- Modern CSS, including flexbox and CSS Grid for layout.
-- Modern CSS techniques to create stunning designs and effects.
-- How to use common components and layout patterns for professional website design and development.
-- Advanced responsive design using media queries.
-- And Many More.
-
-## Sections
-- Part1: Responsive Home Page Design.
-- Part2: Shop Page & Single Product Page.
-- Part3: Blog Page.
-- Part4: About Page.
-- Part5: Contact Us.
-- Part6: Ecommerce Shopping Cart.
-
-Here you will find all the images I'm using to create this responsive ecommerce website. In future image folder can update.
-
-Get the full source code from [here1](https://www.buymeacoffee.com/tech2etc/e/50932).
-
-Get the full source code from [here2](https://ko-fi.com/s/06e4db9e09).
diff --git a/about.html b/about.html
@@ -1,19 +1,202 @@
 <!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>TShopping Web site</title>
+    <link
+      rel="stylesheet"
+      href="https://pro.fontawesome.com/releases/v5.10.0/css/all.css"
+    />
 
-    <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>Tech2etc Ecommerce Tutorial</title>
-        <link rel="stylesheet" href="https://pro.fontawesome.com/releases/v5.10.0/css/all.css" />
+    <link rel="stylesheet" href="style.css" />
+  </head>
 
-        <link rel="stylesheet" href="style.css">
-    </head>
+  <body>
+    <section id="header">
+      <a href="#">
+        <img src="img/logo.png" class="logo" alt="" />
+      </a>
 
-    <body>
+      <div>
+        <ul id="navbar">
+          <li><a href="index.html">Home</a></li>
+          <li><a href="shop.html">Shop</a></li>
 
-        <script src="script.js"></script>
-    </body>
+          <li><a href="blog.html">Blog</a></li>
 
-</html>
+          <li><a class="active" href="about.html">About</a></li>
+
+          <li><a href="contact.html">Contact</a></li>
+
+          <li id="lg-bag">
+            <a href="cart.html"><i class="far fa-shopping-bag"></i></a>
+          </li>
+
+          <a href="#" id="close"><i class="far fa-times"></i></a>
+        </ul>
+      </div>
+
+      <div id="mobile">
+        <a href="cart.html"><i class="far fa-shopping-bag"></i></a>
+        <i id="bar" class="fas fa-outdent"></i>
+      </div>
+    </section>
+
+    <section id="page-header" class="about-header">
+      <h2>#KnowsUs</h2>
+      <p>
+        Available in a range of colors, these cotton zip-up hoodies are a go-to
+        for lounging at home, running errands, or pairing with your
+      </p>
+    </section>
+
+    <section id="about-head" class="section-p1">
+      <img src="img/about/a6.jpg" alt="" />
+      <div>
+        <h2>Who We Are?</h2>
+
+        <p>
+          Lorem ipsum dolor, sit amet consectetur adipisicing elit. In, quidem
+          autem fugit, corporis nemo a maiores aspernatur ipsum praesentium
+          neque saepe eaque impedit libero temporibus consequuntur, accusamus
+          totam dolorum perspiciatis. Lorem ipsum dolor sit amet consectetur,
+          adipisicing elit. Voluptas tenetur nostrum officia minima, nemo
+          cupiditate explicabo corporis repudiandae ab facilis praesentium
+          architecto illo magni corrupti iusto ratione, laudantium ipsum
+          expedita?
+        </p>
+
+        <abbr title="">
+          Create stunning images with as much or as title contro as you like
+          thanks to a choice of Basic and Creative modes.
+        </abbr>
+
+        <br />
+        <br />
+
+        <marquee bgcolor="#ccc" loop="-1" scrollamount="5" width="100%">
+          Create stunning images with as much or as title contro as you like
+          thanks to a choice of Basic and Creative modes
+        </marquee>
+      </div>
+    </section>
+
+
+    <section id="about-app" class="section-p1">
+
+        <h1>Download Our <a href="#" >App</a></h1>
+        <div class="video">
+            <video autoplay muted loop src="img/about/1.mp4"></video>
+        </div>
+    </section>
+
+    <section id="feature" class="section-p1">
+        <div class="fe-box">
+          <img src="img/features/f1.png" alt="" />
+          <h6>Free Shipping</h6>
+        </div>
+        <div class="fe-box">
+          <img src="img/features/f2.png" alt="" />
+          <h6>Online Order</h6>
+        </div>
+        <div class="fe-box">
+          <img src="img/features/f3.png" alt="" />
+          <h6>Save Money</h6>
+        </div>
+        <div class="fe-box">
+          <img src="img/features/f4.png" alt="" />
+          <h6>Promotions</h6>
+        </div>
+        <div class="fe-box">
+          <img src="img/features/f5.png" alt="" />
+          <h6>Happy Sell</h6>
+        </div>
+        <div class="fe-box">
+          <img src="img/features/f6.png" alt="" />
+          <h6>Support</h6>
+        </div>
+      </section>
+
+
+
+      <section id="newsletter" class="section-p1 section-m1">
+        <div class="newstext">
+          <h4>Sign Up For Newsletters</h4>
+          <p>
+            Get E-mail updates about our latest shop and
+            <span>special offers</span>
+          </p>
+        </div>
+
+        <div class="form">
+          <input type="text" placeholder="Your email address" />
+          <button class="normal">Sign Up</button>
+        </div>
+      </section>
+
+
+    <footer class="section-p1">
+      <div class="col">
+        <img class="logo" src="img/logo.png" alt="" />
+        <h4>Contact</h4>
+        <p><strong>Adddress:</strong>95/1,Moratuwa,Galle Road,Srilanka</p>
+        <p><strong>Phone:</strong>+94 234 345 567/+94 234 345 537</p>
+        <p><strong>Hours:</strong>10:00 - 18:00, Mon -Sat</p>
+        <div class="follow">
+          <h4>Follow us</h4>
+          <div class="icon">
+            <i class="fab fa-facebook-f"></i>
+            <i class="fab fa-twitter"></i>
+
+            <i class="fab fa-instagram"></i>
+
+            <i class="fab fa-pinterest-p"></i>
+            <i class="fab fa-youtube"></i>
+          </div>
+        </div>
+      </div>
+
+      <div class="col">
+        <h4>About</h4>
+        <a href="#">About us</a>
+        <a href="#">Delivery Information</a>
+
+        <a href="#">Privacy Policy</a>
+
+        <a href="#">Terms & Conditions</a>
+
+        <a href="#">Contact us</a>
+      </div>
+
+      <div class="col">
+        <h4>My Account</h4>
+        <a href="#">Sign In</a>
+        <a href="#">View Cart</a>
+
+        <a href="#">My Wishlist</a>
+
+        <a href="#">Trach My Order</a>
+
+        <a href="#">Help</a>
+
+        <div class="col install">
+          <h4>Install App store or Google Play</h4>
+          <div class="row">
+            <img src="img/pay/app.jpg" alt="" />
+            <img src="img/pay/play.jpg" alt="" />
+          </div>
+
+          <p>Secured Payment</p>
+          <img src="img/pay//pay.png" alt="" />
+        </div>
+        <div class="copy-right">
+          <p>© 2024, Shop-all right reserved</p>
+        </div>
+      </div>
+    </footer>
+
+    <script src="script.js"></script>
+  </body>
+</html>