+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/UI/admin_create_product.html b/UI/admin_create_product.html
new file mode 100644
index 0000000..cf3b507
--- /dev/null
+++ b/UI/admin_create_product.html
@@ -0,0 +1,83 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 
+
+
+
+
+
+
+
+
+ Google Pixel 2
+The Google Pixel 2 is powered by 1.9GHz octa-core
+Quantity: 3
+Price: $649
+ + +
+ 
+
+
+
+
+
+
+
+
+ Google Pixel 3
+The Pixel 3 is the latest causality. Wireless charging is..
+Quantity: 3
+Price: $649
+ + +
+ 
+
+
+
+
+
+
+
+
+ Iphone XS
+The iPhone XS display has rounded corners that...
+Quantity: 3
+Price: $1500
+ + +
+ 
+
+
+
+
+
+
+
+
+ IPhone X
+The phone comes with a 5.80-inch touchscreen display
+Quantity: 3
+Price: $890
+ + +
+
+
+
+
+
+
+
+
+
+ Google Pixel 2
+The Google Pixel 2 is powered by 1.9GHz octa-core
+Quantity: 3
+Price: $649
+ + +
+
+
+
+
+
+
+
+
+
+ Google Pixel 3
+The Pixel 3 is the latest causality. Wireless charging is..
+Quantity: 3
+Price: $649
+ + +
+
+
+
+
+
+
+
+
+
+ Iphone XS
+The iPhone XS display has rounded corners that...
+Quantity: 3
+Price: $1500
+ + +
+
+
+
+
+
+
+
+
+ IPhone X
+The phone comes with a 5.80-inch touchscreen display
+Quantity: 3
+Price: $890
+ +
+ Store Manager | Create Sales Attendant
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Store Manager | View Sales
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Store Manager | View Profile
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/UI/admin_create_sales_attendant.html b/UI/admin_create_sales_attendant.html
new file mode 100644
index 0000000..24f6a8e
--- /dev/null
+++ b/UI/admin_create_sales_attendant.html
@@ -0,0 +1,78 @@
+
+
+
+
+
+
+
+
+
+
+
+
+ Create New Product
+ +
+ Store Manager | Edit Product
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Store Manager | View Sales
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Store Manager | Welcome
+
+
+
+
+
+
+
+
+
+
+
+
+ Store Manager | Login
+
+
+
+
+
+
+ ${val.productname} ${val.productamount} ${val.productquantity} Store Manager | Add Products
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/UI/admin_edit_product.html b/UI/admin_edit_product.html
new file mode 100644
index 0000000..1ab9af9
--- /dev/null
+++ b/UI/admin_edit_product.html
@@ -0,0 +1,83 @@
+
+
+
+
+
+
+
+
+
+
+
+
+ Create Sales Attendant
+ +
+ Store Manager | View Products
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/UI/admin_view_products.html b/UI/admin_view_products.html
new file mode 100644
index 0000000..28d5f75
--- /dev/null
+++ b/UI/admin_view_products.html
@@ -0,0 +1,180 @@
+
+
+
+
+
+
+
+
+
+
+
+
+ Edit Product
+ +Store Manager
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/UI/admin_view_sales.html b/UI/admin_view_sales.html
new file mode 100644
index 0000000..6c385b7
--- /dev/null
+++ b/UI/admin_view_sales.html
@@ -0,0 +1,101 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Google Pixel 2
+The Google Pixel 2 is powered by 1.9GHz octa-core
+Quantity: 3
+Price: $649
+ + +
+
+
+
+
+
+
+
+
+
+ Google Pixel 3
+The Pixel 3 is the latest causality. Wireless charging is..
+Quantity: 3
+Price: $649
+ + +
+
+
+
+
+
+
+
+
+
+ Iphone XS
+The iPhone XS display has rounded corners that...
+Quantity: 3
+Price: $1500
+ + +
+
+
+
+
+
+
+
+
+
+ IPhone X
+The phone comes with a 5.80-inch touchscreen display
+Quantity: 3
+Price: $890
+ + +
+
+
+
+
+
+
+
+
+
+ Google Pixel 2
+The Google Pixel 2 is powered by 1.9GHz octa-core
+Quantity: 3
+Price: $649
+ + +
+
+
+
+
+
+
+
+
+
+ Google Pixel 3
+The Pixel 3 is the latest causality. Wireless charging is..
+Quantity: 3
+Price: $649
+ + +
+
+
+
+
+
+
+
+
+
+ Iphone XS
+The iPhone XS display has rounded corners that...
+Quantity: 3
+Price: $1500
+ + +
+
+
+
+
+
+
+
+
+ IPhone X
+The phone comes with a 5.80-inch touchscreen display
+Quantity: 3
+Price: $890
+ + +
+ Store Manager | Attendant Admin
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/UI/attendant_admin_view.html b/UI/attendant_admin_view.html
new file mode 100644
index 0000000..1f94ce4
--- /dev/null
+++ b/UI/attendant_admin_view.html
@@ -0,0 +1,193 @@
+
+
+
+
+
+
+
+
+
+
+
+
+ | Date | +Store Attendant | +Product | +Amount | +Status | +
|---|---|---|---|---|
| 04/10/2018 | +Store Attendant 1 | +iPhone Xs | +$1,190 | +Completed | +
| 04/10/2018 | +Store Attendant 8 | +Google Pixel 2 | +$790 | +Completed | +
| 07/10/2018 | +Store Attendant 121 | +iPhone 7 | +$500 | +Completed | +
Store Manager
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Google Pixel 2
+The Google Pixel 2 is powered by 1.9GHz octa-core
+Quantity: 3
+Price: $649
+ +
+
+
+
+
+
+
+
+
+
+ Google Pixel 3
+The Pixel 3 is the latest causality. Wireless charging is..
+Quantity: 3
+Price: $649
+ +
+
+
+
+
+
+
+
+
+
+ Iphone XS
+The iPhone XS display has rounded corners that...
+Quantity: 3
+Price: $1500
+ +
+
+
+
+
+
+
+
+
+
+ IPhone X
+The phone comes with a 5.80-inch touchscreen display
+Quantity: 3
+Price: $890
+ +
+
+
+
+
+
+
+
+
+
+ Google Pixel 2
+The Google Pixel 2 is powered by 1.9GHz octa-core
+Quantity: 3
+Price: $649
+ +
+
+
+
+
+
+
+
+
+
+ Google Pixel 3
+The Pixel 3 is the latest causality. Wireless charging is..
+Quantity: 3
+Price: $649
+ +
+
+
+
+
+
+
+
+
+
+ Iphone XS
+The iPhone XS display has rounded corners that...
+Quantity: 3
+Price: $1500
+ +
+
+
+
+
+
+
+
+
+ IPhone X
+The phone comes with a 5.80-inch touchscreen display
+Quantity: 3
+Price: $890
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/UI/css/k2d-webfont.woff b/UI/css/k2d-webfont.woff
new file mode 100644
index 0000000..c1d07fe
Binary files /dev/null and b/UI/css/k2d-webfont.woff differ
diff --git a/UI/css/k2d-webfont.woff2 b/UI/css/k2d-webfont.woff2
new file mode 100644
index 0000000..52168c0
Binary files /dev/null and b/UI/css/k2d-webfont.woff2 differ
diff --git a/UI/css/style.css b/UI/css/style.css
new file mode 100644
index 0000000..7a12093
--- /dev/null
+++ b/UI/css/style.css
@@ -0,0 +1,1130 @@
+/* Document
+ ========================================================================== */
+
+/**
+ * 1. Correct the line height in all browsers.
+ * 2. Prevent adjustments of font size after orientation changes in iOS.
+ */
+
+ html {
+ line-height: 1.15; /* 1 */
+ -webkit-text-size-adjust: 100%; /* 2 */
+ height: 100%;
+ margin: 0;
+ padding: 0;
+ }
+
+ /* Sections
+ ========================================================================== */
+
+
+ /**
+ * Correct the font size and margin on `h1` elements within `section` and
+ * `article` contexts in Chrome, Firefox, and Safari.
+ */
+
+ h1 {
+ font-size: 2em;
+ margin: 0.67em 0;
+ }
+
+ /* Grouping content
+ ========================================================================== */
+
+ /**
+ * 1. Add the correct box sizing in Firefox.
+ * 2. Show the overflow in Edge and IE.
+ */
+
+ hr {
+ box-sizing: content-box; /* 1 */
+ height: 0; /* 1 */
+ overflow: visible; /* 2 */
+ }
+
+ /**
+ * 1. Correct the inheritance and scaling of font size in all browsers.
+ * 2. Correct the odd `em` font sizing in all browsers.
+ */
+
+ pre {
+ font-family: monospace, monospace; /* 1 */
+ font-size: 1em; /* 2 */
+ }
+
+ /* Text-level semantics
+ ========================================================================== */
+
+ /**
+ * Remove the gray background on active links in IE 10.
+ */
+
+ a {
+ background-color: transparent;
+ }
+
+ /**
+ * 1. Remove the bottom border in Chrome 57-
+ * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
+ */
+
+ abbr[title] {
+ border-bottom: none; /* 1 */
+ text-decoration: underline; /* 2 */
+ text-decoration: underline dotted; /* 2 */
+ }
+
+ /**
+ * Add the correct font weight in Chrome, Edge, and Safari.
+ */
+
+ b,
+ strong {
+ font-weight: bolder;
+ }
+
+ /**
+ * 1. Correct the inheritance and scaling of font size in all browsers.
+ * 2. Correct the odd `em` font sizing in all browsers.
+ */
+
+ code,
+ kbd,
+ samp {
+ font-family: monospace, monospace; /* 1 */
+ font-size: 1em; /* 2 */
+ }
+
+ /**
+ * Add the correct font size in all browsers.
+ */
+
+ small {
+ font-size: 80%;
+ }
+
+ /**
+ * Prevent `sub` and `sup` elements from affecting the line height in
+ * all browsers.
+ */
+
+ sub,
+ sup {
+ font-size: 75%;
+ line-height: 0;
+ position: relative;
+ vertical-align: baseline;
+ }
+
+ sub {
+ bottom: -0.25em;
+ }
+
+ sup {
+ top: -0.5em;
+ }
+
+
+ /* Embedded content
+ ========================================================================== */
+
+ /**
+ * Remove the border on images inside links in IE 10.
+ */
+
+ img {
+ border-style: none;
+ }
+
+ /* Forms
+ ========================================================================== */
+
+ /**
+ * 1. Change the font styles in all browsers.
+ * 2. Remove the margin in Firefox and Safari.
+ */
+
+ button,
+ input,
+ optgroup,
+ select,
+ textarea {
+ font-family: inherit; /* 1 */
+ font-size: 100%; /* 1 */
+ line-height: 1.15; /* 1 */
+ margin: 0; /* 2 */
+ }
+
+ /**
+ * Show the overflow in IE.
+ * 1. Show the overflow in Edge.
+ */
+
+ button,
+ input { /* 1 */
+ overflow: visible;
+ }
+
+ /**
+ * Remove the inheritance of text transform in Edge, Firefox, and IE.
+ * 1. Remove the inheritance of text transform in Firefox.
+ */
+
+ button,
+ select { /* 1 */
+ text-transform: none;
+ }
+
+ /**
+ * Correct the inability to style clickable types in iOS and Safari.
+ */
+
+ button,
+ [type="button"],
+ [type="reset"],
+ [type="submit"] {
+ -webkit-appearance: button;
+ }
+
+ /**
+ * Remove the inner border and padding in Firefox.
+ */
+
+ button::-moz-focus-inner,
+ [type="button"]::-moz-focus-inner,
+ [type="reset"]::-moz-focus-inner,
+ [type="submit"]::-moz-focus-inner {
+ border-style: none;
+ padding: 0;
+ }
+
+ /**
+ * Restore the focus styles unset by the previous rule.
+ */
+
+ button:-moz-focusring,
+ [type="button"]:-moz-focusring,
+ [type="reset"]:-moz-focusring,
+ [type="submit"]:-moz-focusring {
+ outline: 1px dotted ButtonText;
+ }
+
+ /**
+ * Correct the padding in Firefox.
+ */
+
+ fieldset {
+ padding: 0.35em 0.75em 0.625em;
+ }
+
+ /**
+ * 1. Correct the text wrapping in Edge and IE.
+ * 2. Correct the color inheritance from `fieldset` elements in IE.
+ * 3. Remove the padding so developers are not caught out when they zero out
+ * `fieldset` elements in all browsers.
+ */
+
+ legend {
+ box-sizing: border-box; /* 1 */
+ color: inherit; /* 2 */
+ display: table; /* 1 */
+ max-width: 100%; /* 1 */
+ padding: 0; /* 3 */
+ white-space: normal; /* 1 */
+ }
+
+ /**
+ * Add the correct vertical alignment in Chrome, Firefox, and Opera.
+ */
+
+ progress {
+ vertical-align: baseline;
+ }
+
+ /**
+ * Remove the default vertical scrollbar in IE 10+.
+ */
+
+ textarea {
+ overflow: auto;
+ }
+
+ /**
+ * 1. Add the correct box sizing in IE 10.
+ * 2. Remove the padding in IE 10.
+ */
+
+ [type="checkbox"],
+ [type="radio"] {
+ box-sizing: border-box; /* 1 */
+ padding: 0; /* 2 */
+ }
+
+ /**
+ * Correct the cursor style of increment and decrement buttons in Chrome.
+ */
+
+ [type="number"]::-webkit-inner-spin-button,
+ [type="number"]::-webkit-outer-spin-button {
+ height: auto;
+ }
+
+ /**
+ * 1. Correct the odd appearance in Chrome and Safari.
+ * 2. Correct the outline style in Safari.
+ */
+
+ [type="search"] {
+ -webkit-appearance: textfield; /* 1 */
+ outline-offset: -2px; /* 2 */
+ }
+
+ /**
+ * Remove the inner padding in Chrome and Safari on macOS.
+ */
+
+ [type="search"]::-webkit-search-decoration {
+ -webkit-appearance: none;
+ }
+
+ /**
+ * 1. Correct the inability to style clickable types in iOS and Safari.
+ * 2. Change font properties to `inherit` in Safari.
+ */
+
+ ::-webkit-file-upload-button {
+ -webkit-appearance: button; /* 1 */
+ font: inherit; /* 2 */
+ }
+
+ /* Interactive
+ ========================================================================== */
+
+ /*
+ * Add the correct display in Edge, IE 10+, and Firefox.
+ */
+
+ details {
+ display: block;
+ }
+
+ /*
+ * Add the correct display in all browsers.
+ */
+
+ summary {
+ display: list-item;
+ }
+
+ /* Misc
+ ========================================================================== */
+
+ /**
+ * Add the correct display in IE 10+.
+ */
+
+ template {
+ display: none;
+ }
+
+ /**
+ * Add the correct display in IE 10.
+ */
+
+ [hidden] {
+ display: none;
+ }
+
+
+
+@font-face {
+ font-family: 'k2d_semiboldregular';
+ src: url('k2d-webfont.woff2') format('woff2'),
+ url('k2d-webfont.woff') format('woff');
+ font-weight: normal;
+ font-style: normal;
+
+}
+
+
+body{
+ font-family: 'k2d_semiboldregular', sans-serif;
+ font-size: 15px;
+ line-height: 1.5;
+ padding: 0;
+ margin: 0;
+ background-color: #f4f4f4;
+ overflow-x: hidden;
+ height: 100%;
+ /* min-height: 100%; */
+ /* position: relative; */
+}
+
+/* body {
+ background-color: #f4f4f4;
+ overflow-x: hidden;
+} */
+
+/* Global */
+.container{
+ width: 100%;
+ /* margin: 100px; */
+ overflow: hidden;
+}
+
+.text-center{
+ text-align:center;
+}
+
+.topmargin{
+ margin-top: 100px;
+}
+
+.dashboard{
+ display: none !important;
+}
+
+
+
+/* Navigation */
+nav .highlight, nav .current a{
+ color: #0099ff;
+ font-weight: bold;
+ font-size: 22px;
+}
+
+nav a:hover{
+ color:#cccccc;
+ font-weight: bold;
+}
+
+#appnameli{
+ float: left;
+}
+
+#appname{
+ font-size: 25px;
+ margin: 0;
+ padding: 0;
+
+}
+
+#searchimg{
+ width: 40px;
+ height: 40px;
+ margin: 0;
+ padding: 0px;
+ display: block;
+ float: right;
+ color: #fff;
+ background: inherit;
+}
+
+#userimg{
+ width: 40px;
+ height: 40px;
+ margin-top: 0;
+ padding: 0px;
+ display: block;
+ float: right;
+ color: #fff;
+ border-radius: 50%;
+ border: #0099ff 3px solid;
+}
+
+#cartimage{
+ width: 40px;
+ height: 40px;
+ margin: 0;
+ padding: 0px;
+ /* display: block; */
+ float: right;
+ /* background: #fff; */
+}
+
+.navbar{
+ background-color: #1c588a;
+ overflow: hidden;
+ height: 63px;
+ position: fixed;
+ top: 0;
+ z-index: 1;
+ width: 100%;
+ /* margin-bottom: 500px; */
+ border-bottom: #0099ff 3px solid;
+
+}
+
+#openslidemenu{
+float: left;
+}
+
+.navbar a{
+ float: right;
+ /* display: block; */
+ color: #f2f2f2;
+ text-align: center;
+ padding: 14px 16px;
+ text-decoration: none;
+ font-size: 17px;
+ /* margin-right: 10px; */
+}
+
+
+.navbar ul {
+ margin: 8px 0 0 0;
+ list-style: none;
+}
+
+/* .navbar a:hover {
+ background-color: #ddd;
+ color: black;
+} */
+
+.search{
+ outline: none;
+ height: 30px;
+ color: black;
+ text-align: center;
+ /* background: #cccccc; */
+ border: 2px solid #0099ff;
+ /* width: 30%; */
+ font-size: 16px;
+}
+
+
+.side-nav{
+ height: 100%;
+ width: 0;
+ position: fixed;
+ z-index: 1;
+ top: 0;
+ left: 0;
+ background-color: #111;
+ opacity: 0.9;
+ overflow-x: hidden;
+ padding-top: 60px;
+ transition: 0.5s;
+}
+
+.side-nav a{
+ padding: 10px 10px 10px 30px;
+ text-decoration: none;
+ font-size: 20px;
+ color: #ccc;
+ display: block;
+ transition: 0.3;
+ text-align: center;
+ text-transform: uppercase;
+}
+
+.side-nav .current a{
+ color: #0099ff;
+ font-weight: bold;
+}
+
+.side-nav a:hover{
+ color: #fff;
+ background: #0099ff;
+
+}
+
+.side-nav .btn-close{
+ position: absolute;
+ top: 0;
+ right: 22px;
+ font-size: 25px;
+ margin-left: 50px;
+ background: inherit !important;
+}
+
+.side-nav li{
+ list-style: none;
+}
+
+#side-menu{
+ width: 250px;
+}
+
+#main{
+ transition: margin-left 0.5s;
+ overflow: hidden;
+ width: 100%;
+}
+
+/* TopCards */
+.topcardsgroup {
+ display: flex ;
+ justify-content: space-between;
+ justify-items: flex-start;
+
+}
+
+#topcards{
+ /* margin: 20px 0 20px 0; */
+ margin-top: 100px;
+}
+
+
+.topcardsbox{
+ background: linear-gradient(89deg, #4d4dff 0%, #80bfff 100%) !important;
+ width: 31%;
+ text-align: center;
+ margin: 0 auto;
+ height: 100%;
+}
+
+
+.showcasecard{
+ padding: 5%;
+ transition: 0.9s;
+ -webkit-box-shadow: -1px 2px 7px -1px rgba(0,0,0,0.75);
+ -moz-box-shadow: -1px 2px 7px -1px rgba(0,0,0,0.75);
+ box-shadow: -1px 2px 7px -1px rgba(0,0,0,0.75);
+ box-sizing: border-box;
+}
+
+
+
+
+
+/* Card */
+
+
+.cardgroup{
+ width: 100%;
+ display: block;
+ text-align: center;
+}
+
+
+
+.card {
+ background: #fff;
+ border-radius: 2px;
+ display: inline-block;
+ height: 400px;
+ margin: 1rem;
+ position: relative;
+ width: 300px;
+ box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
+ transition: all 0.3s cubic-bezier(.25,.8,.25,1);
+}
+
+
+.card:hover {
+ box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);
+}
+
+.cardimg{
+ width: 300px;
+ height: 150px;
+}
+.cardbody{
+ margin-bottom: 10px;
+ background: #ccc;
+ height: 250px;
+}
+
+.button_1{
+ height: 38px;
+ background: #0099ff;
+ border: none;
+ padding-left: 20px;
+ padding-right: 20px;
+ color: #ffffff;
+ cursor: pointer;
+}
+
+.button_2{
+ height: 38px;
+ background: red;
+ border: none;
+ padding-left: 20px;
+ padding-right: 20px;
+ color: #ffffff;
+ cursor: pointer;
+}
+
+.button_3{
+ height: 38px;
+ background: green;
+ border: none;
+ padding-left: 20px;
+ padding-right: 20px;
+ color: #ffffff;
+ cursor: pointer;
+}
+
+.button_1 a{
+ text-decoration: none;
+ color: inherit;
+ background: inherit;
+ margin: 0;
+ padding: 0;
+}
+
+input[type="number"]{
+ border: none;
+ /* border-bottom: 1px solid black; */
+ /* background: transparent; */
+ outline: none;
+ height: 30px;
+ color: black;
+ text-align: center;
+ /* background: #cccccc; */
+ border: 2px solid #0099ff;
+ width: 30%;
+ font-size: 16px;
+}
+
+/* Table Styling */
+
+.table{
+ /* margin-left: 50px; */
+ /* margin-right: 50px;
+ padding: 50px; */
+ /* width: 80%; */
+
+}
+table {
+ border: 1px solid #ccc;
+ border-collapse: collapse;
+ margin: 0px auto;
+ padding: 0;
+ width: 80%;
+ table-layout: fixed;
+}
+
+table caption {
+ font-size: 1.5em;
+ margin: .5em 0 .75em;
+}
+
+table tr {
+ background-color: #f8f8f8;
+ border: 1px solid #ddd;
+ padding: .35em;
+}
+
+table th,
+table td {
+ padding: .625em;
+ text-align: center;
+}
+
+table th {
+ font-size: .85em;
+ letter-spacing: .1em;
+ text-transform: uppercase;
+}
+
+
+
+
+
+
+
+/* End Of Table Styling */
+.footerstickbottom{
+ position: absolute !important;
+ bottom:0;
+ left: 0;
+}
+
+#footer{
+ padding: 20px;
+ margin-top: 20px;
+ /* height: 100px; */
+ color: #ffffff;
+ background: #1c588a;
+ text-align: center;
+ position: relative;
+ width:100%;
+ }
+
+.wrapper {
+ min-height: 100%;
+ /* margin-bottom: -20px; */
+ /* position: absolute; */
+ /* margin: 0 auto; */
+}
+
+#productviewsection{
+ display: flex;
+}
+
+.productviewcardimg{
+ width: 300px;
+ height: 300px;
+}
+
+#productdetailsimg{
+ float: left;
+ margin-left: 100px;
+ /* width: 50%; */
+
+}
+
+#productdetails{
+float: right;
+margin-right: 100px;
+width: 50%;
+}
+
+
+.list-group {
+ display: flex;
+ flex-direction: column;
+ padding-left: 0;
+ margin-bottom: 0;
+}
+
+.list-group-item {
+ position: relative;
+ display: block;
+ padding: 10px 15px;
+ margin-bottom: -1px;
+ background-color: #fff;
+ border: 1px solid rgba(0,0,0,.125);
+ overflow-wrap: break-word;
+
+}
+
+
+
+
+/* Login Page */
+#loginbody{
+ margin: 0;
+ padding: 0;
+ background: url(../img/background.jpg) no-repeat;
+ background-size: cover;
+ background-position: center;
+ font-family: sans-serif;
+ height: 100%;
+}
+
+/* Styling For Login Page */
+.loginbox{
+ width: 320px;
+ height: auto;
+ background: #000;
+ color: #fff;
+ top: 50%;
+ left: 50%;
+ position: absolute;
+ transform: translate(-50%,-50%);
+ box-sizing: border-box;
+ padding: 70px 30px;
+}
+
+.avatar{
+ width: 100px;
+ height: 100px;
+ border-radius: 50%;
+ position: absolute;;
+ top: -50px;
+ left: calc(50% - 50px);
+}
+
+/* h1{
+ margin: 0;
+ padding: 0 0 20px;
+ text-align: center;
+ font-size: 22px;
+} */
+
+.loginbox p{
+ margin: 0;
+ padding: 0;
+ font-weight: bold;
+}
+
+.loginbox input{
+ width: 100%;
+ margin-bottom: 20px;
+}
+
+.loginbox input[type="text"], input[type="password"]{
+ border: none;
+ border-bottom: 1px solid #fff;
+ background: transparent;
+ outline: none;
+ height: 40px;
+ color: #fff;
+ font-size: 16px;
+}
+
+#loginpassword {
+ color: #fff !important;
+}
+.loginbox input[type="submit"]{
+ border: none;
+ outline: none;
+ height: 40px;
+ background: #0099ff;
+ color: #fff;
+ font-size: 18px;
+ border-radius: 20px;
+}
+
+.loginbox input[type="submit"]:hover{
+ cursor: pointer;
+ background: #99ebff;
+ color: #000;
+}
+
+.loginbox a{
+ text-decoration: none;
+ font-size: 12px;
+ line-height: 20px;
+ color: darkgray;
+}
+
+.loginbox a:hover{
+ color: #99ebff;
+}
+/* End Of Stying For Login Page */
+
+
+/* Shopping Cart Modal Styling */
+.modal {
+ display: none; /* Hidden by default */
+ position: fixed; /* Stay in place */
+ z-index: 1; /* Sit on top */
+ padding-top: 100px; /* Location of the box */
+ left: 0;
+ top: 0;
+ width: 100%; /* Full width */
+ height: 100%; /* Full height */
+ overflow: auto; /* Enable scroll if needed */
+ background-color: rgb(0,0,0); /* Fallback color */
+ background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
+}
+
+/* Modal Content */
+.modal-content {
+ background-color: #fefefe;
+ margin: auto;
+ padding: 20px;
+ border: 1px solid #888;
+ width: 80%;
+}
+
+/* The Close Button */
+.close {
+ color: #aaaaaa;
+ float: right;
+ font-size: 28px;
+ font-weight: bold;
+}
+
+.close:hover,
+.close:focus {
+ color: #000;
+ text-decoration: none;
+ cursor: pointer;
+}
+
+/* End Of Shopping Cart Modal Styling */
+
+#prof {
+ margin: 0 auto;
+ width: 50%;
+}
+
+#profiledetails {
+ /* width: 60%; */
+ /* margin: 50px; */
+ text-align: center;
+ display: inline;
+ float: none;
+ justify-content: center;
+}
+
+/* Styling For Admin Create Sales Attendant Page */
+select{
+ width: 50%;
+ overflow: hidden !important;
+ height: 30px;
+ outline: none;
+ /* margin: 20px; */
+}
+
+#create_sales_assistant{
+ width: 50%;
+ /* text-align: center; */
+ margin: 0 auto;
+ padding: 5%;
+}
+
+#create_sales_assistant p{
+ margin: 0;
+ padding: 0;
+ font-weight: bold;
+}
+
+#create_sales_assistant h1{
+ text-transform: uppercase;
+ margin-bottom: 2%;
+}
+
+#create_sales_assistant input{
+ width: 100%;
+ margin-bottom: 20px;
+}
+
+#create_sales_assistant input[type="text"], input[type="password"], input[type="email"]{
+ border: none;
+ border-bottom: 1px solid #0099ff;
+ background: transparent;
+ outline: none;
+ height: 40px;
+ color: #000;
+ font-size: 16px;
+}
+
+#create_sales_assistant input[type="submit"]{
+ border: none;
+ outline: none;
+ height: 40px;
+ background: #0099ff;
+ color: #fff;
+ font-size: 18px;
+ border-radius: 20px;
+}
+
+#create_sales_assistant input[type="submit"]:hover{
+ cursor: pointer;
+ background: #99ebff;
+ color: #000;
+}
+
+
+/* End Of Styling For Admin Create Sales Attendant Page */
+
+
+@media (max-width: 1020px) {
+ .card {
+ width: 450px;
+ }
+ .cardimg{
+ width: 450px;
+ }
+}
+
+@media (max-width: 985px) {
+ .card {
+ width: 400px;
+ }
+ .cardimg{
+ width: 400px;
+ }
+}
+
+@media (max-width: 885px) {
+ .card {
+ width: 300px;
+ }
+ .cardimg{
+ width: 300px;
+ }
+}
+
+@media (max-width: 687px) {
+ .card {
+ width: 100%;
+ }
+ .cardimg{
+ width: 100%;
+ }
+}
+
+
+@media screen and (max-width: 600px) {
+ table {
+ border: 0;
+ }
+
+ table caption {
+ font-size: 1.3em;
+ }
+
+ table thead {
+ border: none;
+ clip: rect(0 0 0 0);
+ height: 1px;
+ margin: -1px;
+ overflow: hidden;
+ padding: 0;
+ position: absolute;
+ width: 1px;
+ }
+
+ table tr {
+ border-bottom: 3px solid #ddd;
+ display: block;
+ margin-bottom: .625em;
+ }
+
+ table td {
+ border-bottom: 1px solid #ddd;
+ display: block;
+ font-size: .8em;
+ text-align: right;
+ }
+
+ table td::before {
+ /*
+ * aria-label has no advantage, it won't be read inside a table
+ content: attr(aria-label);
+ */
+ content: attr(data-label);
+ float: left;
+ font-weight: bold;
+ text-transform: uppercase;
+ }
+
+ table td:last-child {
+ border-bottom: 0;
+ }
+}
+
+@media (max-width: 568px) {
+ .dashboard{
+ display: block !important;
+ }
+
+ .topcardsgroup {
+ display: block;
+ }
+ .topcardsbox{
+ display: block;
+ text-align: center;
+ /* float: ; */
+ display: block !important;
+ width: 100%;
+ padding: 5px;
+ text-align: center;
+ margin: 5px;
+ }
+
+ .navbar-nav{
+ display: none;
+ }
+
+ #side-menu{
+ width: 0;
+ }
+
+ #main{
+ margin-left: 0;
+ }
+}
+
+/* @media (min-width: 568px) {
+ .open-slide{
+ display: none;
+ }
+} */
\ No newline at end of file
diff --git a/UI/dashboard.html b/UI/dashboard.html
new file mode 100644
index 0000000..3d2708a
--- /dev/null
+++ b/UI/dashboard.html
@@ -0,0 +1,237 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Total Sales Record Created
+
+
+
+
+
+ 999
+
+
+
+
+ Total Products Sold
+
+
+
+ 850
+
+
+
+
+ Total Goods Sold Worth
+
+
+
+ $30,322.53
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Google Pixel 2
+The Google Pixel 2 is powered by 1.9GHz octa-core
+Quantity: 3
+Price: $649
+ + +
+
+
+
+
+
+
+
+
+
+ Google Pixel 3
+The Pixel 3 is the latest causality. Wireless charging is..
+Quantity: 3
+Price: $649
+ + +
+
+
+
+
+
+
+
+
+
+ Iphone XS
+The iPhone XS display has rounded corners that...
+Quantity: 3
+Price: $1500
+ + +
+
+
+
+
+
+
+
+
+
+ IPhone X
+The phone comes with a 5.80-inch touchscreen display
+Quantity: 3
+Price: $890
+ + +
+
+
+
+
+
+
+
+
+
+ Google Pixel 2
+The Google Pixel 2 is powered by 1.9GHz octa-core
+Quantity: 3
+Price: $649
+ + +
+
+
+
+
+
+
+
+
+
+ Google Pixel 3
+The Pixel 3 is the latest causality. Wireless charging is..
+Quantity: 3
+Price: $649
+ + +
+
+
+
+
+
+
+
+
+
+ Iphone XS
+The iPhone XS display has rounded corners that...
+Quantity: 3
+Price: $1500
+ + +
+
+
+
+
+
+
+
+
+ IPhone X
+The phone comes with a 5.80-inch touchscreen display
+Quantity: 3
+Price: $890
+ + +
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/UI/img/avatar.png b/UI/img/avatar.png
new file mode 100644
index 0000000..6f16b6b
Binary files /dev/null and b/UI/img/avatar.png differ
diff --git a/UI/img/background.jpg b/UI/img/background.jpg
new file mode 100644
index 0000000..285167a
Binary files /dev/null and b/UI/img/background.jpg differ
diff --git a/UI/img/cart.png b/UI/img/cart.png
new file mode 100644
index 0000000..0b8418c
Binary files /dev/null and b/UI/img/cart.png differ
diff --git a/UI/img/cart1.png b/UI/img/cart1.png
new file mode 100644
index 0000000..eb6d9de
Binary files /dev/null and b/UI/img/cart1.png differ
diff --git a/UI/img/favicon.ico b/UI/img/favicon.ico
new file mode 100644
index 0000000..a8d9515
Binary files /dev/null and b/UI/img/favicon.ico differ
diff --git a/UI/img/gpixel2.jpg b/UI/img/gpixel2.jpg
new file mode 100644
index 0000000..aafb3db
Binary files /dev/null and b/UI/img/gpixel2.jpg differ
diff --git a/UI/img/gpixel3.jpg b/UI/img/gpixel3.jpg
new file mode 100644
index 0000000..cfd4034
Binary files /dev/null and b/UI/img/gpixel3.jpg differ
diff --git a/UI/img/gpixel3r.png b/UI/img/gpixel3r.png
new file mode 100644
index 0000000..0e27bed
Binary files /dev/null and b/UI/img/gpixel3r.png differ
diff --git a/UI/img/iphonex.png b/UI/img/iphonex.png
new file mode 100644
index 0000000..d93d42d
Binary files /dev/null and b/UI/img/iphonex.png differ
diff --git a/UI/img/iphonexs.png b/UI/img/iphonexs.png
new file mode 100644
index 0000000..175e1b0
Binary files /dev/null and b/UI/img/iphonexs.png differ
diff --git a/UI/img/product.jpeg b/UI/img/product.jpeg
new file mode 100644
index 0000000..b87082f
Binary files /dev/null and b/UI/img/product.jpeg differ
diff --git a/UI/img/search.png b/UI/img/search.png
new file mode 100644
index 0000000..93c0d04
Binary files /dev/null and b/UI/img/search.png differ
diff --git a/UI/img/showcase.jpg b/UI/img/showcase.jpg
new file mode 100644
index 0000000..c5dafd8
Binary files /dev/null and b/UI/img/showcase.jpg differ
diff --git a/UI/index.html b/UI/index.html
new file mode 100644
index 0000000..addb972
--- /dev/null
+++ b/UI/index.html
@@ -0,0 +1,32 @@
+
+
+
+
+
+
+
+
+
+ 
+
+
+
+
\ No newline at end of file
diff --git a/UI/js/main.js b/UI/js/main.js
new file mode 100644
index 0000000..5deaea9
--- /dev/null
+++ b/UI/js/main.js
@@ -0,0 +1,104 @@
+'use strict';
+
+const openSlideMenu = () => {
+ document.getElementById('side-menu').style.width = '250px';
+ document.getElementById('main').style.marginLeft = '250px';
+};
+
+
+const closeSlideMenu = () =>{
+ document.getElementById('side-menu').style.width = '0';
+ document.getElementById('main').style.marginLeft = '0';
+};
+
+const addtocart = (nameofproduct, amountofproduct) => {
+ const quantity = document.getElementById('number').value;
+ let product = {};
+ let data = [];
+
+ let previouscartitem = JSON.parse(localStorage.getItem('product'));
+ if (previouscartitem) {
+ data = previouscartitem;
+ amountofproduct = amountofproduct.replace('Price: ', '')
+ product = {
+ id: previouscartitem.id++,
+ productname: nameofproduct,
+ productquantity: quantity,
+ productamount: amountofproduct
+ };
+ data.push(product);
+ } else {
+ amountofproduct = amountofproduct.replace('Price: ', '');
+ product = {
+ id: 1,
+ productname: nameofproduct,
+ productquantity: quantity,
+ productamount: amountofproduct
+ };
+ data.push(product);
+ }
+
+ localStorage.setItem('product', JSON.stringify(data));
+ const totalcartitem = JSON.parse(localStorage.getItem('product'));
+ document.getElementById('shoppingcartlabel').innerHTML = totalcartitem.length;
+showCart(totalcartitem);
+};
+
+// This function shows cart in table format
+const showCart = (data) => {
+ if (data === undefined) {
+ data = JSON.parse(localStorage.getItem('product'));
+ }
+ if (data == null || data == undefined) {
+ let cartmodaldiv = document.getElementById('cartmodaldiv');
+ cartmodaldiv.style.display = 'none';
+ cartmodaldiv.style.backgroundColor = 'white';
+ } else {
+ let cartmodaldiv = document.getElementById('cartmodaldiv');
+ cartmodaldiv.style.display = 'block';
+ let carttablebody = document.getElementById('carttablebody');
+ carttablebody.innerHTML = data.map((val) => {
+ return `
+ Login
+ +Store Manager
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Google Pixel 2
+The Google Pixel 2 is powered by 1.9GHz octa-core
+Quantity: 3
+Price: $649
+ + +
+
+
+
+
+
+
+
+
+
+ Google Pixel 3
+The Pixel 3 is the latest causality. Wireless charging is..
+Quantity: 3
+Price: $649
+ + +
+
+
+
+
+
+
+
+
+
+ Iphone XS
+The iPhone XS display has rounded corners that...
+Quantity: 3
+Price: $1500
+ + +
+
+
+
+
+
+
+
+
+
+ IPhone X
+The phone comes with a 5.80-inch touchscreen display
+Quantity: 3
+Price: $890
+ + +
+
+
+
+
+
+
+
+
+
+ Google Pixel 2
+The Google Pixel 2 is powered by 1.9GHz octa-core
+Quantity: 3
+Price: $649
+ + +
+
+
+
+
+
+
+
+
+
+ Google Pixel 3
+The Pixel 3 is the latest causality. Wireless charging is..
+Quantity: 3
+Price: $649
+ + +
+
+
+
+
+
+
+
+
+
+ Iphone XS
+The iPhone XS display has rounded corners that...
+Quantity: 3
+Price: $1500
+ + +
+
+
+
+
+
+
+
+
+ IPhone X
+The phone comes with a 5.80-inch touchscreen display
+Quantity: 3
+Price: $890
+ + +
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/UI/sales_view.html b/UI/sales_view.html
new file mode 100644
index 0000000..6e24072
--- /dev/null
+++ b/UI/sales_view.html
@@ -0,0 +1,118 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ | Date | +Product | +Amount | +Status | +
|---|---|---|---|
| 04/10/2018 | +iPhone Xs | +$1,190 | +Completed | +
| 04/10/2018 | +Google Pixel 2 | +$790 | +Completed | +
| 07/10/2018 | +iPhone 7 | +$500 | +Completed | +
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/UI/store_attendant_profile.html b/UI/store_attendant_profile.html
new file mode 100644
index 0000000..215a9d3
--- /dev/null
+++ b/UI/store_attendant_profile.html
@@ -0,0 +1,136 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Total Sales Record Created
+
+
+
+
+
+ 999
+
+
+
+
+ Total Products Sold
+
+
+
+ 850
+
+
+
+
+
+ Total Goods Sold Worth
+
+
+
+ $30,322.53
+
+
+
+
+
+
+
+ -
+
- Name: Store Attendant 1 +
- Email: attendant1@gmail.com +
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/UI/view_product_details.html b/UI/view_product_details.html
new file mode 100644
index 0000000..6372b36
--- /dev/null
+++ b/UI/view_product_details.html
@@ -0,0 +1,100 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ -
+
- Product Name: Google Pixel 2 +
- Description: The Google Pixel 2 is powered by 1.9GHz octa-core processor and it comes with 4GB of RAM. The phone packs 64GB of internal storage that cannot be expanded. +
- Price: $649 +
- Quantity: 3 +