Skip to content

Commit

Permalink
ch[#161861252] connect products to api
Browse files Browse the repository at this point in the history 
Refactor code to enable products list display as flex row
  • Loading branch information
@ebenezerdon
ebenezerdon committed Nov 10, 2018
1 parent 0e465b9 commit a27820a
Show file tree
Hide file tree
Showing 2 changed files with 6 additions and 97 deletions.
9 changes: 5 additions & 4 deletions UI/assets/js/products.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,12 +7,12 @@ const getProducts = () => {
})
.then(res => res.json())
.then((data) => {
let output = null;
let output;
data.forEach((user) => {
console.log(user.productimage);
output += `
output = `
<div class='product'>
<div class = 'product-item hover-effect'>
<div class='product-item hover-effect'>
<a href="product-item.html">
<img src=${user.productimage} width='300'>
</a>
Expand All @@ -24,8 +24,9 @@ const getProducts = () => {
<div>
</div>
`;
document.getElementById('products-list').innerHTML += output;
});
document.getElementById('products-list').innerHTML = output;
document.getElementById('products-list').innerHTML += '<div class="footer"></div>';
});
};

Expand Down
94 changes: 1 addition & 93 deletions UI/pages/products.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -45,99 +45,7 @@
</div>
</header>

<div class='row' id="products-list">
<div class='product'>
<div class='product-item hover-effect'>
<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>
<a href="product-item.html">
<p>Long Sleeve Hooded T Shirt- Wine & Grey</p>
<p>₦3,300</p>
</a>
<button>Add to cart</button>
</div>
</div>
<div class='product'>
<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>
<a href="product-item.html">
<p>Fashion Quality Ankara Fabrics For Women-multi-colour</p>
<p>₦7,108</p>
</a>
<button>Add to cart</button>
</div>
</div>
<div class='product'>
<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>
<a href="product-item.html">
<p>Breathable Sneakers For Men</p>
<p>₦4,995</p>
</a>
<button>Add to cart</button>
</div>
</div>
<div class='product'>
<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>
<a href="product-item.html">
<p>Luxe Linient Solution Towels</p>
</a>
<p>₦13,550</p>
<button>Add to cart</button>
</div>
</div>
<div class='product'>
<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>
<a href="product-item.html">
<p>Short Sleeve T-shirt - White</p>
<p>₦2,100</p>
</a>
<button>Add to cart</button>
</div>
</div>
<div class='product'>
<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>
<a href="product-item.html">
<p>Drapery Skirt - Green</p>
<p>₦3,422</p>
</a>
<button>Add to cart</button>
</div>
</div>
<div class='product'>
<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>
<a href="product-item.html">
<p>Men's Casual Slim Fit Jeans - Blue</p>
<p>₦9,700</p>
</a>
<button>Add to cart</button>
</div>
</div>
<div class='product'>
<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>
<a href="product-item.html">
<p>Duanxinyv Knee Boot</p>
<p>₦6,390</p>
</a>
<button>Add to cart</button>
</div>
</div>
<div class="footer"></div>
</div>
<div class='row' id="products-list"></div>

<script type="text/javascript" src="../assets/js/products.js"></script>

Expand Down

0 comments on commit a27820a

Please sign in to comment.