Upload 5.5, 5.6, and 5.7

part5/bloglist-frontend/src/components/Blog.js

@@ -1,9 +1,26 @@
-const Blog = ({ blog }) => (
-  <tr>
-    <td>{blog.title}</td>
-    <td>{blog.author}</td>
-    <td>{blog.url}</td>
-  </tr>
-);
+import Togglable from "./Togglable";
+
+const Blog = ({ blog }) => {
+  const blogStyle = {
+    paddingTop: 10,
+    paddingLeft: 2,
+    border: "solid",
+    borderWidth: 1,
+    marginBottom: 5,
+  };
+  return (
+    <div style={blogStyle}>
+      <div>
+        {blog.title}
+        <Togglable buttonLabel="view">
+          <ul>
+            <li> {blog.author}</li>
+            <li> {blog.url}</li>
+          </ul>
+        </Togglable>
+      </div>
+    </div>
+  );
+};
 
 export default Blog;