Fixed alignment of items in comments

Signed-off-by: John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com>

2 files changed, 16 insertions, 9 deletions

diff --git a/apps/comments/css/comments.css b/apps/comments/css/comments.css
index 19c15786a51..c61ecbf2eef 100644
--- a/apps/comments/css/comments.css
+++ b/apps/comments/css/comments.css
@@ -69,6 +69,7 @@
 	width: 32px;
 	height: 32px;
 	line-height: 32px;
+	margin-right: 5px;
 }
 
 #commentsTabView .comment .message .avatar,
@@ -126,6 +127,13 @@
 #commentsTabView .comment .authorRow {
 	position: relative;
 	cursor: pointer;
+	display: inline-flex;
+	align-items: center;
+	width: 100%;
+}
+
+#commentsTabView .comments li .message .atwho-inserted {
+	margin-left: 5px;
 }
 
 .atwho-view-ul * .avatar-name-wrapper {
@@ -136,23 +144,20 @@
 #commentsTabView .comment .date {
 	opacity: .5;
 }
-#commentsTabView .comment .author {
-	margin-left: 5px;
-}
 #commentsTabView .comment .date {
-	position: absolute;
-	right: 0;
-	top: 5px;
+	margin-left: auto;
 }
 
 #commentsTabView .comments li .message {
 	padding-left: 40px;
+	display: inline-flex;
+	flex-wrap: wrap;
+	align-items: center;
 }
 
 #commentsTabView .comment .action {
 	opacity: 0;
-	vertical-align: middle;
-	display: inline-block;
+	padding: 5px;
 }
 
 #commentsTabView .comment:hover .action {
diff --git a/core/css/share.scss b/core/css/share.scss
index 6ce3cc9765d..68b601bcb65 100644
--- a/core/css/share.scss
+++ b/core/css/share.scss
@@ -177,9 +177,11 @@
 }
 
 .contactsmenu-popover {
-	left: -7px;
+	left: -6px;
 	right: auto;
 	padding: 3px 6px;
+	top: 100%;
+	margin-top: 0;
 	li.hidden {
 		display: none !important;
 	}