UI/admin_view_products.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="A web application that helps store owners manage sales and product inventory records.">
<meta name="keywords" content="Store Manager">
<title>Store Manager | View Products</title>
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.3.1/css/all.css" integrity="sha384-mzrmE5qonljUremFsqc01SB46JvROS7bZs3IO2EmfFsd15uHvIt+Y8vEf7N7fWAU" crossorigin="anonymous">
<link rel="stylesheet" href="css/style.css">
<link rel="icon" type="image/ico" sizes="32x32" href="img/favicon.ico">
</head>
<body>
<nav class="navbar">
<span class="open-slide">
<a href="#" id="openslidemenu" onclick="openSlideMenu()">
<svg width="30" height="30">
<path d="M0,5 30,5" stroke="#ffffff"
stroke-width="5"/>
<path d="M0,14 30,14" stroke="#ffffff"
stroke-width="5"/>
<path d="M0,23 30,23" stroke="#ffffff"
stroke-width="5"/>
</svg>
</a></span>
<ul>
<li><a href="store_attendant_profile.html" style="padding-top: 10px"><div><img id="userimg" src="../uploads/users/default-avatar.png"> </div></a></li>
<li><a href="#"><div></div><input class="search" placeholder="Search Products" type="text"> <img id="searchimg" src="img/search.png"> </div></a></li>
<li id="appnameli"><a href="dashboard.html"><h1 id="appname"><span class="highlight">Store</span> Manager</h1></a></li>
</ul>
</nav>
<div id="side-menu" class="side-nav">
<a href="#" class="btn-close" onclick="closeSlideMenu()">×</a>
<li><a class="dashboard" href="dashboard.html">Dashboard</a></li>
<li><a href="admin_create_product.html">Create Product</a></li>
<li class="current" ><a href="admin_view_products.html">View Products</a></li>
<li><a href="admin_create_sales_attendant.html">Create Sales Attendant</a></li>
<li><a href="admin_view_sales.html">View Sales</a></li>
<li><a href="admin_asign_product_to_category.html">Assign Products</a></li>
<li><a href="index.html">Logout</a></li>
</div>
<div id="main">
<section id="productsection" class="topmargin">
<div class="container">
<div class="cardgroup">
<div class="card">
<a href="view_product_details.html"><img src="img/gpixel2.jpg" class="cardimg"></a>
<div class="text-center cardbody" >
<h3 id="productname" data-name="Google Pixel 2">Google Pixel 2</h3>
<p>The Google Pixel 2 is powered by 1.9GHz octa-core </p>
<p>Quantity: 3</p>
<p id="productamount">Price: $649</p>
<button class="button_1"><a href="admin_edit_product.html">EDIT</a></button>
<button class="button_2" onclick="confirm('Are you sure you want to delete this product')">DELETE</button>
</div>
</div>
<div class="card">
<a href="view_product_details.html"><img src="img/gpixel3r.png" class="cardimg"></a>
<div class="text-center cardbody" >
<h3 id="productname" data-name="Google Pixel 2">Google Pixel 3</h3>
<p>The Pixel 3 is the latest causality. Wireless charging is.. </p>
<p>Quantity: 3</p>
<p id="productamount">Price: $649</p>
<button class="button_1"><a href="admin_edit_product.html">EDIT</a></button>
<button class="button_2" onclick="confirm('Are you sure you want to delete this product')">DELETE</button>
</div>
</div>
<div class="card">
<a href="view_product_details.html"><img src="img/iphonexs.png" class="cardimg"></a>
<div class="text-center cardbody" >
<h3 id="productname" data-name="Google Pixel 2">Iphone XS</h3>
<p>The iPhone XS display has rounded corners that... </p>
<p>Quantity: 3</p>
<p id="productamount">Price: $1500</p>
<button class="button_1"><a href="admin_edit_product.html">EDIT</a></button>
<button class="button_2" onclick="confirm('Are you sure you want to delete this product')">DELETE</button>
</div>
</div>
<div class="card">
<a href="view_product_details.html"><img src="img/iphonex.png" class="cardimg"></a>
<div class="text-center cardbody" >
<h3 id="productname" data-name="Google Pixel 2">IPhone X</h3>
<p>The phone comes with a 5.80-inch touchscreen display </p>
<p>Quantity: 3</p>
<p id="productamount">Price: $890</p>
<button class="button_1"><a href="admin_edit_product.html">EDIT</a></button>
<button class="button_2" onclick="confirm('Are you sure you want to delete this product')">DELETE</button>
</div>
</div>
<div class="card">
<a href="view_product_details.html"><img src="img/gpixel2.jpg" class="cardimg"></a>
<div class="text-center cardbody">
<h3 id="productname" data-name="Google Pixel 2">Google Pixel 2</h3>
<p>The Google Pixel 2 is powered by 1.9GHz octa-core </p>
<p>Quantity: 3</p>
<p id="productamount">Price: $649</p>
<button class="button_1"><a href="admin_edit_product.html">EDIT</a></button>
<button class="button_2" onclick="confirm('Are you sure you want to delete this product')">DELETE</button>
</div>
</div>
<div class="card">
<a href="view_product_details.html"><img src="img/gpixel3r.png" class="cardimg"></a>
<div class="text-center cardbody" >
<h3 id="productname" data-name="Google Pixel 2">Google Pixel 3</h3>
<p>The Pixel 3 is the latest causality. Wireless charging is.. </p>
<p>Quantity: 3</p>
<p id="productamount">Price: $649</p>
<button class="button_1"><a href="admin_edit_product.html">EDIT</a></button>
<button class="button_2" onclick="confirm('Are you sure you want to delete this product')">DELETE</button>
</div>
</div>
<div class="card">
<a href="view_product_details.html"><img src="img/iphonexs.png" class="cardimg"></a>
<div class="text-center cardbody" >
<h3 id="productname" data-name="Google Pixel 2">Iphone XS</h3>
<p>The iPhone XS display has rounded corners that... </p>
<p>Quantity: 3</p>
<p id="productamount">Price: $1500</p>
<button class="button_1"><a href="admin_edit_product.html">EDIT</a></button>
<button class="button_2" onclick="confirm('Are you sure you want to delete this product')">DELETE</button>
</div>
</div>
<div class="card">
<a href="view_product_details.html"><img src="img/iphonex.png" class="cardimg"></a>
<div class="text-center cardbody" >
<h3 id="productname" data-name="Google Pixel 2">IPhone X</h3>
<p>The phone comes with a 5.80-inch touchscreen display </p>
<p>Quantity: 3</p>
<p id="productamount">Price: $890</p>
<button class="button_1"><a href="admin_edit_product.html">EDIT</a></button>
<button class="button_2" onclick="confirm('Are you sure you want to delete this product')">DELETE</button>
</div>
</div>
</div>
</div>
</section>
</div>
<footer id="footer">
<p>Store Manager Copyright © 2018</p>
</footer>
<script src="js/main.js"></script>
</body>
</html>