Added h1 to article syntax

public/api/articles.json

@@ -4,7 +4,7 @@
             "id": 0,
             "title": "Printing in Python",
             "desc":"How to print to the terminal in python",
-            "contents": "Hello and this is my tutorial on how to print in python3. First you want to open a python interpreter. Next type the following: `print('Hello World')` After that you have printed Hello World to the screen"
+            "contents": "*Introduction* This is my tutorial on how to print in python3. The print function is an easy way to show your users important information, design menus, and more. The print command is simple in it's usage. First you want to open a python interpreter. Next type the following: `print('Hello World')` After that you Hello World printed to the screen. You can check out more articles by scrolling down to the list of articles on this page."
         }
     ]
 }

src/components/Article.js

@@ -4,22 +4,33 @@ import './css/Articles.css';
 
 const Article = ({article}) => {
     let articleFormatter = (text) => {
-        let output = [""];
+        let output = [];
         let type = [];
         let ind = 0;
         let tick=false;
+        let delimiters = ['', '`', '*'];
 
         for (let i = 0; i < text.length; i++) { // Iterate through input
-            if (text[i] === '`') { // Detect Code Delimiter
+            console.log(text[i]);
+            if (delimiters.indexOf(text[i]) !== -1) { // Detect Code Delimiter
+                
                 if (tick) { // Close the code section
-
+                    console.log(1);
                     output[++ind] = ""
                     tick = false;
 
                 } else { // Start a new code section
+                    console.log(2);
+                    type.push(delimiters.indexOf(text[i]));
 
-                    type.push(1);
-                    output[++ind] = ""
+                    if (!output[ind]) {
+                        
+                        output[ind] = "";
+
+                    } else if (output.length < type.length) {
+                        output[++ind] = "";
+                    }
+                    
                     tick = true;
 
                 }
@@ -27,14 +38,22 @@ const Article = ({article}) => {
             } else { // Append text to output
 
                 if (output.length > type.length) { // If this is the beggining of a default text type
+
                     type.push(0);
                     output[ind] = ""
+
                 }
 
+                console.log(3);
+
+
                 output[ind] += text[i]
             }
         }
 
+        console.log(output);
+        console.log(type);
+
         return [...output.keys()].map((i)=>{ // Format text and return as jsx
             
             
@@ -46,7 +65,11 @@ const Article = ({article}) => {
 
                 return <div className="code" key={i}>{output[i]}</div>;
 
-            } else {
+            } else if (type[i] === 2) {
+
+                return <div className="h1" key={i}>{output[i]}</div>;
+
+            }else {
                 return <div key={i}></div>;
             }
         });

src/components/css/Articles.css

@@ -5,16 +5,6 @@
     flex-direction: column;
 }
 
-.article .title {
-    font-size: 32px;
-    margin: 10px;
-}
-
-.article .description {
-    margin: 10px;
-    font-size: 18px;
-}
-
 .article .content {
     width: 80vw;
     text-align:left;
@@ -26,4 +16,11 @@
     color: gray;
     border-radius: 5px;
     margin: 10px;
+}
+
+.article .h1 {
+    font-size: 24px;
+    font-weight:bolder;
+    margin-top: 10px;
+    margin-bottom: 10px;
 }