Docker/planka
Docker/planka
1
0
Fork 0
mirror of https://github.com/plankanban/planka.git synced 2025-07-18 20:59:44 +02:00
Code Issues Releases Activity

fix: Prevent list with multiline title from overflowing board view

Browse source 
Closes #377
This commit is contained in:
Maksim Eltyshev 2024-11-17 23:37:43 +01:00
parent 71d0815891
commit 1a70b2b7e6
2 changed files with 6 additions and 14 deletions
Download patch file Download diff file Expand all files Collapse all files

12
client/src/components/List/List.jsx
View file

@ -32,7 +32,7 @@ const List = React.memo(
const [isAddCardOpened, setIsAddCardOpened] = useState(false);
const nameEdit = useRef(null);
const listWrapper = useRef(null);
const cardsWrapper = useRef(null);
const handleHeaderClick = useCallback(() => {
if (isPersisted && canEdit) {
@ -67,7 +67,7 @@ const List = React.memo(
useEffect(() => {
if (isAddCardOpened) {
listWrapper.current.scrollTop = listWrapper.current.scrollHeight;
cardsWrapper.current.scrollTop = cardsWrapper.current.scrollHeight;
}
}, [cardIds, isAddCardOpened]);
@ -133,13 +133,7 @@ const List = React.memo(
</ActionsPopup>
)}
</div>
<div
ref={listWrapper}
className={classNames(
styles.cardsInnerWrapper,
(isAddCardOpened || !canEdit) && styles.cardsInnerWrapperFull,
)}
>
<div ref={cardsWrapper} className={styles.cardsInnerWrapper}>
<div className={styles.cardsOuterWrapper}>{cardsNode}</div>
</div>
{!isAddCardOpened && canEdit && (

8
client/src/components/List/List.module.scss
View file

@ -40,7 +40,6 @@
}
.cardsInnerWrapper {
max-height: calc(100vh - 268px);
overflow-x: hidden;
overflow-y: auto;
width: 290px;
@ -62,10 +61,6 @@
}
}
.cardsInnerWrapperFull {
max-height: calc(100vh - 232px);
}
.cardsOuterWrapper {
padding: 0 8px;
white-space: normal;
@ -140,6 +135,9 @@
.outerWrapper {
background: #dfe3e6;
border-radius: 3px;
display: flex;
flex-direction: column;
max-height: calc(100vh - 198px);
overflow: hidden;
}
}