From f97ae4e4e2c050b7c626d83c39e40dc554247a67 Mon Sep 17 00:00:00 2001
From: Jannat Patel <pateljannat2308@gmail.com>
Date: Fri, 21 Apr 2023 09:58:59 +0530
Subject: [PATCH] feat: adding editorjs

---
 lms/public/css/style.css    | 18 ------------------
 lms/public/js/editor.js     | 10 +++++++---
 lms/www/courses/create.html | 15 ++++++++++++++-
 package.json                |  2 ++
 4 files changed, 23 insertions(+), 22 deletions(-)

diff --git a/lms/public/css/style.css b/lms/public/css/style.css
index 59866468..2302327e 100644
--- a/lms/public/css/style.css
+++ b/lms/public/css/style.css
@@ -1625,20 +1625,6 @@ li {
 	}
 }
 
-[contenteditable="true"] {
-	outline: none;
-	background-color: var(--bg-light-gray);
-	border-radius: var(--border-radius);
-	border: 1px solid var(--gray-300);
-	padding: 0.5rem 0.75rem;
-	color: var(--gray-900);
-}
-
-[contenteditable="true"]:empty:before {
-	content: attr(data-placeholder);
-	color: var(--gray-600);
-}
-
 .course-image-attachment {
 	margin-top: 0.25rem;
 	background-color: var(--bg-light-gray);
@@ -1675,10 +1661,6 @@ li {
 	padding: 0.5rem 0;
 }
 
-.course-card-pills[contenteditable="true"] {
-	box-shadow: none;
-}
-
 .preview {
 	display: flex;
 	align-items: center;
diff --git a/lms/public/js/editor.js b/lms/public/js/editor.js
index 6b30eb64..3f5aaec8 100644
--- a/lms/public/js/editor.js
+++ b/lms/public/js/editor.js
@@ -1,5 +1,9 @@
 import EditorJS from "@editorjs/editorjs";
+import Header from "@editorjs/header";
+import List from "@editorjs/list";
 
-const editor = new EditorJS("body");
-
-console.log(editor);
+create_editor_for_short_description = () => {
+	let editor = new EditorJS({
+		holder: "course-description",
+	});
+};
diff --git a/lms/www/courses/create.html b/lms/www/courses/create.html
index 63ce961b..d4884716 100644
--- a/lms/www/courses/create.html
+++ b/lms/www/courses/create.html
@@ -31,7 +31,7 @@
                     </div>
                 </div>
                 <div class="">
-                    <input type="text" class="field-input">
+                    <div type="text" class="field-input"></div>
                 </div>
             </div>
             <div>
@@ -61,6 +61,19 @@
                 </div>
                 <img>
             </div>
+
+            <div>
+                <div class="course-title">
+                    <div class="field-label">
+                        {{ _("Course Description") }}
+                    </div>
+                    <div class="field-description">
+                        {{ _("Add a detailed description") }}
+                    </div>
+                </div>
+                <input id="course-description" class="field-input">
+            </div>
+
         </div>
     </div>
 </main>
diff --git a/package.json b/package.json
index c690a31a..7f3e41ff 100644
--- a/package.json
+++ b/package.json
@@ -21,6 +21,8 @@
   "dependencies": {
     "@4tw/cypress-drag-drop": "^2",
     "@cypress/code-coverage": "^3",
+    "@editorjs/header": "^2.7.0",
+    "@editorjs/list": "^1.8.0",
     "@testing-library/cypress": "^8",
     "@testing-library/dom": "8.17.1",
     "cypress-real-events": "^1.7.6"