j-harishankar
diff --git a/‎extension/marked.min.js‎
Lines changed: 161 additions & 0 deletions b/‎extension/marked.min.js‎
Lines changed: 161 additions & 0 deletions
diff --git a/‎extension/popup.css‎
Lines changed: 32 additions & 0 deletions b/‎extension/popup.css‎
Lines changed: 32 additions & 0 deletions
diff --git a/‎extension/popup.html‎
Lines changed: 7 additions & 32 deletions b/‎extension/popup.html‎
Lines changed: 7 additions & 32 deletions
diff --git a/‎extension/popup.js‎
Lines changed: 5 additions & 4 deletions b/‎extension/popup.js‎
Lines changed: 5 additions & 4 deletions
diff --git a/‎leetcode_backend/api/__pycache__/__init__.cpython-313.pyc‎
9 Bytes b/‎leetcode_backend/api/__pycache__/__init__.cpython-313.pyc‎
9 Bytes
diff --git a/‎leetcode_backend/api/__pycache__/admin.cpython-313.pyc‎
9 Bytes b/‎leetcode_backend/api/__pycache__/admin.cpython-313.pyc‎
9 Bytes
diff --git a/‎leetcode_backend/api/__pycache__/apps.cpython-313.pyc‎
9 Bytes b/‎leetcode_backend/api/__pycache__/apps.cpython-313.pyc‎
9 Bytes
diff --git a/‎leetcode_backend/api/__pycache__/models.cpython-313.pyc‎
9 Bytes b/‎leetcode_backend/api/__pycache__/models.cpython-313.pyc‎
9 Bytes
diff --git a/‎leetcode_backend/api/__pycache__/urls.cpython-313.pyc‎
9 Bytes b/‎leetcode_backend/api/__pycache__/urls.cpython-313.pyc‎
9 Bytes
diff --git a/‎leetcode_backend/api/__pycache__/views.cpython-313.pyc‎
9 Bytes b/‎leetcode_backend/api/__pycache__/views.cpython-313.pyc‎
9 Bytes
@@ -0,0 +1,32 @@
+body {
+    font-family: Arial, sans-serif;
+    padding: 10px;
+    width: 300px;
+}
+
+h3 {
+    margin-top: 0;
+}
+
+#getHelp {
+    padding: 10px;
+    background: #4CAF50;
+    color: white;
+    border: none;
+    width: 100%;
+    border-radius: 5px;
+    cursor: pointer;
+    margin-bottom: 10px;
+}
+
+#output {
+    white-space: pre-wrap;
+}
+
+ul {
+    padding-left: 20px;
+}
+
+li {
+    margin-bottom: 5px;
+}
@@ -1,44 +1,19 @@
 <!DOCTYPE html>
 <html>
+
 <head>
   <title>LeetCode Helper</title>
-  <style>
-    body {
-      font-family: Arial, sans-serif;
-      padding: 10px;
-      width: 300px;
-    }
-
-    h3 {
-      margin-top: 0;
-    }
-
-    #getHelp {
-      padding: 10px;
-      background: #4CAF50;
-      color: white;
-      border: none;
-      width: 100%;
-      border-radius: 5px;
-      cursor: pointer;
-      margin-bottom: 10px;
-    }
-
-    ul {
-      padding-left: 20px;
-    }
-
-    li {
-      margin-bottom: 5px;
-    }
-  </style>
+  <link rel="stylesheet" href="popup.css">
+  <script src="marked.min.js"></script><!--Markdown display package-->
 </head>
+
 <body>
   <h3>Need Help with LeetCode?</h3>
   <button id="getHelp">Get Step-by-Step Help</button>
 
-  <ul id="output"></ul> <!-- This is where the guided steps will appear -->
+  <div id="output"></div><!-- This is where the guided steps will appear -->
 
   <script src="popup.js"></script>
 </body>
-</html>
+
+</html>
@@ -24,13 +24,14 @@ document.getElementById("getHelp").addEventListener("click", async () => {
     output.innerHTML = "";
 
     if (data.steps && Array.isArray(data.steps)) {
-      data.steps.forEach((step, index) => {
-        const li = document.createElement("li");
-        li.textContent = step;
-        output.appendChild(li);
+      data.steps.forEach((step) => {
+        const div = document.createElement("div");
+        div.innerHTML = marked.parse(step); // Using Marked package
+        output.appendChild(div);
       });
     } else {
       output.innerHTML = "<p>No steps found.</p>";
     }
+
   });
 });