Skip to content

E
ecommerce-maven
Commit e048b1e3 authored by Shaphen Pangburn's avatar Shaphen Pangburn
Browse files
Options

[AFP-48 Shaphen Pangburn]: Refactor Product Market bottome border and fix css animations bug

parent d90c9511
Hide whitespace changes
Inline Side-by-side
Showing with 17 additions and 3 deletions
ecom-web/public/index.html
View file @ e048b1e3
...@@ -5,7 +5,11 @@ ...@@ -5,7 +5,11 @@
<meta name="viewport" content="width=device-width, initial-scale=1" /> <meta name="viewport" content="width=device-width, initial-scale=1" />
<!-- allow ajax calls --> <!-- allow ajax calls -->
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<!-- css animations -->
<link
rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css"
/>
<title>Ecommerce App</title> <title>Ecommerce App</title>
</head> </head>
<body> <body>
......
ecom-web/src/components/product-market/product-market.jsx
View file @ e048b1e3
...@@ -30,7 +30,11 @@ export default class ProductMarket extends Component { ...@@ -30,7 +30,11 @@ export default class ProductMarket extends Component {
return ( return (
<div className="product-market-container"> <div className="product-market-container">
<h1 id="product-market-title">Product Market</h1> <div id="product-market-title">
<p>
Product Market
</p>
</div>
<div className="products-container"> <div className="products-container">
{this.props.products.map(prod => { {this.props.products.map(prod => {
return ( return (
......
ecom-web/src/resources/stylesheets/product-market.css
View file @ e048b1e3
...@@ -7,14 +7,20 @@ ...@@ -7,14 +7,20 @@
#product-market-title { #product-market-title {
width: 100%; width: 100%;
display: flex;
justify-content: center;
text-align: center; text-align: center;
font-size: 30px; font-size: 30px;
margin: 15px 0px 10px; margin: 15px 0px 10px;
cursor: default; cursor: default;
border-bottom: 1px solid black;
padding-bottom: 15px; padding-bottom: 15px;
} }
#product-market-title p {
width: 30%;
border-bottom: 1px solid black;
}
.products-container { .products-container {
width: 80%; width: 80%;
display: flex; display: flex;
......
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