fix: table overflow wrapper specific to upload modal

This commit is contained in:
Anderson Oki 2024-04-17 11:49:58 +09:00
parent b7be8007f2
commit f4e7af47bc
3 changed files with 22 additions and 5 deletions

View File

@ -18,7 +18,7 @@ import {
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import {
Button,
Checkbox,
Checkbox, createStyles,
Divider,
MantineColor,
Stack,
@ -78,12 +78,21 @@ interface Props {
onComplete?: () => void;
}
const useStyles = createStyles((theme) => {
return {
wrapper: {
overflowWrap: "anywhere"
},
};
});
const MovieUploadForm: FunctionComponent<Props> = ({
files,
movie,
onComplete,
}) => {
const modals = useModals();
const { classes } = useStyles();
const profile = useLanguageProfileBy(movie.profileId);
@ -279,7 +288,7 @@ const MovieUploadForm: FunctionComponent<Props> = ({
modals.closeSelf();
})}
>
<Stack>
<Stack className={classes.wrapper}>
<SimpleTable columns={columns} data={form.values.files}></SimpleTable>
<Divider></Divider>
<Button type="submit">Upload</Button>

View File

@ -22,7 +22,7 @@ import {
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import {
Button,
Checkbox,
Checkbox, createStyles,
Divider,
MantineColor,
Stack,
@ -85,12 +85,21 @@ interface Props {
onComplete?: VoidFunction;
}
const useStyles = createStyles((theme) => {
return {
wrapper: {
overflowWrap: "anywhere"
},
};
});
const SeriesUploadForm: FunctionComponent<Props> = ({
series,
files,
onComplete,
}) => {
const modals = useModals();
const { classes } = useStyles();
const episodes = useEpisodesBySeriesId(series.sonarrSeriesId);
const episodeOptions = useSelectorOptions(
episodes.data ?? [],
@ -358,7 +367,7 @@ const SeriesUploadForm: FunctionComponent<Props> = ({
modals.closeSelf();
})}
>
<Stack>
<Stack className={classes.wrapper}>
<SimpleTable columns={columns} data={form.values.files}></SimpleTable>
<Divider></Divider>
<Button type="submit">Upload</Button>

View File

@ -24,7 +24,6 @@ const useStyles = createStyles((theme) => {
display: "block",
maxWidth: "100%",
overflowX: "auto",
overflowWrap: "anywhere",
},
table: {
borderCollapse: "collapse",