Skip to content

Commit

Permalink
🔨 Link pages together
Browse files Browse the repository at this point in the history
  • Loading branch information
ebenezerdon committed Oct 12, 2018
1 parent daa7281 commit 7077acc
Show file tree
Hide file tree
Showing 10 changed files with 156 additions and 33 deletions.
25 changes: 25 additions & 0 deletions UI/assets/css/product-item.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,25 @@
@import "lib/nav.css";
@import "lib/footer.css";
@import "userdashboard.css";

figcaption button {
border: 1px solid #262734;
border-radius: 3px;
color: #fff;
font-weight: 2em;
padding: 1em 3em;
margin: 1em 0 0 0;
margin-top: -3px;
background: #262734;
cursor: pointer;
transition: background ease-in 0.25s;
}

main {
margin-top: 1px;
}

.product h1 {
margin-top: -15px;
color: #262734;
}
16 changes: 16 additions & 0 deletions UI/assets/css/products.css
Original file line number Diff line number Diff line change
Expand Up @@ -71,4 +71,20 @@ body {
background: darkgreen;
height: 400px;
width: 350px;
}

.hover-effect a {
transition: all 250ms ease-in;
-webkit-transition: all 250ms ease-in;
-moz-transition: all 250ms ease-in;
-ms-transition: all 250ms ease-in;
-o-transition: all 250ms ease-in;
}

.hover-effect a:hover {
transform: scale(1.1);
-webkit-transform: scale(1.1);
-moz-transform: scale(1.1);
-ms-transform: scale(1.1);
-o-transform: scale(1.1);
}
2 changes: 2 additions & 0 deletions UI/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,8 @@
<div class="logo">
<img src="assets/images/logo.png" alt="">
</div>
<a href="userdashboard.html"><i class="far fa-user-circle"></i></a>
<a href="admindashboard.html"><i class="far fa-user-circle"></i></a>
</div>
<div class="nav-2">
<div class="user-select">
Expand Down
3 changes: 2 additions & 1 deletion UI/pages/adduser.html
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,8 @@
<div class="logo">
<a href="../index.html"><img src="../assets/images/logo.png" alt=""></a>
</div>
<a href="#"><i class="far fa-user-circle"></i></a>
<a href="userdashboard.html"><i class="far fa-user-circle"></i></a>
<a href="admindashboard.html"><i class="far fa-user-circle"></i></a>
<a href="#"><i class="far fa-bell"></i></a>
<p>Hello, <span id="name">Josh</span></p>
</div>
Expand Down
11 changes: 6 additions & 5 deletions UI/pages/admindashboard.html
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,8 @@
<div class="logo">
<a href="../index.html"><img src="../assets/images/logo.png" alt=""></a>
</div>
<a href="#"><i class="far fa-user-circle"></i></a>
<a href="userdashboard.html"><i class="far fa-user-circle"></i></a>
<a href="admindashboard.html"><i class="far fa-user-circle"></i></a>
<a href="#"><i class="far fa-bell"></i></a>
<p>Hello, <span id="name">Josh</span></p>
</div>
Expand Down Expand Up @@ -60,19 +61,19 @@ <h4>Store Admin</h4>
<div class="product-item tp">
<h3>Top Products</h3>
<div class="t-products">
<a href="poduct-item.html">
<a href="product-item.html">
<img src='https://ng.jumia.is/qxwMx1cu74re-mnYWp7oKy5k_QI=/fit-in/680x680/filters:fill(white):sharpen(1,0,false):quality(100)/product/66/961471/1.jpg?5807'
width='300'>
</a>
<a href="poduct-item.html">
<a href="product-item.html">
<img src='https://ng.jumia.is/7DGBgs3FfNyqFY8UnZqshKvMLRY=/fit-in/680x680/filters:fill(white):sharpen(1,0,false):quality(100)/product/53/78896/1.jpg?0343'
width='300'>
</a>
<a href="poduct-item.html">
<a href="product-item.html">
<img src='https://ng.jumia.is/WF4k7gSwnJojumFJSjXWgaFhexU=/fit-in/680x680/filters:fill(white):sharpen(1,0,false):quality(100)/product/90/01116/1.jpg?1536'
width='300'>
</a>
<a href="poduct-item.html">
<a href="product-item.html">
<img src='https://ng.jumia.is/c0tn9yqz_NVdz02I4xJnHEOjoGQ=/fit-in/680x680/filters:fill(white):sharpen(1,0,false):quality(100)/product/36/800791/1.jpg?3368'
width='300'>
</a>
Expand Down
72 changes: 72 additions & 0 deletions UI/pages/product-item.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,72 @@
<!DOCTYPE html>
<html>

<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Add New User</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" media="screen" href="../assets/css/main.css" />
<link rel="stylesheet" href="../assets/css/product-item.css">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.3.1/css/all.css" integrity="sha384-mzrmE5qonljUremFsqc01SB46JvROS7bZs3IO2EmfFsd15uHvIt+Y8vEf7N7fWAU"
crossorigin="anonymous">
<script src="main.js"></script>
</head>

<body>
<header>
<div class="top-nav">
<div class="logo">
<a href="../index.html"><img src="../assets/images/logo.png" alt=""></a>
</div>
<a href="userdashboard.html"><i class="far fa-user-circle"></i></a>
<a href="admindashboard.html"><i class="far fa-user-circle"></i></a>
<a href="#"><i class="far fa-bell"></i></a>
<p>Hello, <span id="name">Josh</span></p>
</div>
<div class="nav-2">
<div class="option-select">
<div class="user-select">
<select>
<option>Dashboard</option>
<option>Products</option>
</select>
</div>
</div>
<div class="wrap">
<div class="search">
<input type="text" class="searchTerm" placeholder="Search">
<button type="submit" class="searchButton">
<div class="icon"><i class="fa fa-search"></i></div>
</button>
</div>
</div>
</div>
</header>

<main>
<div class="row">
<div class='product'>
<h1>Long Sleeve Hooded T Shirt- Wine & Grey</h1>
<figure class="profile">
<div class="profile-image"><img src="https://ng.jumia.is/8OQU5DiXVftEqmGAcFd62dHs9T8=/fit-in/680x680/filters:fill(white):sharpen(1,0,false):quality(100)/product/18/08299/1.jpg?3454"
alt="" /></div>
<figcaption>
<h3>Quantity in Inventory</h3>
<h4>53</h4>
<h3>Minimum Product Quantity</h3>
<h4>10</h4>
<h3>Price</h3>
<h4>₦3,300</h4>
<button>Add to cart</button>
</figcaption>
</figure>

</div>
</div>
</main>

<footer></footer>
</body>

</html>
51 changes: 27 additions & 24 deletions UI/pages/products.html
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,8 @@
<div class="logo">
<img src="../assets/images/logo.png" alt="">
</div>
<a href="#"><i class="far fa-user-circle"></i></a>
<a href="userdashboard.html"><i class="far fa-user-circle"></i></a>
<a href="admindashboard.html"><i class="far fa-user-circle"></i></a>
<a href="#"><i class="far fa-bell"></i></a>
<p>Hello, <span id="name">Josh</span></p>
</div>
Expand All @@ -44,72 +45,74 @@
</header>
<div class='row'>
<div class='product'>
<div class='product-item'>
<img src='https://ng.jumia.is/8OQU5DiXVftEqmGAcFd62dHs9T8=/fit-in/680x680/filters:fill(white):sharpen(1,0,false):quality(100)/product/18/08299/1.jpg?3454'
<div class='product-item hover-effect'> <a href="product-item.html"></a>
<a href="product-item.html">
<img src='https://ng.jumia.is/8OQU5DiXVftEqmGAcFd62dHs9T8=/fit-in/680x680/filters:fill(white):sharpen(1,0,false):quality(100)/product/18/08299/1.jpg?3454'
width='300'>
</a>
<p>Long Sleeve Hooded T Shirt- Wine & Grey</p>
<p>₦3,300</p>
<button>Add to cart</button>
</div>
</div>
<div class='product'>
<div class='product-item'>
<img src='https://ng.jumia.is/c0tn9yqz_NVdz02I4xJnHEOjoGQ=/fit-in/680x680/filters:fill(white):sharpen(1,0,false):quality(100)/product/36/800791/1.jpg?3368'
width='300'>
<div class='product-item hover-effect'>
<a href="product-item.html"><img src='https://ng.jumia.is/c0tn9yqz_NVdz02I4xJnHEOjoGQ=/fit-in/680x680/filters:fill(white):sharpen(1,0,false):quality(100)/product/36/800791/1.jpg?3368'
width='300'></a>
<p>Fashion Quality Ankara Fabrics For Women-multi-colour</p>
<p>₦7,108</p>
<button>Add to cart</button>
</div>
</div>
<div class='product'>
<div class='product-item'>
<img src='https://ng.jumia.is/gkBcaHMPWbyFDDINjGTtxNDp3Eo=/fit-in/680x680/filters:fill(white):sharpen(1,0,false):quality(100)/product/48/643331/1.jpg?2411'
width='300'>
<div class='product-item hover-effect'>
<a href="product-item.html"><img src='https://ng.jumia.is/gkBcaHMPWbyFDDINjGTtxNDp3Eo=/fit-in/680x680/filters:fill(white):sharpen(1,0,false):quality(100)/product/48/643331/1.jpg?2411'
width='300'></a>
<p>Breathable Sneakers For Men</p>
<p>₦4,995</p>
<button>Add to cart</button>
</div>
</div>
<div class='product'>
<div class='product-item'>
<img src='https://ng.jumia.is/WF4k7gSwnJojumFJSjXWgaFhexU=/fit-in/680x680/filters:fill(white):sharpen(1,0,false):quality(100)/product/90/01116/1.jpg?1536'
width='300'>
<div class='product-item hover-effect'>
<a href="product-item.html"><img src='https://ng.jumia.is/WF4k7gSwnJojumFJSjXWgaFhexU=/fit-in/680x680/filters:fill(white):sharpen(1,0,false):quality(100)/product/90/01116/1.jpg?1536'
width='300'></a>
<p>Luxe Linient Solution Towels</p>
<p>₦13,550</p>
<button>Add to cart</button>
</div>
</div>
<div class='product'>
<div class='product-item'>
<img src='https://ng.jumia.is/7DGBgs3FfNyqFY8UnZqshKvMLRY=/fit-in/680x680/filters:fill(white):sharpen(1,0,false):quality(100)/product/53/78896/1.jpg?0343'
width='300'>
<div class='product-item hover-effect'>
<a href="product-item.html"><img src='https://ng.jumia.is/7DGBgs3FfNyqFY8UnZqshKvMLRY=/fit-in/680x680/filters:fill(white):sharpen(1,0,false):quality(100)/product/53/78896/1.jpg?0343'
width='300'></a>
<p>Short Sleeve T-shirt - White</p>
<p>₦2,100</p>
<button>Add to cart</button>
</div>
</div>
<div class='product'>
<div class='product-item'>
<img src='https://ng.jumia.is/qyqSl-UxNbxaRmJcSKlmA-4i_Vg=/fit-in/680x680/filters:fill(white):sharpen(1,0,false):quality(100)/product/90/48948/1.jpg?1177'
width='300'>
<div class='product-item hover-effect'>
<a href="product-item.html"><img src='https://ng.jumia.is/qyqSl-UxNbxaRmJcSKlmA-4i_Vg=/fit-in/680x680/filters:fill(white):sharpen(1,0,false):quality(100)/product/90/48948/1.jpg?1177'
width='300'></a>
<p>Drapery Skirt - Green</p>
<p>₦3,422</p>
<button>Add to cart</button>
</div>
</div>
<div class='product'>
<div class='product-item'>
<img src='https://ng.jumia.is/j4wvkDKLbS79Fz_JuwQR-on66q8=/fit-in/680x680/filters:fill(white):sharpen(1,0,false):quality(100)/product/93/69749/1.jpg?4001'
width='300'>
<div class='product-item hover-effect'>
<a href="product-item.html"><img src='https://ng.jumia.is/j4wvkDKLbS79Fz_JuwQR-on66q8=/fit-in/680x680/filters:fill(white):sharpen(1,0,false):quality(100)/product/93/69749/1.jpg?4001'
width='300'></a>
<p>Men's Casual Slim Fit Jeans - Blue</p>
<p>₦9,700</p>
<button>Add to cart</button>
</div>
</div>
<div class='product'>
<div class='product-item'>
<img src='https://ng.jumia.is/qxwMx1cu74re-mnYWp7oKy5k_QI=/fit-in/680x680/filters:fill(white):sharpen(1,0,false):quality(100)/product/66/961471/1.jpg?5807'
width='300'>
<div class='product-item hover-effect'>
<a href="product-item.html"><img src='https://ng.jumia.is/qxwMx1cu74re-mnYWp7oKy5k_QI=/fit-in/680x680/filters:fill(white):sharpen(1,0,false):quality(100)/product/66/961471/1.jpg?5807'
width='300'></a>
<p>Duanxinyv Knee Boot</p>
<p>₦6,390</p>
<button>Add to cart</button>
Expand Down
3 changes: 2 additions & 1 deletion UI/pages/salesrecord.html
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,8 @@
<header>
<div class="top-nav">
<div class="logo">
<a href="../index.html"><img src="../assets/images/logo.png" alt=""></a>
<a href="userdashboard.html"><i class="far fa-user-circle"></i></a>
<a href="admindashboard.html"><i class="far fa-user-circle"></i></a>
</div>
<a href="#"><i class="far fa-user-circle"></i></a>
<a href="#"><i class="far fa-bell"></i></a>
Expand Down
3 changes: 2 additions & 1 deletion UI/pages/userdashboard.html
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,8 @@
<div class="logo">
<a href="../index.html"><img src="../assets/images/logo.png" alt=""></a>
</div>
<a href="#"><i class="far fa-user-circle"></i></a>
<a href="userdashboard.html"><i class="far fa-user-circle"></i></a>
<a href="admindashboard.html"><i class="far fa-user-circle"></i></a>
<a href="#"><i class="far fa-bell"></i></a>
<p>Hello, <span id="name">Josh</span></p>
</div>
Expand Down
3 changes: 2 additions & 1 deletion UI/pages/userlist.html
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,8 @@
<div class="logo">
<a href="../index.html"><img src="../assets/images/logo.png" alt=""></a>
</div>
<a href="#"><i class="far fa-user-circle"></i></a>
<a href="userdashboard.html"><i class="far fa-user-circle"></i></a>
<a href="admindashboard.html"><i class="far fa-user-circle"></i></a>
<a href="#"><i class="far fa-bell"></i></a>
<p>Hello, <span id="name">Josh</span></p>
</div>
Expand Down

0 comments on commit 7077acc

Please sign in to comment.