Styling/ font change cont (#626)

- fixed some font alignments things here and there
- there's a missing variable uncollected for scene generation meta,
fixed it

Co-authored-by: wil <wil@storyteller.ai>

app/components/reusable/ButtonIconSelect/ButtonIconSelect.tsx

@@ -41,9 +41,12 @@ export function ButtonIconSelect({
               ? "border-brand-primary bg-ui-panel/[0.3]"
               : "border-transparent hover:bg-ui-panel/[0.4]",
           )}
-          onClick={() => handleOptionChange(value)}>
+          onClick={() => handleOptionChange(value)}
+        >
           <FontAwesomeIcon icon={icon} />
-          {text && <span className="text-sm font-medium">{text}</span>}
+          {text && (
+            <span className="text-nowrap text-sm font-medium">{text}</span>
+          )}
         </button>
       ))}
     </div>

app/pages/PageEnigma/comps/ControlsTopButtons/ControlsTopButtons.tsx

@@ -31,6 +31,7 @@ import { SceneGenereationMetaData as SceneGenerationMetaData } from "~/pages/Pag
 import {
   cameraAspectRatio,
   cinematic,
+  enginePreProcessing,
   faceDetail,
   globalIPAMediaToken,
   lipSync,
@@ -83,6 +84,7 @@ export const ControlsTopButtons = () => {
         styleStrength: styleStrength.value,
         lipSync: lipSync.value,
         cinematic: cinematic.value,
+        enginePreProcessing: enginePreProcessing.value,
       };
     },
     [],
@@ -150,6 +152,8 @@ export const ControlsTopButtons = () => {
   };
 
   useSignalEffect(() => {
+    //TODO: USE SIGNAL EFFECT SHOULD BE PERFORM ELSEWHERE
+    // WHERE THIS OPERATION IS EXPECTED
     if (!scene.value.isInitializing) {
       setSceneTitleInput(scene.value.title || "");
       const currentLocation = getCurrentLocationWithoutParams(

app/pages/PageEnigma/comps/ControlsVideo/ControlsVideo.tsx

@@ -106,7 +106,7 @@ export const ControlsVideo = () => {
         </div>
         <div className="mr-2 flex items-center gap-1.5 text-sm font-medium">
           <span className="w-[54px]">{formatTime(scrubberTime.value)}</span>
-          <span className="opacity-50">/</span>
+          <span className="pl-2 opacity-50">/</span>
           <span className="w-[54px] opacity-50">
             {formatTime(filmLength.value * 60)}
           </span>