benivo-ui-library/textarea.less

Benivo UI library

textarea {
    height: 100%;
    background-color: var(--white);
    padding: 0.5rem 1.25rem 0.5rem 0.75rem;
    .border-radius(@form-border-radius);
    border: 1px solid var(--border-200);
    resize: none;

    &.form-control {
        resize: vertical;
    }

    &::-webkit-input-placeholder {
        line-height: @form-line-height;
    }

    &::-moz-placeholder {
        line-height: @form-line-height;
    }

    &:-ms-input-placeholder {
        line-height: @form-line-height;
    }

    &::placeholder {
        line-height: @form-line-height;
    }
}

.textarea-wrapper {
    position: relative;
    width: 100%;

    textarea {
        height: 136px;
    }

    ::-webkit-scrollbar {
        width: 14px;
    }

    ::-webkit-scrollbar-track,
    ::-webkit-scrollbar-thumb {
        opacity: 0.5;
        border: 5px solid transparent;
        .border-radius(8px);
        background-clip: padding-box;
    }

    ::-webkit-scrollbar-track {
        background-color: var(--grey-200);
    }

    ::-webkit-scrollbar-thumb {
        background-color: var(--grey-400);
    }

    .increase-scroll-width {
        padding-right: ~"calc(1.25rem - 4px)";

        &::-webkit-scrollbar {
            width: 18px;
        }
    }
}