From efd1cf57dad09829d8ba80d5ede7a70aa2701038 Mon Sep 17 00:00:00 2001 From: Jan-Christoph Borchardt Date: Wed, 3 Aug 2016 13:18:09 +0200 Subject: fix design details in comments sidebar --- apps/comments/css/comments.css | 54 +++++++++++++++++++++++++++++++----------- 1 file changed, 40 insertions(+), 14 deletions(-) (limited to 'apps/comments/css') diff --git a/apps/comments/css/comments.css b/apps/comments/css/comments.css index a9b72252e88..fc5bd7e51cc 100644 --- a/apps/comments/css/comments.css +++ b/apps/comments/css/comments.css @@ -8,13 +8,35 @@ * */ +#commentsTabView .emptycontent { + margin-top: 0; +} + #commentsTabView .newCommentForm { + position: relative; margin-bottom: 20px; } #commentsTabView .newCommentForm .message { - width: 90%; - resize: vertical; + width: 76%; + margin-left: 32px; + padding-right: 30px; +} + +#commentsTabView .newCommentForm .submit { + position: absolute; + top: 0; + right: 0; + width: 30px; + margin: 0; + padding: 9px; + background-color: transparent; + border: none; + opacity: .3; +} +#commentsTabView .newCommentForm .submit:hover, +#commentsTabView .newCommentForm .submit:focus { + opacity: 1; } #commentsTabView .newCommentForm .submitLoading { @@ -22,23 +44,20 @@ } #commentsTabView .comment { + position: relative; + z-index: 1; margin-bottom: 30px; } #commentsTabView .comment .avatar { - width: 28px; - height: 28px; - line-height: 28px; -} - -#commentsTabView .comment { - position: relative; - z-index: 1; + width: 32px; + height: 32px; + line-height: 32px; } #commentsTabView .comment.collapsed .message { white-space: -moz-pre-wrap !important; /* Mozilla, since 1999 */ - white-space: -webkit-pre-wrap; /*Chrome & Safari */ + white-space: -webkit-pre-wrap; /*Chrome & Safari */ white-space: -pre-wrap; /* Opera 4-6 */ white-space: -o-pre-wrap; /* Opera 7 */ white-space: pre-wrap; /* css-3 */ @@ -80,17 +99,24 @@ } #commentsTabView .comment .authorRow { - margin-bottom: 5px; position: relative; } +#commentsTabView .comment .author, +#commentsTabView .comment .date { + opacity: .5; +} #commentsTabView .comment .author { - font-weight: bold; + margin-left: 5px; } - #commentsTabView .comment .date { position: absolute; right: 0; + top: 5px; +} + +#commentsTabView .comments .message { + padding-left: 40px; } #commentsTabView .comment .action { -- cgit v1.2.3