Fixes

app.js

@@ -428,6 +428,10 @@ fs.writeFileSync(indexFile, fs.readFileSync(indexFile).toString().replace("___OR
 module.exports = app
 
 // doRender()
-// let manuFile = path.join(__dirname, 'public/original_manuscript.json')
-// let manuObj: OriginalManuscript = JSON.parse(fs.readFileSync(manuFile).toString())
-// modifyFiles(manuObj)
+
+if (process.env.MODIFY_FILES) {
+  let manuFile = path.join(__dirname, 'public/original_manuscript.json')
+  let manuObj = JSON.parse(fs.readFileSync(manuFile).toString())
+  modifyFiles(manuObj)
+  console.log('Sequence Generated')
+}

src/style.css

@@ -10,6 +10,13 @@
   /* Standard */
 }
 
+.text-black-stroke-large {
+  -webkit-text-stroke: 3px black;
+  /* WebKit browsers (Safari, Chrome) */
+  text-stroke: 3px black;
+  /* Standard */
+}
+
 .text-white-fill {
   -webkit-text-fill-color: white;
   /* WebKit browsers (Safari, Chrome) */

src/textWithBgImage/ForegroundGrid.tsx

@@ -52,7 +52,7 @@ function ForegroundGrid(props) {
                     fontSize: '5em',
                     fontFamily: fontFamilyKalam,
                   }}
-                  className={`text-bold text-white text-5xl text-${direction} p-8  bg-opacity-100 rounded-lg text-black-stroke text-red-fill`} >{title}</p>
+                  className={`text-bold text-white text-5xl text-${direction} p-8  bg-opacity-100 rounded-lg text-black-stroke-large text-red-fill`} >{title}</p>
               }
               return (
                 <Animated

src/textWithBgImage/SectionTextWithBG.tsx

@@ -136,7 +136,7 @@ export const SectionTextWithBG: React.FC<SequentialSceneData> = (props) => {
                 >
                     {curSentence.text?.length > 0 && <span
                         key={curSentence.text}
-                        className='tracking-wide text-black-stroke text-red-fill'
+                        className='text-3xl tracking-wide text-black-stroke text-red-fill'
                         style={{
                             // backgroundColor: textBgColor, borderRadius: 10, overflow: 'hidden',
 

src/textWithBgImage/SemibitComposition.tsx

@@ -58,7 +58,7 @@ export const SemibitComposition: React.FC = () => {
 
     let contents: SequentialSceneData[] =
         Script.transcript
-            .slice(0, 2)
+            // .slice(0, 2)
             .map((section) => {
                 var { text, duration, offset, imageAbsPaths, audioFullPath } = section
                 if (!duration)

src/textWithBgImage/SequentialScene.orig.tsx

@@ -42,7 +42,7 @@ function getTransitionScene(scriptItem) {
             >
                 <div className='flex items-center justify-center h-screen' style={{ padding: 10, height: '100%', width: '100%' }} >
 
-                    <p className={`flex items-center justify-center h-screen text-white text-9xl text-center p-8 font-bold rounded-lg text-black-stroke text-red-fill`} style={{
+                    <p className={`flex items-center justify-center h-screen text-white text-9xl text-center p-8 font-bold rounded-lg text-black-stroke-large text-red-fill`} style={{
                         fontFamily: fontFamily
                     }}>{title}</p>
 

src/textWithBgImage/SequentialScene.tsx

@@ -42,7 +42,7 @@ function getTransitionScene(scriptItem) {
             >
                 <div className='flex items-center justify-center h-screen' style={{ padding: 10, height: '100%', width: '100%' }} >
 
-                    <p className={`flex items-center justify-center h-screen text-white text-9xl text-center p-8 font-bold rounded-lg text-black-stroke text-red-fill`} style={{
+                    <p className={`flex items-center justify-center h-screen text-white text-9xl text-center p-8 font-bold rounded-lg text-black-stroke-large text-red-fill`} style={{
                         fontFamily: fontFamily
                     }}>{title}</p>
 
@@ -93,20 +93,20 @@ export const SequentialScene: React.FC = (
                 }
 
 
-                
-{getScene(contents[0])}
 
-{getTransitionScene(contents[1])}
+                {getScene(contents[0])}
 
-{getScene(contents[1])}
+                {getTransitionScene(contents[1])}
 
-{getTransitionScene(contents[2])}
+                {getScene(contents[1])}
 
-{getScene(contents[2])}
+                {getTransitionScene(contents[2])}
 
-{getTransitionScene(contents[3])}
+                {getScene(contents[2])}
 
-{getScene(contents[3])}
+                {getTransitionScene(contents[3])}
+
+                {getScene(contents[3])}