CSS FIX: card-board in sidebar

[octoshrimpy]

This block of css auto-detects card-board in the right sidebar and cleans up styling so it's usable. The modal popup is also handled, as it is being inserted within the card-board tab root instead of body root. (should probably fix that)

 /* cleaner header  */
.mod-right-split .card-board-view {

    .workspace-tab-header-inner-title {
        display: initial;
    }

    .workspace-tab-header-container {
        flex-direction: row-reverse;
    }
    .workspace-tab-header-container-inner {
        flex: 1;
    }

    .card-board-tab-header-spacer {
        display: none;
    }

    /* proper scrolling */
    .card-board-container {
        height: inherit;

        > div { height: 100%; }

        > div > div {
            height: 100%;
            display: flex;
            flex-direction:column;

            .card-board-boards.card-board-column-container {
                flex: 1;
                padding-bottom: 2rem;

                .card-board-board {
                    width: 100%;
                }

                .card-board-columns {
                    flex-direction: column;
                }

                /* collapsed margins */
                .card-board-column {
                    width: 100%;
                    transition: color 0.25s ease;

                    &.collapsed {
                        padding: 0.6em 1em 0em 1em;
                        color: var(--text-faint);

                        .card-board-column-header {                        
                            writing-mode: inherit;
                        }
                    }

                    /* better arrows */
                    .arrow-down, .arrow-right {
                        margin: -0.3em 0.3em -0.3em -0.9em;
                        border: none;
                        height: 2.5rem;
                        width: 2rem;
                        display: flex;
                        color: white;
                        align-items: center;
                        justify-content: center;
                        position: relative;

                        &:after {
                            content: "›";
                            position: absolute;
                            transform: rotate(0deg);
                            transition: transform 0.25s ease;
                        }

                        &.arrow-right:after {
                            transform: rotate(90deg);
                        }
                    }
                }
            }
        }
    }
}

/* allow modal to pop out of sidebar */
.workspace-leaf.mod-active:has(.card-board-view .modal-container) {
    contain: initial !important;

    .modal-container {
        position: fixed;
        z-index:    50;
    }
}