fix: centered columns in funnel dnd for mobile

This commit is contained in:
2025-08-17 19:35:21 +04:00
parent e5e87f775d
commit 3ccebeb123
4 changed files with 14 additions and 9 deletions

View File

@ -1,8 +1,16 @@
.container {
cursor: pointer;
height: calc(100vh - 150px);
@media (max-width: 48em) {
width: 80vw;
}
}
.inner-container {
border-radius: var(--mantine-spacing-md);
flex-wrap: nowrap;
cursor: pointer;
@mixin light {
background-color: var(--color-light-aqua);
@ -10,9 +18,4 @@
@mixin dark {
background-color: var(--mantine-color-dark-6);
}
width: fit-content;
@media (max-width: 48em) {
width: 80vw;
}
}

View File

@ -11,8 +11,8 @@ const CreateStatusButton = () => {
const isMobile = useIsMobile();
return (
<Stack>
<Box className={styles.container}>
<Stack className={styles.container}>
<Box className={styles["inner-container"]}>
<InPlaceInput
placeholder={"Название колонки"}
onComplete={onCreateStatus}

View File

@ -109,7 +109,8 @@ const FunnelDnd = <
<Swiper
ref={swiperRef}
className={classes["swiper-container"]}
slidesPerView={1.2}
slidesPerView={1.1}
style={{ paddingLeft: "10vw", paddingRight: "2vw" }}
modules={[Pagination]}
freeMode={{ enabled: false }}
pagination={{ enabled: true, clickable: true }}>

View File

@ -21,6 +21,7 @@ const DragHandle = ({ id, children, style, disabled }: Props) => {
style={{
width: "100wv",
cursor: disabled ? "default" : "grab",
touchAction: "auto",
...style,
}}
className={disabled ? "" : "swiper-no-swiping"}