Update

resources/js/modules/editor/partials/canvas/sample-timeline-data.jsx

@@ -57,7 +57,7 @@ const sampleTimelineElements = [
         startTime: 0,
         layer: 2,
         duration: 4,
-        x: 90,
+        x: 360, // Center horizontally (720/2)
         y: 180,
         fontSize: 40,
         fontWeight: 'bold',
@@ -67,6 +67,9 @@ const sampleTimelineElements = [
         stroke: '#000000',
         strokeWidth: 3,
         rotation: 0,
+        // Add text width properties for consistent rendering
+        fixedWidth: 576, // 80% of 720px canvas width
+        offsetX: 288, // Half of fixedWidth for center alignment
     },
     {
         id: '5',
@@ -75,7 +78,7 @@ const sampleTimelineElements = [
         startTime: 3,
         layer: 3,
         duration: 4,
-        x: 50,
+        x: 360, // Center horizontally (720/2)
         y: 650,
         fontSize: 20,
         fontWeight: 'bold',
@@ -85,6 +88,9 @@ const sampleTimelineElements = [
         stroke: '#ff0000',
         strokeWidth: 2,
         rotation: 0,
+        // Add text width properties for consistent rendering
+        fixedWidth: 576, // 80% of 720px canvas width
+        offsetX: 288, // Half of fixedWidth for center alignment
     },
     {
         id: '6',