Comments fix (#423)

Signed-off-by: Denis Bykhov <bykhov.denis@gmail.com>
This commit is contained in:
Denis Bykhov 2021-11-29 19:28:30 +06:00 committed by GitHub
parent 58b286ca52
commit 08442dde8e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 32 additions and 13 deletions

View File

@ -138,7 +138,7 @@
<style lang="scss"> <style lang="scss">
.header { .header {
margin-bottom: 1.5rem; margin-bottom: 1.75rem;
font-weight: 500; font-weight: 500;
font-size: 1rem; font-size: 1rem;
color: var(--theme-caption-color); color: var(--theme-caption-color);
@ -148,7 +148,7 @@
position: fixed; position: fixed;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
padding: 1rem; padding: 1.75rem;
color: var(--theme-caption-color); color: var(--theme-caption-color);
background-color: var(--theme-button-bg-hovered); background-color: var(--theme-button-bg-hovered);
border: 1px solid var(--theme-button-border-enabled); border: 1px solid var(--theme-button-border-enabled);

View File

@ -16,17 +16,33 @@
<script lang="ts"> <script lang="ts">
import { Ref, Doc, SortingOrder } from '@anticrm/core' import { Ref, Doc, SortingOrder } from '@anticrm/core'
import { Table } from '@anticrm/view-resources'
import chunter from '@anticrm/chunter' import chunter, { Comment } from '@anticrm/chunter'
import { createQuery } from '@anticrm/presentation'
import CommentPresenter from './CommentPresenter.svelte'
export let objectId: Ref<Doc> export let objectId: Ref<Doc>
let comments: Comment[] = []
const query = createQuery()
$: query.query(chunter.class.Comment, { attachedTo: objectId }, (res) => {
comments = res
}, { limit: 3, sort: { modifiedOn: SortingOrder.Descending }})
</script> </script>
<Table <div class="content">
_class={chunter.class.Comment} {#each comments as comment}
config={['']} <div class="item">
options={ { limit: 3, sort: { modifiedOn: SortingOrder.Descending }} } <CommentPresenter value={comment} />
query={ { attachedTo: objectId } } </div>
/> {/each}
</div>
<style lang="scss">
.content {
.item + .item {
margin-top: 1.75rem;
}
}
</style>

View File

@ -28,7 +28,7 @@
<div class="container"> <div class="container">
<div class="avatar"><Avatar size={'medium'} /></div> <div class="avatar"><Avatar size={'medium'} /></div>
<div class="message"> <div class="message">
<div class="header"> <div class="header flex-between">
{#await getUser(client, value.modifiedBy) then user} {#await getUser(client, value.modifiedBy) then user}
{#if user}{formatName(user.name)}{/if} {#if user}{formatName(user.name)}{/if}
{/await} {/await}
@ -48,14 +48,14 @@
display: flex; display: flex;
flex-direction: column; flex-direction: column;
width: 100%; width: 100%;
margin-left: 1rem; margin-left: 1.1rem;
.header { .header {
font-weight: 500; font-weight: 500;
font-size: 1rem; font-size: 1rem;
line-height: 150%; line-height: 150%;
color: var(--theme-caption-color); color: var(--theme-caption-color);
margin-bottom: .25rem; margin-bottom: .2rem;
span { span {
margin-left: .5rem; margin-left: .5rem;
@ -67,6 +67,9 @@
} }
.text { .text {
line-height: 150%; line-height: 150%;
max-width: 20rem;
:global(p) { margin: 0; }
} }
} }
} }