Repacked multiple files with old mui to merge together

frontend/src/views/Welcome.jsx

@@ -1,17 +1,15 @@
 import React, { useState, useEffect } from 'react';
 import ReactGA from 'react-ga4';
 import WelcomeForm2 from "../components/WelcomeForm2.jsx";
-import {
-	Stepper, 
-	Step, 
-	StepLabel, 
-} from '@mui/material';
+import Stepper from "@material-ui/core/Stepper";
+import Step from "@material-ui/core/Step";
+import StepLabel from "@material-ui/core/StepLabel";
 import AppFramework from "../components/AppFramework.jsx";
 import ArrowBackIosIcon from '@mui/icons-material/ArrowBackIos';
 import { 
 	Grid, 
 	Container,
-  Collapse,
+  Fade,
 	Typography, 
 	Paper,
 	Button,
@@ -417,7 +415,7 @@ const Welcome = (props) => {
 										<Typography variant="h6" style={{textAlign: "center", marginBottom: 25, }}>
 											App Framework
 										</Typography>
-										<Collapse>
+										<Fade>
 												<AppFramework
 													inputUsecase={inputUsecase}
 													frameworkData={frameworkData}
@@ -428,20 +426,20 @@ const Welcome = (props) => {
 													isLoggedIn={true}
 													globalUrl={globalUrl}
 													size={0.78}
-													color={theme.palette.platformColor}
+													color={theme.palette.backgroundColor}
 													discoveryWrapper={discoveryWrapper}
 													setDiscoveryWrapper={setDiscoveryWrapper}
 													apps={apps}
 													inputUsecases={usecases}
 													setInputUsecases={setUsecases}
 												/>
-										</Collapse>
+										</Fade>
 									</div>
 								}
 							</Grid>
 						</div>
 						: 
-						<Collapse in={true}>
+						<Fade in={true}>
 							<div style={{maxWidth: 700, margin: "auto", marginTop: 50, }}>
 								{/*
 							<div style={{display:"flex"}}>
@@ -537,7 +535,7 @@ const Welcome = (props) => {
 									</Typography>
 								</div>
 							</div>
-						</Collapse>
+						</Fade>
 					}
 			</div>
    )