fix: more various bug and issues

front/components/Objects/Editor/Editor.tsx

@@ -348,6 +348,42 @@ export const EditorContentWrapper = styled.div`
   // disable chrome outline
 
   .ProseMirror {
+
+    h1 {
+      font-size: 30px;  
+      font-weight: 600;
+      margin-top: 10px;
+      margin-bottom: 10px;
+    }
+
+    h2 {
+      font-size: 25px;
+      font-weight: 600;
+      margin-top: 10px;
+      margin-bottom: 10px;
+    }
+
+    h3 {
+      font-size: 20px;
+      font-weight: 600;
+      margin-top: 10px;
+      margin-bottom: 10px;
+    }
+
+    h4 {
+      font-size: 18px;
+      font-weight: 600;
+      margin-top: 10px;
+      margin-bottom: 10px;
+    }
+
+    h5 {
+      font-size: 16px;
+      font-weight: 600;
+      margin-top: 10px;
+      margin-bottom: 10px;
+    }
+
     padding-left: 20px;
     padding-right: 20px;
     padding-bottom: 20px;

front/components/Objects/Loaders/PageLoading.tsx

@@ -1,8 +1,24 @@
-import React from 'react'
+'use client';
+import { motion } from "framer-motion";
+
+const variants = {
+    hidden: { opacity: 0, x: 0, y: 0 },
+    enter: { opacity: 1, x: 0, y: 0 },
+    exit: { opacity: 0, x: 0, y: 0 },
+  };
 
 function PageLoading() {
+    
     return (
-        <div className="max-w-7xl mx-auto px-4 py-20">
+        <motion.main
+        variants={variants} // Pass the variant object into Framer Motion
+        initial="hidden" // Set the initial state to variants.hidden
+        animate="enter" // Animated state to variants.enter
+        exit="exit" // Exit state (used later) to variants.exit
+        transition={{ type: "linear" }} // Set the transition to linear
+        className=""
+      >
+        <div className="max-w-7xl mx-auto px-4 py-20 transition-all">
             <div className="animate-pulse mx-auto flex space-x-4">
                 <svg className="mx-auto" width="295" height="295" viewBox="0 0 295 295" fill="none" xmlns="http://www.w3.org/2000/svg">
                     <rect opacity="0.51" x="6.5" y="6.5" width="282" height="282" rx="78.5" stroke="#454545" strokeOpacity="0.46" stroke-width="13" stroke-dasharray="11 11" />
@@ -10,6 +26,7 @@ function PageLoading() {
                 </svg>
             </div>
         </div>
+        </motion.main>
     )
 }
 

front/components/StyledElements/Wrappers/GeneralWrapper.tsx

@@ -3,6 +3,7 @@ function GeneralWrapperStyled({ children }: { children: React.ReactNode }) {
     return (
         <div
             className='max-w-screen-2xl mx-auto px-16 py-5 tracking-tight'
+            
         >{children}</div>
     )
 }