- Enhanced responsiveness and layout adjustments across various components

src/features/output/components/OSDFields.tsx

@@ -34,7 +34,7 @@ const OSDFields = ({ isOSDLoading }: OSDFieldsProps) => {
               <OSDFieldToggle key={key} value={key} label={key.replace("include", "Include ")} />
             ))}
           </div>
-          <div className="flex flex-row justify-between">
+          <div className="flex flex-col md:flex-row space-y-4 justify-between">
             <label htmlFor="overlayPosition">Overlay Position</label>
             <Field
               as="select"
@@ -45,7 +45,7 @@ const OSDFields = ({ isOSDLoading }: OSDFieldsProps) => {
               <option value="Bottom">Bottom</option>
             </Field>
           </div>
-          <div className="flex flex-row justify-between">
+          <div className="flex flex-col md:flex-row space-y-4 justify-between">
             <label htmlFor="OSDTimestampFormat">OSD Timestamp Format</label>
             <Field
               as="select"