Skip to content

2
2023-029
Commit d08eb3ff authored by supundileepa00's avatar supundileepa00
Browse files
Options

feat : Implemented UI main navigation page to convert sign language

parent 97ce69dd
Hide whitespace changes
Inline Side-by-side
Showing with 100 additions and 0 deletions
Project/Frontend/Web_App/src/pages/translate-page.tsx 0 → 100644
View file @ d08eb3ff
// next
import Head from 'next/head';
// @mui
import {
Box,
Button,
ButtonGroup,
Card,
CardContent,
CardHeader,
Divider,
Grid,
} from '@mui/material';
// layouts
import MainLayout from '../layouts/main';
// sections
import {
AboutTranslate,
AboutWhat,
AboutTeam,
AboutVision,
AboutTestimonials,
} from '../sections/slToText';
import { Upload } from 'src/components/upload';
import { useCallback, useState } from 'react';
import UploadIcon from '@mui/icons-material/Upload';
import EmergencyRecordingIcon from '@mui/icons-material/EmergencyRecording';
// ----------------------------------------------------------------------
AboutPage.getLayout = (page: React.ReactElement) => <MainLayout>{page}</MainLayout>;
// ----------------------------------------------------------------------
export default function AboutPage() {
const [file, setFile] = useState<File | string | null>(null);
const handleDropSingleFile = useCallback((acceptedFiles: File[]) => {
const file = acceptedFiles[0];
if (file) {
setFile(
Object.assign(file, {
preview: URL.createObjectURL(file),
})
);
}
}, []);
return (
<>
<Head>
<title>Translate SSL to Text</title>
</Head>
<Box sx={{ flexGrow: 1 }}>
<ButtonGroup disableElevation variant="contained" aria-label="Disabled elevation buttons">
<Button variant="outlined" startIcon={<UploadIcon />}>
Upload
</Button>
<Button variant="contained" endIcon={<EmergencyRecordingIcon />}>
Send
</Button>
</ButtonGroup>
<Card>
<Grid
container
spacing={2}
sx={{
mt: '3%',
px: '1%',
}}
>
<Grid item xs={12} md={6}>
<Card>
<CardHeader title="Upload a video containing Sign Language" />
<CardContent>
<Upload
file={file}
onDrop={handleDropSingleFile}
onDelete={() => setFile(null)}
/>
</CardContent>
</Card>
</Grid>
<Grid item xs={12} md={6}>
<Card>
<CardHeader title="Upload a video containing Sign Language" />
<CardContent>
<Upload
file={file}
onDrop={handleDropSingleFile}
onDelete={() => setFile(null)}
/>
</CardContent>
</Card>
</Grid>
</Grid>
</Card>
</Box>
</>
);
}
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