From 3d277962ff0034ddee9545e833a1b7c1cabd1d7d Mon Sep 17 00:00:00 2001
From: Camerin Figueroa <cam@camcodes.com>
Date: Tue, 2 Nov 2021 13:10:53 -0400
Subject: [PATCH] Added some style to article.js

---
 src/components/Article.js       | 10 +++++-----
 src/components/css/Articles.css | 28 ++++++++++++++++++++++++++++
 2 files changed, 33 insertions(+), 5 deletions(-)

diff --git a/src/components/Article.js b/src/components/Article.js
index c58920e..34b67bc 100644
--- a/src/components/Article.js
+++ b/src/components/Article.js
@@ -46,17 +46,17 @@ const Article = ({article}) => {
                 return <div className="code" key={i}>{output[i]}</div>;
 
             } else {
-                return <div></div>;
+                return <div key={i}></div>;
             }
         });
         
     };
 
     return (
-        <div>
-            <div>{article.title}</div>
-            <div>{article.desc}</div>
-            <div>{articleFormatter(article.contents)}</div>
+        <div className="article">
+            <div className="title">{article.title}</div>
+            <div className="description">{article.desc}</div>
+            <div className="content">{articleFormatter(article.contents)}</div>
         </div>
         );
 }
diff --git a/src/components/css/Articles.css b/src/components/css/Articles.css
index e69de29..47a921d 100644
--- a/src/components/css/Articles.css
+++ b/src/components/css/Articles.css
@@ -0,0 +1,28 @@
+.article {
+    color: white;
+    align-items: center;
+    display: flex;
+    flex-direction: column;
+}
+
+.article .title {
+    font-size: 32px;
+    margin: 10px;
+}
+
+.article .description {
+    margin: 10px;
+    font-size: 18px;
+}
+
+.article .content {
+    width: 80vw;
+}
+
+.article .code {
+    padding: 10px;
+    background-color: #3A3B3B;
+    color: gray;
+    border-radius: 5px;
+    margin: 10px;
+}
\ No newline at end of file