aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorIbrahim Mkusa <ibrahimmkusa@gmail.com>2023-04-26 19:57:58 -0400
committerIbrahim Mkusa <ibrahimmkusa@gmail.com>2023-04-26 19:57:58 -0400
commitb87aa3654e9ab5fbb88f8dd108d67531d3a43bef (patch)
tree4c56c3915aef67c4de6af1ab8cb3188c832769f4
parentf4ab316389d8a8238a539668fdfef25e7b27e27f (diff)
ex1.11 use <table> <td> <tr> elements to neatly format our output
-rw-r--r--part1/unicafe/src/App.js8
1 files changed, 5 insertions, 3 deletions
diff --git a/part1/unicafe/src/App.js b/part1/unicafe/src/App.js
index d2ef92b..edc1e63 100644
--- a/part1/unicafe/src/App.js
+++ b/part1/unicafe/src/App.js
@@ -10,7 +10,9 @@ const Button = (props) => {
const StatisticLine = (props) => {
return (
- <p>{props.text} {props.count}</p>
+ <tr>
+ <td>{props.text}</td><td>{props.count}</td>
+ </tr>
)
}
@@ -27,14 +29,14 @@ const Statistics = (props) => {
const average = (good - bad) / 9.0
const positive_percent = (good/total) * 100
return (
- <>
+ <table>
<StatisticLine text="good" count={good} />
<StatisticLine text="neutral" count={bad} />
<StatisticLine text="bad" count={bad} />
<StatisticLine text="all" count={total} />
<StatisticLine text="average" count={average} />
<StatisticLine text="positive(%)" count={positive_percent} />
- </>
+ </table>
)
}