.kanboard-container { & > div { padding: 0; height: 100%; & > div { width: 100%; height: 100%; display: flex; flex-direction: row; align-items: stretch; justify-content: stretch; // Lanes & > div { &:first-child { margin-left: 0; } flex-grow: 1; flex-basis: 100%; background-color: transparent; display: flex; flex-direction: column; bottom: 0; height: 100% !important; min-height: 100% !important; // Card container & > div > div > div { width: 100%; } } } } [data-react-beautiful-dnd-droppable] { min-height: calc(100vh) !important; } .kanboard-card { margin-bottom: $size-small; } .kanboard-lane { margin-bottom: $size-small; background: $white; position: sticky; position: -webkit-sticky; top: 0; } } .modal-content { justify-content: center; align-items: center; width: 50% !important; } .react-kanban-board { max-height: calc(100vh - calc(52px * 2)); overflow: hidden; overflow-x: scroll; scrollbar-color: $grey-lighter, #f1f1f1; scrollbar-width: 5px; &::-webkit-scrollbar { width: 5px; height: 5px; } /* Track */ &::-webkit-scrollbar-track { background: #f1f1f1; } /* Handle */ &::-webkit-scrollbar-thumb { background: $grey-lighter; } /* Handle on hover */ &::-webkit-scrollbar-thumb:hover { background: $green; } } .react-kanban-column { max-width: 305px; min-width: 305px; position: relative; max-height: 100%; overflow-x: hidden; overflow-y: scroll; scrollbar-color: $grey-lighter, #f1f1f1; scrollbar-width: 5px; &.minimized { max-width: 30px; min-width: 30px; } &::-webkit-scrollbar { width: 5px; } /* Track */ &::-webkit-scrollbar-track { background: #f1f1f1; } /* Handle */ &::-webkit-scrollbar-thumb { background: $grey-lighter; } /* Handle on hover */ &::-webkit-scrollbar-thumb:hover { background: $green; } } .react-kanban-card__title { position: sticky; position: -webkit-sticky; } .react-kanban-column { background: white !important; }