added a footer

shopping/cart.php

@@ -36,25 +36,25 @@
             
 
             <div class="row">
-                <div class="col-sm-12">
+                <div class="col-sm-12" id="shopping_cartTitle">
-                    <h1> Shopping Cart </h1>
+                    <h1>Total</h1> <h1>CA$111</h1>
-                    <p>| ·  · |</p>
+
                 </div>
             </div>
 
             <div class="row">
-                <div class="col-sm-12">
+                <div class="col-sm-12" id="shopping_cart">
-                    <form action="shopping.php" method="get">
+                    <form action="userInfo.php" method="get">
-                        <table style="margin:auto; border: 2px solid black;">
+                        <table class="cartTable">
                             <thead>
-                                <tr style="margin:auto; border: 2px solid black;">
+                                <!-- <tr style="margin:auto; border: 2px solid black;">
                                     <td>Product</td>
 
                                     <td>Quantity</td>
 
                                     <td>Price</td>
 
-                                </tr>
+                                </tr> -->
                             </thead>
                             <tbody>
 
@@ -63,20 +63,21 @@
 
                                 <?php foreach ($_SESSION['mycar'] as $product): ?>
                                 <tr>
-                                    <td>
+                                    <td class="cart_quantity">
-                                        <?=$product['buy_name']?>
+                                        <h3> <?=$product['buy_num']?> </h3>
-                                    </td>
-
-                                    <td class="quantity">
-                                        <?=$product['buy_num']?>
 
                                     </td>
-                                    
                                     <td>
-                                        &dollar;<?=$product['buy_price']?>
+                                        <span> <?=$product['buy_name']?> </span>
                                     </td>
 
-                                    <td>
+                                    
+                                    
+                                    <td class="cart_priceP">
+                                        <span> &dollar;<?=$product['buy_price']?> </span>
+                                    </td>
+
+                                    <td class="cart_deleteP">
                                         <a href="cart_delProduct.php?id=<?php echo $product['buy_id'];?>">Delete</a></td>
                                     </td>
 
@@ -92,8 +93,8 @@
                         </div>
 
                         <br>
-                        <div class="buttons">
+                        <div class="">
-                            <input type="submit" value="Go Back To shopping!" name="placeorder">
+                            <input type="submit" value="Go To Checkout" name="placeorder">
                         </div>
                         
                         <?php $products = getProducts($_SERVER["QUERY_STRING"],$conn); ?>

shopping/footer.php

@@ -0,0 +1,36 @@
+<footer class="shopping-footer">
+    <div class="row">
+        <div class="col-sm-12 col-lg-6 col-xl-3">
+            <h1>Company</h1>
+            <ul>
+                <li>About</li>
+                <li>Blogs</li>
+                <li>Careers </li>
+            </ul>
+        </div>
+        <div class="col-sm-12 col-lg-6 col-xl-3">
+            <h1>Company</h1>
+            <ul>
+                <li>About</li>
+                <li>Blogs</li>
+                <li>Careers </li>
+            </ul>
+        </div>
+        <div class="col-sm-12 col-lg-6 col-xl-3">
+            <h1>Company</h1>
+            <ul>
+                <li>About</li>
+                <li>Blogs</li>
+                <li>Careers </li>
+            </ul>
+        </div>
+        <div class="col-sm-12 col-lg-6 col-xl-3">
+            <h1>Company</h1>
+            <ul>
+                <li>About</li>
+                <li>Blogs</li>
+                <li>Careers </li>
+            </ul>
+        </div>
+    </div>
+</footer>

shopping/shopping.php

@@ -94,6 +94,8 @@
 
   </div>
 
+  <?php include_once 'footer.php'?>
+
 </body>
 
 </html>

shopping/shopping_headerNav.php

@@ -1,6 +1,6 @@
 <div class="shopping_headerNav">
     <div class="col-xl-12" id="shopping_headerImg">
-        <span id="span-shopping-username" > Username <?php echo $_SESSION['username']; ?></span>
+        <span id="span-shopping-username" ><i class="fas fa-user-circle"></i> Username <?php echo $_SESSION['username']; ?></span>
         <form action="../php/logout.php" method="post">
             <button class="btn btn-lg my-btn" type="submit" id="btn-shopping-logout"> LOGOUT</button>
         </form>

shopping/userInfo.php

@@ -0,0 +1,57 @@
+<!doctype html>
+<html lang="en">
+  <?php
+  require_once '../php/connection.php';
+  $conn = connectMysql();
+  session_start();
+  ?>
+  <head>
+    <!-- Required meta tags -->
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+
+    <!-- Bootstrap CSS -->
+    <link href="../bootstrap-5.0.1-dist/css/bootstrap-grid.min.css" rel="stylesheet">
+    <link href="../bootstrap-5.0.1-dist/css/bootstrap.min.css" rel="stylesheet">
+
+    <!--=== Main Style CSS ===-->
+    <link href="../style/style.css" rel="stylesheet">
+
+    <!-- Font Awesome styles CDN Link -->
+    <link
+      href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"
+      rel="stylesheet"
+      integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN"
+      crossorigin="anonymous"
+    />
+    <title>New Moon Dessert Bar</title>
+  </head>
+
+<body class="shopping_body">
+
+    <div class="container-fluid">
+
+        <div class="sectionShopping">
+            <?php include 'shopping_headerNav.php' ?>
+            
+
+            <div class="row">
+                <div class="col-sm-12" id="">
+                    <h1>My billing address</h1>
+
+                </div>
+            </div>
+
+            <div class="row">
+                <div class="col-sm-12" id="shopping_cart">
+
+                </div>
+            </div>
+            
+        </div>
+
+    <?php include '../footer.html' ?>
+    </div>
+</body>
+
+</html>

style/layouts/_footer.sass

@@ -6,3 +6,26 @@
 	background-color: grey
 	p
 		margin: auto
+
+.shopping-footer
+	background-color: grey
+	padding-left: 10%
+	h1
+		color: #fff
+		font-size: 35px
+	ul
+		list-style: none
+		text-align: left
+		padding-left: 0
+		li
+			color: #fff
+			font-size: 22px
+			line-height: 1.5
+
+@media (max-width:974px)
+	.shopping-footer
+		padding: 0
+		h1
+			text-align: center
+		ul
+			text-align: center

style/modules/_button.sass

@@ -12,6 +12,10 @@
     background-color: $button-background-color-hover
     color: $button-color-hover
 
+#btn-home-login:before
+    font-family: 'FontAwesome'
+    content: '\f2be'
+
 .my-floating-btn
     display: none
     a

style/modules/_sectionMain.sass

@@ -14,9 +14,3 @@
         font-size: 1.2rem
 
         
-
-
-
-#btn-home-login:before
-    font-family: 'FontAwesome'
-    content: '\f2be'

style/modules/shopping/_cart.sass

@@ -0,0 +1,31 @@
+.sectionShopping
+
+    #shopping_cartTitle, .cartTable
+        width: 100%
+        height: 100%
+        text-align: justify
+        border-bottom: 1px solid grey
+
+    
+    #shopping_cartTitle:after, .cartTable:after
+        content: ""
+        display: inline-block
+        overflow: hidden
+        width: 100%
+
+    #shopping_cartTitle h1, .cartTable span
+        display: inline-block
+
+    #shopping_cart
+        margin-top: 5%
+
+        .cartTable
+            margin: auto
+
+        .cart_priceP
+            text-align: right
+            
+        .cart_deleteP
+            text-align: right
+    
+        

style/modules/shopping/_navbar_shopping.sass

@@ -6,7 +6,7 @@
 
     .shopping_headerNav #span-shopping-username 
         position: absolute
-        font-size: 2rem
+        font-size: 1.5rem
         left: 1rem
         top: 1rem
         color: white
@@ -15,3 +15,7 @@
         position: absolute
         right: 1rem
         top: 1rem
+
+#span-shopping-username
+    font-family: 'FontAwesome'
+    content: '\f2be'

style/modules/shopping/_shopping-dir.sass

@@ -1,2 +1,3 @@
 @import "navbar_shopping"
 @import "footer"
+@import "cart"

style/style.css

@@ -114,6 +114,40 @@ video {
   margin: auto;
 }
 
+.shopping-footer {
+  background-color: grey;
+  padding-left: 10%;
+}
+
+.shopping-footer h1 {
+  color: #fff;
+  font-size: 35px;
+}
+
+.shopping-footer ul {
+  list-style: none;
+  text-align: left;
+  padding-left: 0;
+}
+
+.shopping-footer ul li {
+  color: #fff;
+  font-size: 22px;
+  line-height: 1.5;
+}
+
+@media (max-width: 974px) {
+  .shopping-footer {
+    padding: 0;
+  }
+  .shopping-footer h1 {
+    text-align: center;
+  }
+  .shopping-footer ul {
+    text-align: center;
+  }
+}
+
 .my-btn {
   background-color: rgba(255, 255, 255, 0.3);
   color: black;
@@ -131,6 +165,11 @@ video {
   color: white;
 }
 
+#btn-home-login:before {
+  font-family: 'FontAwesome';
+  content: '\f2be';
+}
+
 .my-floating-btn {
   display: none;
   top: 90%;
@@ -255,11 +294,6 @@ video {
   font-size: 1.2rem;
 }
 
-#btn-home-login:before {
-  font-family: 'FontAwesome';
-  content: '\f2be';
-}
-
 .sectionMenu .row {
   padding-left: 20%;
   padding-right: 20%;
@@ -361,7 +395,7 @@ video {
 
 .sectionShopping .shopping_headerNav #span-shopping-username {
   position: absolute;
-  font-size: 2rem;
+  font-size: 1.5rem;
   left: 1rem;
   top: 1rem;
   color: white;
@@ -372,4 +406,43 @@ video {
   right: 1rem;
   top: 1rem;
 }
+
+#span-shopping-username {
+  font-family: 'FontAwesome';
+  content: '\f2be';
+}
+
+.sectionShopping #shopping_cartTitle, .sectionShopping .cartTable {
+  width: 100%;
+  height: 100%;
+  text-align: justify;
+  border-bottom: 1px solid grey;
+}
+
+.sectionShopping #shopping_cartTitle:after, .sectionShopping .cartTable:after {
+  content: "";
+  display: inline-block;
+  overflow: hidden;
+  width: 100%;
+}
+
+.sectionShopping #shopping_cartTitle h1, .sectionShopping .cartTable span {
+  display: inline-block;
+}
+
+.sectionShopping #shopping_cart {
+  margin-top: 5%;
+}
+
+.sectionShopping #shopping_cart .cartTable {
+  margin: auto;
+}
+
+.sectionShopping #shopping_cart .cart_priceP {
+  text-align: right;
+}
+
+.sectionShopping #shopping_cart .cart_deleteP {
+  text-align: right;
+}
 /*# sourceMappingURL=style.css.map */