@import '_deleteButton';

.bg__comment-type {
    position: relative;
    padding-right: 10px;
    font-size: 0.9em;
    text-align: right;
    padding-bottom: 5px;

    &:hover {
        > .delete {
            display: block;
        }
    }

    > pre {
        background: white;
        font-family: $fontBody;
        display: block;
        border: 0;
        border-bottom: 1px solid $clGreyTint;
        padding: 5px;
        text-align: left;
        margin-bottom: 3px;
        word-break: break-word;
        white-space: pre-wrap;
    }

    > textarea {
        min-width: 100%;
        min-height: 30px;
        // text-overflow is hidden because we use the autogrow textarea component
        text-overflow: hidden;
    }

    > .user,
    .created {
        text-align: right;
        font-size: 0.8em;
        text-transform: uppercase;
        margin-left: 10px;
    }

    > .delete {
        @include deleteButton();
        right: 9px;
        border-radius: 2px;
    }
}