Commit d4481f05 authored by Shaphen's avatar Shaphen

[AFP-47 Shaphen Pangburn]: Add css reset file in resources to style from scratch

parent 9772c911
import '../../resources/stylesheets/product-market.css';
import '../../resources/stylesheets/reset.css';
import React, { Component } from 'react'
......@@ -35,9 +36,9 @@ export default class ProductMarket extends Component {
<div className="products-container">
{this.props.products.map(prod => {
return (
<div className="product-item" key={ prod.sku }>
<div className="product-item-container" key={ prod.sku }>
{prod.productName ?
<div>
<div className="product-item">
<img id="prod-img" src={ prod.productImageUrl ? prod.productImageUrl : "-no photo-" } />
<p id="prod-name">{ prod.productName }</p>
<p id="prod-description">{ prod.productDescription }</p>
......
......@@ -17,6 +17,22 @@
justify-content: center;
}
.product-item-container {
width: 25%;
}
.product-item {
width: 100%;
display: flex;
flex-wrap: wrap;
justify-content: center;
}
#prod-img {
height: 200px;
}
#prod-name, #prod-description, #prod-price {
width: 100%;
text-align: center;
}
\ No newline at end of file
/* CSS reset */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {
margin:0;
padding:0;
}
html,body {
margin:0;
padding:0;
}
table {
border-collapse:collapse;
border-spacing:0;
}
fieldset,img {
border:0;
}
input{
border:1px solid #b0b0b0;
padding:3px 5px 4px;
color:#979797;
width:190px;
}
address,caption,cite,code,dfn,th,var {
font-style:normal;
font-weight:normal;
}
ol,ul {
list-style:none;
}
caption,th {
text-align:left;
}
h1,h2,h3,h4,h5,h6 {
font-size:100%;
font-weight:normal;
}
q:before,q:after {
content:'';
}
abbr,acronym { border:0;
}
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment