@import "variables.scss";

.react-mde-vertical-layout {
    display: flex;
    flex-direction: column;

    .mde-tabs {
        display: flex;
        align-items: stretch;

        .mde-tab {
            border: none;
            border-left: 1px solid $mde-border-color;
            padding: 10px;
            background: none;
        }
    }

    .react-mde-content {
        display: flex;
        flex-direction: column;

        .mde-text {
            min-height: $mde-editor-vertical-min-height;
            height: $mde-editor-vertical-height;
            overflow-y: auto;
        }

        .mde-preview {
            min-height: $mde-preview-vertical-min-height;
            height: $mde-preview-vertical-height;
            overflow-y: auto;
            border-top: 1px solid $mde-border-color;
        }
    }
}