diff --git a/front/src/modules/pipeline/components/EntityBoardColumn.tsx b/front/src/modules/pipeline/components/EntityBoardColumn.tsx index b728dfb22f..2f87911ff7 100644 --- a/front/src/modules/pipeline/components/EntityBoardColumn.tsx +++ b/front/src/modules/pipeline/components/EntityBoardColumn.tsx @@ -1,7 +1,7 @@ import { useEffect } from 'react'; import { getOperationName } from '@apollo/client/utilities'; import styled from '@emotion/styled'; -import { Droppable, DroppableProvided } from '@hello-pangea/dnd'; +import { Draggable, Droppable, DroppableProvided } from '@hello-pangea/dnd'; import { useRecoilValue } from 'recoil'; import { BoardPipelineStageColumn } from '@/ui/board/components/Board'; @@ -27,6 +27,12 @@ const StyledNewCardButtonContainer = styled.div` padding-bottom: ${({ theme }) => theme.spacing(4)}; `; +const StyledColumnCardsContainer = styled.div` + display: flex; + flex: 1; + flex-direction: column; +`; + const BoardColumnCardsContainer = ({ children, droppableProvided, @@ -35,13 +41,13 @@ const BoardColumnCardsContainer = ({ droppableProvided: DroppableProvided; }) => { return ( -
{children} {droppableProvided?.placeholder} -
+ ); }; @@ -112,10 +118,22 @@ export function EntityBoardColumn({ /> ))} + + {(draggableProvided) => ( +
+ + {boardOptions.newCardComponent} + +
+ )} +
- - {boardOptions.newCardComponent} - )} diff --git a/front/src/modules/ui/board/components/Board.tsx b/front/src/modules/ui/board/components/Board.tsx index 37d233d115..8d2b2a2499 100644 --- a/front/src/modules/ui/board/components/Board.tsx +++ b/front/src/modules/ui/board/components/Board.tsx @@ -6,7 +6,6 @@ export const StyledBoard = styled.div` display: flex; flex: 1; flex-direction: row; - overflow-x: auto; padding-left: ${({ theme }) => theme.spacing(2)}; `;