применение настроек кнопок Артёма в модалке настройки картинки

This commit is contained in:
Nastya 2023-12-17 00:34:54 +03:00
parent 58ade8be9b
commit 6140f4c31d

@ -40,8 +40,8 @@ const styleSlider: SxProps<Theme> = {
"&:focus, &:hover, &.Mui-active, &.Mui-focusVisible": {
boxShadow: `0px 0px 0px 3px white,
0px 4px 4px 3px #C3C8DD`,
},
},
},
};
interface Props {
@ -249,20 +249,9 @@ export const CropModal: FC<Props> = ({ isOpen, imageBlob, originalImageUrl, setC
marginTop: "40px",
width: "100%",
display: "flex",
}}>
<Button
onClick={handleSaveClick}
disableRipple
data-cy="crop-modal-save-button"
sx={{
height: "48px",
color: "#7E2AEA",
borderRadius: "8px",
border: "1px solid #7E2AEA",
marginRight: "10px",
px: "20px",
}}
>Сохранить</Button>
gap: "10px",
}}
>
<Button
onClick={handleLoadOriginalImage}
disableRipple
@ -273,8 +262,6 @@ export const CropModal: FC<Props> = ({ isOpen, imageBlob, originalImageUrl, setC
color: "#7E2AEA",
borderRadius: "8px",
border: "1px solid #7E2AEA",
marginRight: "10px",
ml: "auto",
}}
>
Загрузить оригинал
@ -282,18 +269,38 @@ export const CropModal: FC<Props> = ({ isOpen, imageBlob, originalImageUrl, setC
<Button
onClick={handleCropClick}
disableRipple
variant="contained"
disabled={!completedCrop?.width || !completedCrop?.height}
disabled={!completedCrop}
sx={{
padding: "10px 20px",
borderRadius: "8px",
background: theme.palette.brightPurple.main,
fontSize: "18px",
color: "#7E2AEA",
border: `1px solid ${!completedCrop ? "rgba(0, 0, 0, 0.26)" : "#7E2AEA"}`,
backgroundColor: "transparent",
}}
>
<CropIcon />
<CropIcon color={!completedCrop ? "rgba(0, 0, 0, 0.26)" : "#7E2AEA"} />
Обрезать
</Button>
<Button
onClick={handleSaveClick}
disableRipple
variant="contained"
data-cy="crop-modal-save-button"
sx={{
height: "48px",
borderRadius: "8px",
border: "1px solid #7E2AEA",
marginRight: "10px",
px: "20px",
ml: "auto",
}}
>
Сохранить
</Button>
</Box>
</Box>
</Modal>