feature(3331): made board, overview, stack and search result cards width behave more dynamic

Signed-off-by: Luutzen Dijkstra <luutzen.dijkstra@gmail.com>
This commit is contained in:
Luutzen Dijkstra
2025-01-01 13:51:38 +01:00
committed by Luka Trovic
parent 6ace1867e1
commit 3115363c28
9 changed files with 170 additions and 139 deletions

View File

@@ -276,18 +276,15 @@ export default {
position: relative;
width: 100%;
height: 100%;
max-height: calc(100vh - 50px);
display: flex;
flex-direction: column;
}
.board {
padding-left: $board-spacing;
position: relative;
max-height: calc(100% - var(--default-clickable-area));
overflow: hidden;
overflow-x: auto;
overflow: auto;
flex-grow: 1;
scrollbar-gutter: stable;
}
/**
@@ -297,11 +294,14 @@ export default {
.smooth-dnd-container.horizontal {
display: flex;
align-items: stretch;
height: 100%;
gap: $board-gap;
padding: 0 $board-gap;
&:deep(.stack-draggable-wrapper.smooth-dnd-draggable-wrapper) {
display: flex;
height: auto;
flex: 0 1 $card-max-width;
min-width: $card-min-width;
.stack {
display: flex;
@@ -309,16 +309,10 @@ export default {
position: relative;
.smooth-dnd-container.vertical {
flex-grow: 1;
display: flex;
flex-direction: column;
// Margin left instead of padidng to avoid jumps on dropping a card
margin-left: $stack-spacing;
padding-right: $stack-spacing;
overflow-x: hidden;
overflow-y: auto;
padding-top: 15px;
margin-top: -10px;
gap: $stack-gap;
padding: 5px 0 $stack-gap;
scrollbar-gutter: stable;
}