Skip to content

Commit

Permalink
finshed Cart, Added profile page
Browse files Browse the repository at this point in the history
  • Loading branch information
@Mostafa-Usama
Mostafa-Usama committed Jan 12, 2024
1 parent 08b431d commit 90295b0
Show file tree
Hide file tree
Showing 12 changed files with 654 additions and 121 deletions.
95 changes: 82 additions & 13 deletions cartItems.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Register</title>
<title>Cart</title>
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/all.min.css">
<link rel="stylesheet" href="css/register.css">
Expand All @@ -23,28 +23,29 @@
</nav>
</header>

<div class="container mt-3 rounded p-4">
<h1 class="text-center fw-bold py-2 position-relative " style="width: fit-content; margin: auto;" >Shopping Cart</h1>
<div class="container my-5 ">


<style>
h1::before{
.title::before{
content: "";
position: absolute;
width: 75%;
width: 60%;
height: 3px;
bottom: -5px;
left: 50%;
transform: translateX(-50%);
background-color: var(--primary);

}
</style>
<div class="row mt-5 gy-5">
</style>

<div class="row gy-5">
<div id="productsContainer" class="col-lg-8 p-3 rounded border shadow bg-white">



</div>
<div class="col-lg-4 p-0 ps-lg-4">

<div class="bg bg-white p-3 shadow rounded">
<label class="text-center d-block fw-bold opacity-75 py-2" for="promoCode">ENTER PROMO CODE</label>
<div class=" d-flex flex-column ">
Expand All @@ -66,16 +67,84 @@ <h1 class="text-center fw-bold py-2 position-relative " style="width: fit-conten
</div>
<div class="fw-bold fs-4 d-flex justify-content-between">
<p>Total</p>
<p>$500</p>
<p id="total">$500</p>
</div>
<button class="btn mb-1 rounded-0 fw-bold bg-black border-2 text-white border-black ">Proceed To Checkout</button>
<button class="btn mb-1 rounded-0 fw-bold border-black border-2 bg-white text-black ">Continue Shopping</button>
<button class="btn mb-1 rounded-0 fw-bold bg-black border-2 text-white border-black ">Proceed To Checkout <i class="fas fa-shopping-bag fs-5 fa-fw"></i></button>
<button onclick="loadHome()" class="btn mb-1 rounded-0 fw-bold border-black border-2 bg-white text-black ">Continue Shopping </button>
</div>
</div>
</div>
</div>
</div>


<footer>
<div class="bg-black py-5">
<div class="container-lg">
<div class="row text-white gy-5">
<div class="col-lg-3 col-md-6 ">
<h3 class="fw-bold foot-title position-relative fs-1 " style="width: fit-content;">Selling </h3>
<p class="pt-2 opacity-75">Lorem ipsum dolor sit amet consectetur adipisicing elit. Neque facere
laudantium magnam voluptatum autem. Amet aliquid
nesciunt veritatis aliquam.</p>
<i style="padding: 10px 11px; font-size: 15px; background-color: var(--primary);"
class=" icon rounded-circle fab fa-facebook-f"></i>
<i class="p-2 icon rounded-circle fab fa-twitter" style="background-color: var(--primary);"></i>
<i class="p-2 icon rounded-circle fab fa-google" style="background-color: var(--primary);"></i>
<i class="p-2 icon rounded-circle fab fa-instagram"
style="font-size: 17px; background-color: var(--primary);"></i>
</div>
<div class="col-lg-2 col-6 ">
<h4 class="fw-bold">Offers</h4>
<p class="text opacity-75 pt-4" style="font-size: 15px;"><i
class="fas fa-angle-right fa-fw fs-5"></i> Proberties</p>
<p class="text opacity-75" style="font-size: 15px;"><i class="fas fa-angle-right fa-fw fs-5"></i>
Agents</p>
<p class="text opacity-75" style="font-size: 15px;"><i class="fas fa-angle-right fa-fw fs-5"></i>
Locations</p>
<p class="text opacity-75" style="font-size: 15px;"><i class="fas fa-angle-right fa-fw fs-5"></i>
Clients Support</p>
</div>
<div class="col-lg-2 col-6 ">
<h4 class="fw-bold">Company</h4>
<p class="text opacity-75 pt-4" style="font-size: 15px;"><i
class="fas fa-angle-right fa-fw fs-5"></i> Company</p>
<p class="text opacity-75" style="font-size: 15px;"><i class="fas fa-angle-right fa-fw fs-5"></i>
About</p>
<p class="text opacity-75" style="font-size: 15px;"><i class="fas fa-angle-right fa-fw fs-5"></i>
Blog</p>
<p class="text opacity-75" style="font-size: 15px;"><i class="fas fa-angle-right fa-fw fs-5"></i>
Contact Us</p>
</div>
<div class="col-lg-2 col-6 ">
<h4 class="fw-bold">Quick Links</h4>
<p class="text opacity-75 pt-4" style="font-size: 14px;"><i
class="fas fa-angle-right fa-fw fs-5"></i> Terms & Condations</p>
<p class="text opacity-75" style="font-size: 15px;"><i class="fas fa-angle-right fa-fw fs-5"></i>
User's Guide</p>
<p class="text opacity-75" style="font-size: 15px;"><i class="fas fa-angle-right fa-fw fs-5"></i>
Support Center</p>
<p class="text opacity-75" style="font-size: 15px;"><i class="fas fa-angle-right fa-fw fs-5"></i>
Press Info</p>
</div>
<div class="col-lg-3 col-6 ">
<h4 class="fw-bold">Have a Question?</h4>
<div class="d-flex gap-3 pt-4 ">
<i class="fas fa-map" style="color: var(--primary);"></i>
<p class="opacity-75 "> 203 Fake St. Mountain View, San Francisco, California, USA</p>
</div>
<div class="d-flex gap-3 ">
<i class="fas fa-phone-alt fa-fw" style="color: var(--primary);"></i>
<p class="opacity-75"> +2 392 3929 210</p>
</div>
<div class="d-flex gap-3 ">
<i class="fas fa-envelope fa-fw" style="color: var(--primary);"></i>
<p class="opacity-75"> [email protected]</p>
</div>
</div>
</div>
</div>
</div>
</footer>
<script src="js/cart.js"></script>
</body>

Expand Down
11 changes: 10 additions & 1 deletion css/register.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -57,7 +57,8 @@ textarea {
color: var(--primary) !important
}

.navbar-brand::after{
.navbar-brand::after,
.foot-title::after{
position: absolute;
content: ".";
width: 20px;
Expand All @@ -84,4 +85,12 @@ textarea {
.btn4:hover {
color: white !important;
background-color: black !important;
}
.favBtn {
transition: .3s;
cursor: pointer;
top: 0px;
right: 0px;
background-color: rgb(230, 230, 230);
color: red
}
Loading

0 comments on commit 90295b0

Please sign in to comment.