nukeop/nuclear

@import "../../common.scss";

.resize_handle {
    position: relative;
    display: flex;
    cursor: row-resize;
    width: 100%;
    height: 1em;
    align-items: center;
    justify-content: center;
    z-index: 100;

    &::before {
        @include roundCorners;
        position: relative;
        content: " ";
        background: $white;
        opacity: 0;
        transition: opacity $very-short-duration;
    }

    &.vertical {
        cursor: col-resize;
        width: 1em;
        height: 100%;

        &:hover {
            &::before {
                width: 0.5em;
                height: 4em;
                opacity: 0.8;
            }
        }
    }

    &:hover {
        &::before {
            width: 4em;
            height: 0.5em;
            opacity: 0.8;
        }
    }
}