diff --git a/client/css/account-page.css b/client/css/account-page.css
index 646ce25066e24960886a235c3ab536cd0277e3a4..4baeca44b4efa8b98753444c313fc4f3b4a50b00 100644
--- a/client/css/account-page.css
+++ b/client/css/account-page.css
@@ -15,7 +15,7 @@
mix-blend-mode: multiply;
background-position: center;
background-size: cover;
- display: grid;
+ display:block;
place-items: center;
}
.account-details{
@@ -23,7 +23,9 @@
min-width: 50%;
min-height: 67%;
max-width: 67%;
- margin: 15%;
+ margin-left: 15%;
+ margin-right: 15%;
+ margin-top: 5%;
border-style: ridge;
display:block;
border-radius: 10px;
@@ -31,10 +33,10 @@
}
.account-details h1 {
- margin-bottom: 10%;
- margin-top: 5%;
+ margin-bottom: 10px;
+ /* margin-top: 5%; */
margin-left: 5%;
- font-size: 40px;
+ font-size: 30px;
}
.button-field {
diff --git a/client/css/cart.css b/client/css/cart.css
index fb1e4b53d146bae71a5d4760f992888df3b66426..9fcbf560405d3023ce8b2b8c4dd9c150ff887070 100644
--- a/client/css/cart.css
+++ b/client/css/cart.css
@@ -20,7 +20,9 @@
}
.cart-group{
- padding-top: 10%;
+ margin-left: 15%;
+ margin-right: 15%;
+ margin-top: 5%;
display: block;
/* background-color: red; */
}
@@ -71,7 +73,7 @@
#checkout-button {
cursor: pointer;
color: white;
- background-color: rgb(137, 62, 137);
+ background-color: #3c00a0;
min-width: 25%;
height: 10vh;
font-size: 20px;
diff --git a/client/css/make-sale.css b/client/css/make-sale.css
index 532d5bd6ffe3061d5353f0bbe1e770bd876704cd..763a29f2c17649e8fb7a7d72f190bb3f812ac3fd 100644
--- a/client/css/make-sale.css
+++ b/client/css/make-sale.css
@@ -10,95 +10,121 @@
.container{
- width: 100%;
- height: 100vh;
- background-image: linear-gradient(rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.8)), url(../image/bg.webp);
+ position: relative;
+ /* max-width: 100%; */
+ /* height: 100vh; */
+ /* background-image: linear-gradient(rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.8)), url(../image/bg.webp); */
mix-blend-mode: multiply;
background-position: center;
background-size: cover;
- position: relative;
- place-items: center;
display: block;
+ place-items: center;
}
.saleform-group {
- position: relative;
- /* width: 31%;
- height: 31%; */
- margin-top: 5vh;
- min-width: 300px;
- flex-shrink: 0;
- display: grid;
- place-items: center;
+ /* position: relative; */
+ min-width: 50%;
+ /* min-height: 67%; */
+ max-width: 67%;
+ margin-left: 15%;
+ margin-right: 15%;
+ margin-top: 5%;
+ /* border-style: ridge; */
+ display: block;
+ border-radius: 10px;
+ /* border-width: 10px; */
+ /* background-color: red; */
}
.saleform-group h1 {
- color: #ffffffab;
+ /* color: #ffffffab; */
font-size: 30px;
- font-style: normal;
- font-weight: 800;
- line-height: normal;
- position: relative;
- text-align: center;
- margin-bottom: 21px;
+ margin-left: 5%;
+ margin-bottom: 10px;
}
-.saleform-group button {
- position: relative;
- left: 25%;
-}
form p {
text-align : center;
font-size : 20px;
- color : #ffffffab;
+ /* color : #ffffffab; */
}
-@media screen and ((max-width: 400px) or (max-height: 750px)) {
- .saleform-group{
- top: -5%;
+@media screen and ((max-width: 600px)) {
+ .input-group{
+ display: flex;
+ flex-direction: column;
}
}
-/* .input-group {
-} */
+
+#saleform {
+ display: flex;
+ flex-direction: column;
+}
+.input-group {
+ display: flex;
+ flex: 1 1 auto;
+ /* background-color: red; */
+}
+.input-image-field {
+ /* background: linear-gradient(rgba(255,255,255,0.67), rgba(255,255,255,0.67)); */
+ /* display:inline-block; */
+ flex: 1 1 1vw;
+ margin: 10px;
+ border-radius: 10px;
+ background-color: azure;
+ min-width: 20%;
+ min-height: 15vw;
+ transition: max-height 0.5s;
+}
+.input-text-fields {
+ flex: 1 1 auto;
+ /* background-color: #3c00a0; */
+}
.input-field {
- background: linear-gradient(rgba(255,255,255,0.67), rgba(255,255,255,0.67));
+ /* background: linear-gradient(rgba(255,255,255,0.67), rgba(255,255,255,0.67)); */
+ /* display: block; */
margin: 15px 0;
border-radius: 10px;
- display: flex;
align-items: center;
- max-height: 65px;
+ /* max-height: 65px; */
transition: max-height 0.5s;
overflow: hidden;
color: black ;
}
-.currency_label {
- margin: 15px 15px;
-}
-
.input-field ::placeholder {
color: black;
}
+#product_image {
+ background-color: azure;
+}
+
input {
width: 100%;
- background: transparent;
+ background-color: #eaeaea;
padding: 18px;
+ border-color: transparent;
}
.button-field {
width: 100%;
+ margin-top: 4vh;
display: flex;
- justify-content: space-between;
+ flex-direction: row-reverse;
}
.button-field button{
- flex-basis: 48%;
+ /* flex-basis: 48%; */
+ min-width: 25%;
+ height: 5vh;
+ border-color: transparent;
+ margin-right: 15px;
+ /* margin-bottom: 15px; */
background: #3c00a0;
color: #fff;
- height: 40px;
- border-radius: 20px;
+ border-radius: 10px;
font-size: 20px;
border: 0;
outline: 0;
diff --git a/client/pages/account-page.php b/client/pages/account-page.php
index 07844f1d5b8d70a44075a95f7e830cfc58290e01..51c20432f030380526e6a0c14e77889c4aa8ae9f 100644
--- a/client/pages/account-page.php
+++ b/client/pages/account-page.php
@@ -1,4 +1,13 @@
-<?php session_start()?>
+<?php session_start();
+if (!isset($_SESSION['username']) or !isset($_SESSION['email'])) {
+ echo '<script type = "text/javascript">
+ function loggedout_catch() {
+ alert("You are logged in, please logout first if you want to login again");
+ location.href = "../pages/login-page.php"
+ }
+ loggedout_catch();
+ </script>';
+}?>
<!DOCTYPE html>
<html>
<head>
@@ -6,16 +15,16 @@
<title>Account Page</title>
<link rel="stylesheet" href="../css/account-page.css">
<script src="https://kit.fontawesome.com/8505941c5b.js" crossorigin="anonymous"></script>
- <!-- <link rel="stylesheet" href="../css/navbar.css"> -->
- <!-- <script src="../js/navbar.js"></script> -->
+ <link rel="stylesheet" href="../css/navbar.css">
+ <script src="../js/navbar.js"></script>
</head>
<body>
<div class="container">
- <!-- <div class="tabgroup" id="tabgroup">
+ <div class="tabgroup" id="tabgroup">
<script>
addnavbar();
</script>
- </div> -->
+ </div>
<div class="account-details">
<h1>
Account Details
@@ -23,13 +32,13 @@
<div class="text-field">
<label class="detail-label">Email</label>
<input class="detail-value" type="text" id="email-value" placeholder=
- <?php echo isset($_SESSION["email"])?$_SESSION['email']:"ERROR: no login"?>
+ <?php echo isset($_SESSION["email"])?$_SESSION['email']:"<nologin>"?>
disabled>
</div>
<div class="text-field">
<label class="detail-label">Username</label>
<input class="detail-value" type="text" id="username-value" placeholder=
- <?php echo isset($_SESSION["username"])?$_SESSION['username']:"ERROR: no login"?>
+ <?php echo isset($_SESSION["username"])?$_SESSION['username']:"<nologin>"?>
disabled>
</div>
<div class="text-field">
diff --git a/client/pages/make-sale.php b/client/pages/make-sale.php
index 2196fe8cc688710b8d73ea644fa12fff48d7177a..edd7d13354d8604c02d7a85751c4924a0341e73c 100644
--- a/client/pages/make-sale.php
+++ b/client/pages/make-sale.php
@@ -18,21 +18,24 @@
<h1 id="title">Make A Sale</h1>
<form id="saleform">
<div class="input-group">
- <div class="input-field">
- <input type="text" id="product_name" placeholder="Product Name">
- </div>
- <div class="input-field">
- <input type="text" id="product_description" placeholder="Product Description">
- </div>
- <div class="input-field">
- <input type="text" id="product_price" placeholder="Price">
- </div>
- <div class="input-field">
- <input type="text" id="product_qty" placeholder="Quantity">
- </div>
- <div class="input-field">
+ <div class="input-image-field">
<input type="image" id="product_image" placeholder="Product Image" title="Product Image">
</div>
+ <div class="input-text-fields">
+ <div class="input-field">
+ <input type="text" id="product_name" placeholder="Product Name">
+ </div>
+ <div class="input-field" id="product_description-field">
+ <input type="text" id="product_description" placeholder="Product Description">
+ </div>
+ <div class="input-field">
+ <input type="text" id="product_price" placeholder="Price">
+ </div>
+ <div class="input-field">
+ <input type="text" id="product_qty" placeholder="Quantity">
+ </div>
+ </div>
+
</div>
<div class="button-field">
<button type="button" id="salesubmit">Done</button>
diff --git a/client/protoype/account-page.html b/client/protoype/account-page.html
deleted file mode 100644
index 4e25b413e792b5b49bc190378527a1b464d59844..0000000000000000000000000000000000000000
--- a/client/protoype/account-page.html
+++ /dev/null
@@ -1,50 +0,0 @@
-<!DOCTYPE html>
-<html>
- <head>
- <meta name="viewport" content="width=device-width, initial scale=1.0">
- <title>Account Page</title>
- <link rel="stylesheet" href="../css/account-page.css">
- <script src="https://kit.fontawesome.com/8505941c5b.js" crossorigin="anonymous"></script>
- <!-- <link rel="stylesheet" href="../css/navbar.css"> -->
- <!-- <script src="../js/navbar.js"></script> -->
- <!-- <?php session_start() ?> -->
- </head>
- <body>
- <div class="container">
- <!-- <div class="tabgroup" id="tabgroup">
- <script>
- addnavbar();
- </script>
- </div> -->
- <div class="account-details">
- <h1>
- Account Details
- </h1>
- <div class="text-field">
- <label class="detail-label">Email</label>
- <input class="detail-value" type="text" id="email-value" placeholder="email-value" disabled>
- </div>
- <div class="text-field">
- <label class="detail-label">Username</label>
- <input class="detail-value" type="text" id="username-value" placeholder="username-value" disabled>
- </div>
- <div class="text-field">
- <label class="detail-label">Password</label>
- <input class="detail-value password" type="password" id="password-value" placeholder="--------" disabled oninput="confirmPassword()" onchange="cancelConfirmPassword()">
- <p class="password-criteria"></p>
- </div>
- <div class="text-field" id="confirm-password-field">
- <label class="detail-label">Confirm Password</label>
- <input class="detail-value password" type="password" id="confirm-password-value" placeholder="Re-Type Password" oninput="confirmCorrectRetype()">
- <p class="password-criteria"></p>
- </div>
- <div class="button-field">
- <button id="edit-profile-button" onclick="startEdit()">Edit profile</button>
- <button id="cancel-edit-button" onclick="cancelEdit()">Cancel</button>
- <button id="submit-edit-button" onclick="submitEdit()">Submit</button>
- </div>
- </div>
- </div>
- <script src="../js/account-page.js"></script>
- </body>
-</html>
\ No newline at end of file