joel/freqsplit
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix styling

Browse Source
This commit is contained in:
Joel Mathew Thomas
2025-03-20 22:27:42 +05:30
parent 895cccd231
commit 7212435ad0
2 changed files with 24 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files
client/src/Pages/ResultsPage.tsx
+11 -5
View File
@@ -62,9 +62,15 @@ function ResultsPage() {
<StepperComponent activeStep={3} /> <StepperComponent activeStep={3} />
<Paper elevation={3} sx={{ p: 4, mt: 4 }}> <Paper elevation={3} sx={{ p: 4, mt: 4 }}>
<Box sx={{ display: 'flex', alignItems: 'center', justifyContent: 'center', mb: 3 }}> <Box sx={{ display: 'flex', alignItems: 'center', justifyContent: 'center', mb: 3, overflow: "auto" }}>
<CheckIcon sx={{ color: 'success.main', fontSize: 36, mr: 1 }} /> <Typography
<Typography variant="h4" color="primary"> variant="h4"
color="primary"
sx={{
textAlign: "center",
width: "100%",
}}
>
Processing Complete! Processing Complete!
</Typography> </Typography>
</Box> </Box>
@@ -77,7 +83,7 @@ function ResultsPage() {
<Box sx={{ display: 'flex', flexDirection: 'column', alignItems: 'center', p: 4, bgcolor: 'rgba(0, 0, 0, 0.04)', borderRadius: 2 }}> <Box sx={{ display: 'flex', flexDirection: 'column', alignItems: 'center', p: 4, bgcolor: 'rgba(0, 0, 0, 0.04)', borderRadius: 2 }}>
<VolumeUpIcon color="primary" sx={{ fontSize: 80, mb: 2 }} /> <VolumeUpIcon color="primary" sx={{ fontSize: 80, mb: 2 }} />
<Typography variant="h6" gutterBottom> <Typography variant="h6" gutterBottom>
{mediaFile.name} (Original) {mediaFile.name}
</Typography> </Typography>
<Box sx={{ width: '100%', mt: 2, mb: 2, border: `1px solid gray`, p:2, borderRadius: 2 }}> <Box sx={{ width: '100%', mt: 2, mb: 2, border: `1px solid gray`, p:2, borderRadius: 2 }}>
<Typography variant="body2" color="textSecondary" sx={{ mb: 1 }}> <Typography variant="body2" color="textSecondary" sx={{ mb: 1 }}>
@@ -96,7 +102,7 @@ function ResultsPage() {
{audioClass === "Music" ? ( {audioClass === "Music" ? (
<> <>
<Box sx={{ width: '100%', mt: 2 }}> <Box sx={{ width: '100%', mt: 2 }}>
<Typography variant="h6" color="textPrimary" sx={{ mb: 1 }}> <Typography variant="h4" color="textPrimary" sx={{ mb: 1 }}>
Processed Files Processed Files
</Typography> </Typography>
</Box> </Box>
client/src/Pages/UploadPage.tsx
+11 -1
View File
@@ -237,6 +237,7 @@ function UploadPage() {
: "transparent", : "transparent",
transition: "all 0.3s ease", transition: "all 0.3s ease",
cursor: "pointer", cursor: "pointer",
overflow: "auto"
}} }}
onDragOver={handleDragOver} onDragOver={handleDragOver}
onDragLeave={handleDragLeave} onDragLeave={handleDragLeave}
@@ -253,7 +254,16 @@ function UploadPage() {
/> />
<CloudUploadIcon color="primary" sx={{ fontSize: 64, mb: 2 }} /> <CloudUploadIcon color="primary" sx={{ fontSize: 64, mb: 2 }} />
<Typography variant="h6" gutterBottom> <Typography
variant="h6"
gutterBottom
sx={{
whiteSpace: "nowrap",
overflow: "hidden",
textOverflow: "ellipsis",
maxWidth: "100%", // Ensure it adapts to the box size
}}
>
{file ? file.name : "Drop your file here or click to browse files"} {file ? file.name : "Drop your file here or click to browse files"}
</Typography> </Typography>
<Typography> <Typography>