Commit 97219edf authored by Paranagama R.P.S.D.'s avatar Paranagama R.P.S.D.

fix : UI Issues

parent 1ab89cbd
...@@ -163,7 +163,7 @@ const Process = () => { ...@@ -163,7 +163,7 @@ const Process = () => {
padding: 2 padding: 2
}} }}
> >
<ButtonGroup disableElevation variant="contained" aria-label="Disabled elevation buttons"> <ButtonGroup disableElevation variant="contained" aria-label="Disabled elevation buttons" sx={{ marginBottom: '10px' }}>
<Button <Button
variant={checkTranalationTypeForUpload()} variant={checkTranalationTypeForUpload()}
startIcon={<CloudUploadOutlined />} startIcon={<CloudUploadOutlined />}
...@@ -190,14 +190,14 @@ const Process = () => { ...@@ -190,14 +190,14 @@ const Process = () => {
<CardHeader title="Upload a video containing Sign Language" /> <CardHeader title="Upload a video containing Sign Language" />
<Grid container spacing={2}> <Grid container spacing={2}>
<Grid item xs={12} md={6}> <Grid item xs={12} md={6}>
<Card> <Card sx={{ marginBottom: '10px', marginLeft: '10px' }}>
<CardContent> <CardContent>
{/* ! Important */} {/* ! Important */}
{/* @ts-ignore */} {/* @ts-ignore */}
<MuiFileInput value={file} onChange={handleDropSingleFile} /> <MuiFileInput value={file} onChange={handleDropSingleFile} inputProps={{ accept: 'video/*' }} />
{file && ( {/* {file && (
<Paper style={{ padding: '20px' }}> <Paper style={{ padding: '20px' }}>
<Typography variant="h5" align="center" gutterBottom> <Typography variant="h5" align="center" gutterBottom>
Preview Preview
...@@ -206,12 +206,20 @@ const Process = () => { ...@@ -206,12 +206,20 @@ const Process = () => {
<video src={videoUrl} width="400" controls /> <video src={videoUrl} width="400" controls />
</div> </div>
</Paper> </Paper>
)} )} */}
<Paper style={{ padding: '20px', marginTop: '15px' }}>
<Typography variant="h5" align="center" gutterBottom>
Preview
</Typography>
<div style={{ marginTop: '20px', textAlign: 'center' }}>
{file ? <video src={videoUrl} width="400" controls /> : <p>No Video Selected ...</p>}
</div>
</Paper>
</CardContent> </CardContent>
</Card> </Card>
</Grid> </Grid>
<Grid item xs={12} md={6}> <Grid item xs={12} md={6}>
<Card sx={{ p: 5, minHeight: 300 }}> <Card sx={{ p: 5, minHeight: 300, marginBottom: '10px', marginRight: '10px' }}>
<Box display="grid" gap={5}> <Box display="grid" gap={5}>
<Stack spacing={2}> <Stack spacing={2}>
<Grid container spacing={2}> <Grid container spacing={2}>
...@@ -295,7 +303,7 @@ const Process = () => { ...@@ -295,7 +303,7 @@ const Process = () => {
<Grid container spacing={2}> <Grid container spacing={2}>
{/* Paste Here */} {/* Paste Here */}
<Grid item xs={12} md={6}> <Grid item xs={12} md={6}>
<Card> <Card sx={{ marginBottom: '10px', marginLeft: '10px' }}>
<CardContent> <CardContent>
<WebcamStreamCapture onVideoRecorded={handleVideoRecorded} /> <WebcamStreamCapture onVideoRecorded={handleVideoRecorded} />
</CardContent> </CardContent>
...@@ -309,7 +317,7 @@ const Process = () => { ...@@ -309,7 +317,7 @@ const Process = () => {
</Card> </Card>
</Grid> </Grid>
<Grid item xs={12} md={6}> <Grid item xs={12} md={6}>
<Card sx={{ p: 5, minHeight: 300 }}> <Card sx={{ p: 5, minHeight: 300, marginBottom: '10px', marginRight: '10px' }}>
<Box display="grid" gap={5}> <Box display="grid" gap={5}>
<Stack spacing={2}> <Stack spacing={2}>
<Grid container spacing={2}> <Grid container spacing={2}>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment