Skip to content

Commit f6cad62

Browse files
committed
created buy now button
1 parent 1f4ffb7 commit f6cad62

File tree

2 files changed

+25
-22
lines changed

2 files changed

+25
-22
lines changed

components/buybutton.js

Lines changed: 24 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -1,33 +1,39 @@
11
import React from 'react';
2-
import PropTypes from 'prop-types';
32
/**
43
*
54
*
65
* @export
7-
* @class buybutton
8-
* @augments {React.PureComponent<buybuttonProps>}
6+
* @class BuyNow
7+
* @augments {React.PureComponent<BuyNowProps>}
98
*/
10-
export default class buybutton extends React.PureComponent {
9+
export default class BuyNow extends React.PureComponent {
1110
/**
12-
* @typedef {object} buybuttonProps
13-
* @property {array} links
14-
*
15-
* @static
16-
* @memberof buybutton
11+
* @typedef {object} BuyNowProps
12+
*
13+
* @static
14+
* @memberof BuyNow
1715
*/
18-
static propTypes = {
19-
links: PropTypes.arrayOf(
20-
PropTypes.shape({
21-
url: PropTypes.string,
22-
title: PropTypes.string,
23-
})
24-
).isRequired,
25-
};
16+
clicked () {
17+
console.log('the button is clicked');
18+
}
19+
2620

2721
render() {
2822
return (
2923
<React.Fragment>
30-
<button>Buy Now</button>
24+
<style jsx>{`
25+
button {
26+
background-color: #e33812;
27+
color: white;
28+
padding: 15px 32px;
29+
text-align: center;
30+
display: inline-block;
31+
font-size: 16px;
32+
border-radius: 12px;
33+
34+
}
35+
`}</style>
36+
<button onClick={this.clicked} >Buy Now</button>
3137
</React.Fragment>
3238
);
3339
}

pages/index.js

Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,6 @@ import React from 'react';
22
import Item from '../components/Item';
33
import NavBar from '../components/NavBar';
44
import links from '../constants/links';
5-
import buybutton from '../components/buybutton';
65

76
/**
87
* Home page
@@ -51,9 +50,7 @@ export default class IndexPage extends React.PureComponent {
5150
<Item id={id} name={name} />
5251
))}
5352
</ul>
54-
<h2>Buy Now Button</h2>
55-
<buybutton/>
56-
</main>
53+
</main>
5754

5855
</React.Fragment>
5956
);

0 commit comments

Comments
 (0)