diff --git a/front/components/Objects/Editor/Editor.tsx b/front/components/Objects/Editor/Editor.tsx
index 79b35d47..d101e3d0 100644
--- a/front/components/Objects/Editor/Editor.tsx
+++ b/front/components/Objects/Editor/Editor.tsx
@@ -23,6 +23,9 @@ import QuizBlock from "./Extensions/Quiz/QuizBlock";
import ToolTip from "@components/StyledElements/Tooltip/Tooltip";
import Link from "next/link";
import { getCourseThumbnailMediaDirectory } from "@services/media/media";
+import { OrderedList } from "@tiptap/extension-ordered-list";
+import {ListItem} from '@tiptap/extension-list-item'
+
interface Editor {
content: string;
@@ -80,6 +83,8 @@ function Editor(props: Editor) {
controls: true,
modestBranding: true,
}),
+ OrderedList.configure(),
+
// Register the document with Tiptap
// Collaboration.configure({
// document: props.ydoc,
@@ -404,6 +409,14 @@ export const EditorContentWrapper = styled.div`
display: block;
outline: 0px solid transparent;
}
+
+ ul, ol {
+ padding: 0 1rem;
+ padding-left: 10px;
+ list-style-type: decimal;
+ }
+
+
`;
export default Editor;
diff --git a/front/components/Objects/Editor/Toolbar/ToolbarButtons.tsx b/front/components/Objects/Editor/Toolbar/ToolbarButtons.tsx
index 212a3e54..4df34e3c 100644
--- a/front/components/Objects/Editor/Toolbar/ToolbarButtons.tsx
+++ b/front/components/Objects/Editor/Toolbar/ToolbarButtons.tsx
@@ -1,5 +1,5 @@
import styled from "styled-components";
-import { FontBoldIcon, FontItalicIcon, StrikethroughIcon, ArrowLeftIcon, ArrowRightIcon, OpacityIcon, DividerVerticalIcon } from "@radix-ui/react-icons";
+import { FontBoldIcon, FontItalicIcon, StrikethroughIcon, ArrowLeftIcon, ArrowRightIcon, OpacityIcon, DividerVerticalIcon, ListBulletIcon } from "@radix-ui/react-icons";
import { AlertCircle, AlertTriangle, FileText, GraduationCap, ImagePlus, Info, Sigma, Video, Youtube } from "lucide-react";
import ToolTip from "@components/StyledElements/Tooltip/Tooltip";
@@ -39,6 +39,9 @@ export const ToolbarButtons = ({ editor, props }: any) => {
editor.chain().focus().toggleStrike().run()} className={editor.isActive("strike") ? "is-active" : ""}>
+ editor.chain().focus().toggleOrderedList().run()} className={editor.isActive('orderedList') ? 'is-active' : ''}>
+
+
editor
diff --git a/front/components/Pages/Activities/DynamicCanva/DynamicCanva.tsx b/front/components/Pages/Activities/DynamicCanva/DynamicCanva.tsx
index 1b570d29..5ab24ea7 100644
--- a/front/components/Pages/Activities/DynamicCanva/DynamicCanva.tsx
+++ b/front/components/Pages/Activities/DynamicCanva/DynamicCanva.tsx
@@ -9,6 +9,7 @@ import ImageBlock from "@components/Objects/Editor/Extensions/Image/ImageBlock";
import VideoBlock from "@components/Objects/Editor/Extensions/Video/VideoBlock";
import MathEquationBlock from "@components/Objects/Editor/Extensions/MathEquation/MathEquationBlock";
import PDFBlock from "@components/Objects/Editor/Extensions/PDF/PDFBlock";
+import { OrderedList } from "@tiptap/extension-ordered-list";
interface Editor {
content: string;
@@ -49,6 +50,9 @@ function Canva(props: Editor) {
controls: true,
modestBranding: true,
}),
+
+ OrderedList.configure()
+
],
content: props.content,
@@ -101,6 +105,12 @@ h5 {
margin-bottom: 10px;
}
+ul, ol {
+ padding: 0 1rem;
+ padding-left: 10px;
+ list-style-type: decimal;
+}
+
&:focus {
outline: none !important;