.comment_stream { .show_comments { border-top: 1px solid $border-grey; line-height: $line-height-computed; margin-top: 5px; a { color: $text-grey; font-size: 13px; } .media { margin-top: 10px; } } .loading-comments { height: $line-height-computed + 11px; // height of .show_comments: line-height, 10px margin, 1px border margin-top: -$line-height-computed - 11px; .loader { height: 20px; width: 20px; } .media { margin: 5px; } } .comments > .comment, .comment.new-comment-form-wrapper { .avatar { height: 35px; width: 35px; } margin: 0; border-top: 1px dotted $border-grey; padding: 10px 0; .info { margin-top: 5px; font-size: $font-size-small; line-height: $font-size-small; } >.highlighted { border-left: 3px solid $link-color; padding-left: 3px; } } .permalink { @include transition(opacity); opacity: 0; } .comment:hover .permalink { opacity: .8; &:hover { opacity: 1; } } .comment.new-comment-form-wrapper { padding-bottom: 0; } .submit-button { margin-top: 10px; input { float: right; } padding-left: 12px; } .comment-box { height: 35px; resize: none; } textarea.comment-box:focus, textarea.comment-box:valid, textarea.comment-box:active { border-color: $border-dark-grey; box-shadow: none; } .twitter-typeahead { // typeahead sets this to `display: inline-block` which adds additional space between // the comment textarea and the submit button. // scss-lint:disable ImportantRule display: block !important; // scss-lint:enable ImportantRule } } .new-comment { &:not(.open) .submit-button, &:not(.open) .md-header { display: none; } // The rule for .md-preview is required until we switch to the newer release of bootstrap-markdown with // the following commit in: // https://github.com/toopay/bootstrap-markdown/commit/14a21c3837140144b27efc19c795d1a37fad70fb .md-preview, &.open .md-editor textarea { min-height: 70px; } }