ahtlon/deck
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

fix: update comment input ui

Browse Source 
Signed-off-by: Luka Trovic <luka@nextcloud.com>
This commit is contained in:
Luka Trovic
2022-03-25 14:20:09 +01:00
parent 97b7c1a2f2
commit 386131774d
2 changed files with 24 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
src/components/card/CardSidebarTabComments.vue
View File

@@ -1,19 +1,16 @@
<template> <template>
<div> <div>
<div class="comment-wrapper">
<div class="comment--header"> <div class="comment--header">
<Avatar :user="currentUser.uid" /> <Avatar :user="currentUser.uid" />
<span class="has-tooltip username">
{{ currentUser.displayName }}
</span>
</div> </div>
<CommentItem v-if="replyTo" <CommentItem v-if="replyTo"
:comment="replyTo" :comment="replyTo"
:reply="true" :reply="true"
:preview="true" :preview="true"
@cancel="cancelReply" /> @cancel="cancelReply" />
<CommentForm v-model="newComment" @submit="createComment" /> <CommentForm v-model="newComment" @submit="createComment" />
</div>
<ul v-if="getCommentsForCard(card.id).length > 0" id="commentsFeed"> <ul v-if="getCommentsForCard(card.id).length > 0" id="commentsFeed">
<CommentItem v-for="comment in getCommentsForCard(card.id)" <CommentItem v-for="comment in getCommentsForCard(card.id)"
:key="comment.id" :key="comment.id"

14
src/css/comments.scss
View File

@@ -34,6 +34,7 @@
display: flex; display: flex;
align-items: center; align-items: center;
color: var(--color-text-light); color: var(--color-text-light);
margin-right: 10px;
.username { .username {
padding: 10px; padding: 10px;
@@ -50,3 +51,16 @@
margin-left: 44px; margin-left: 44px;
word-break: break-word; word-break: break-word;
} }
.comment-wrapper {
display: flex;
align-items: center;
}
.comment-form {
width: 100%;
}
.comment-form .comment-form__contenteditable {
border-radius: 4px;
}