kenmirrors/ente
1
0
Fork 0
mirror of https://github.com/ente-io/ente.git synced 2025-08-13 01:27:17 +00:00
Code Issues Packages Projects Releases Wiki Activity

The "&&&"s are to override the style overrides

Browse Source 
...which is what I want to refactor away, this is an intermediate step.
This commit is contained in:
Manav Rathi
2024-10-03 17:51:37 +05:30
parent 27bdc5d229
commit cd2d7be69a
1 changed files with 45 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files

48
web/apps/photos/src/components/Upload/CollectionMappingChoiceModal.tsx
View File

@@ -1,13 +1,12 @@
import type { CollectionMapping } from "@/base/types/ipc"; import type { CollectionMapping } from "@/base/types/ipc";
import { SpaceBetweenFlex } from "@/new/photos/components/mui"; import FolderIcon from "@mui/icons-material/Folder";
import { CenteredFlex } from "@ente/shared/components/Container"; import FolderCopyIcon from "@mui/icons-material/FolderCopy";
import CloseIcon from "@mui/icons-material/Close";
import { import {
Button, Button,
Dialog, Dialog,
DialogContent, DialogContent,
DialogTitle, DialogTitle,
IconButton, Stack,
Typography, Typography,
} from "@mui/material"; } from "@mui/material";
import { t } from "i18next"; import { t } from "i18next";
@@ -22,29 +21,32 @@ export const CollectionMappingChoiceModal: React.FC<
CollectionMappingChoiceModalProps CollectionMappingChoiceModalProps
> = ({ open, onClose, didSelect }) => { > = ({ open, onClose, didSelect }) => {
return ( return (
<Dialog open={open} onClose={onClose} maxWidth={"sm"} fullWidth> <Dialog
<DialogTitle> open={open}
<SpaceBetweenFlex> onClose={onClose}
{t("MULTI_FOLDER_UPLOAD")} fullWidth
<IconButton PaperProps={{
aria-label={t("close")} sx: {
color="secondary" padding: "8px 12px",
onClick={onClose} maxWidth: "390px",
},
}}
> >
<CloseIcon /> <DialogTitle sx={{ "&&&": { paddingBlockEnd: 0 } }}>
</IconButton> <Typography variant="large" fontWeight={"bold"}>
</SpaceBetweenFlex> {t("MULTI_FOLDER_UPLOAD")}
</Typography>
</DialogTitle> </DialogTitle>
<DialogContent> <DialogContent sx={{ "&&&": { paddingBlockStart: "16px" } }}>
<CenteredFlex mb={1}> <Stack sx={{ gap: "16px" }}>
<Typography color="text.muted"> <Typography color="text.muted" mt={0}>
{t("UPLOAD_STRATEGY_CHOICE")} {t("UPLOAD_STRATEGY_CHOICE")}
</Typography> </Typography>
</CenteredFlex> <Stack sx={{ gap: 1 }}>
<SpaceBetweenFlex px={2}>
<Button <Button
size="medium" size="medium"
color="accent" color="accent"
startIcon={<FolderIcon />}
onClick={() => { onClick={() => {
onClose(); onClose();
didSelect("root"); didSelect("root");
@@ -53,11 +55,10 @@ export const CollectionMappingChoiceModal: React.FC<
{t("UPLOAD_STRATEGY_SINGLE_COLLECTION")} {t("UPLOAD_STRATEGY_SINGLE_COLLECTION")}
</Button> </Button>
<strong>{t("OR")}</strong>
<Button <Button
size="medium" size="medium"
color="accent" color="accent"
startIcon={<FolderCopyIcon />}
onClick={() => { onClick={() => {
onClose(); onClose();
didSelect("parent"); didSelect("parent");
@@ -65,7 +66,8 @@ export const CollectionMappingChoiceModal: React.FC<
> >
{t("UPLOAD_STRATEGY_COLLECTION_PER_FOLDER")} {t("UPLOAD_STRATEGY_COLLECTION_PER_FOLDER")}
</Button> </Button>
</SpaceBetweenFlex> </Stack>
</Stack>
</DialogContent> </DialogContent>
</Dialog> </Dialog>
); );