feat: Add BlockEditor component for managing block styles and properties in the simulation dashboard.

app/src/components/SimulationDashboard/components/block/BlockEditor.tsx

@@ -305,6 +305,7 @@ const BlockEditor: React.FC<BlockEditorProps> = ({
 
                 <div className="design-section appearance">
                     <div className="section-header">Appearance</div>
+
                     <div className="design-datas-wrapper">
                         {currentBlock.positionType === "absolute" && (
                             <>

app/src/styles/components/simulationDashboard/_simulationDashBoard.scss

@@ -709,18 +709,6 @@
             }
         }
 
-        &.element-editor-panel {
-            right: 20px;
-            top: 50px;
-            // min-width: 300px;
-            max-height: 84vh;
-            overflow: auto;
-
-            max-width: 320px;
-
-            position: fixed;
-            top: 80px;
-            right: 40px;
 
         .appearance {
             .design-datas-wrapper {
@@ -737,6 +725,19 @@
             }
         }
 
+        &.element-editor-panel {
+            right: 20px;
+            top: 50px;
+            // min-width: 300px;
+            max-height: 84vh;
+            overflow: auto;
+
+            max-width: 320px;
+
+            position: fixed;
+            top: 80px;
+            right: 40px;
+
             .swap-button {
                 text-align: center;
                 color: #ccacff;