UI revamp and add download button

This commit is contained in:
Joel Mathew Thomas
2025-03-18 16:38:06 +05:30
parent 8b4d373b6a
commit c64dc1aafa
+8 -10
View File
@@ -84,7 +84,7 @@ function ResultsPage() {
<audio <audio
ref={mediaFileRef} ref={mediaFileRef}
src={mediaFile.url} src={mediaFile.url}
style={{ width: '100%' }} style={{ width: '100%', borderRadius: '8px', boxShadow: '0 2px 10px rgba(0,0,0,0.2)' }}
controls controls
/> />
</Box> </Box>
@@ -103,7 +103,7 @@ function ResultsPage() {
<audio <audio
ref={audioRefs[index]} ref={audioRefs[index]}
src={file.url} src={file.url}
style={{ width: '100%' }} style={{ width: '100%', borderRadius: '8px', boxShadow: '0 2px 10px rgba(0,0,0,0.2)' }}
controls controls
/> />
</Box> </Box>
@@ -123,7 +123,7 @@ function ResultsPage() {
<audio <audio
ref={audioRefs[0]} ref={audioRefs[0]}
src={downloadedFileURL} src={downloadedFileURL}
style={{ width: '100%' }} style={{ width: '100%', borderRadius: '8px', boxShadow: '0 2px 10px rgba(0,0,0,0.2)' }}
controls controls
/> />
</Box> </Box>
@@ -156,20 +156,18 @@ function ResultsPage() {
mt: 4, mt: 4,
display: 'flex', display: 'flex',
justifyContent: 'space-between', justifyContent: 'space-between',
gap: 2, // Adds spacing between buttons gap: 2,
flexWrap: 'wrap', // Ensures better behavior on smaller screens flexWrap: 'wrap',
}} }}
> >
<Button variant="outlined" color="primary" onClick={() => navigate('/upload')}> <Button variant="outlined" color="primary" onClick={() => navigate('/upload')}>
Process Another File Process Another File
</Button> </Button>
<Button variant="contained" color="primary" onClick={() => navigate('/')}> <Button variant="contained" color="primary" onClick={() => navigate('/')}>Download All Files</Button>
Back to Home </Box>
</Button>
</Box>
</Paper> </Paper>
</Container> </Container>
); );
} }
export default ResultsPage; export default ResultsPage;