Fix ActivityMsg

Signed-off-by: Alexander Platov <sas_lord@mail.ru>
This commit is contained in:
Alexander Platov 2021-11-16 22:51:33 +03:00
parent 56a5cb726b
commit 93d718124e
2 changed files with 14 additions and 4 deletions

View File

@ -33,7 +33,7 @@
{/if} {/if}
</div> </div>
</div> </div>
<div class="flex-grow flex-row-center label"><slot /></div> <div class="flex-grow label"><slot /></div>
<div class="content-trans-color">Yesterday, 3:20 PM</div> <div class="content-trans-color">Yesterday, 3:20 PM</div>
</div> </div>
{#if $$slots.content} {#if $$slots.content}
@ -66,6 +66,7 @@
.icon { .icon {
flex-shrink: 0; flex-shrink: 0;
align-self: flex-start;
width: 2.25rem; width: 2.25rem;
height: 2.25rem; height: 2.25rem;
color: var(--theme-caption-color); color: var(--theme-caption-color);
@ -75,6 +76,7 @@
.content { .content {
margin: .5rem 0 .5rem 3.25rem; margin: .5rem 0 .5rem 3.25rem;
padding: 1rem;
background-color: var(--theme-bg-accent-color); background-color: var(--theme-bg-accent-color);
border: 1px solid var(--theme-bg-accent-color); border: 1px solid var(--theme-bg-accent-color);
border-radius: .75rem; border-radius: .75rem;
@ -82,12 +84,11 @@
.label { .label {
flex-wrap: wrap; flex-wrap: wrap;
gap: .25rem;
margin: 0 1rem; margin: 0 1rem;
} }
:global(.label b) { color: var(--theme-caption-color); } :global(.label b) { color: var(--theme-caption-color); }
:global(.label span) { :global(.label span) {
display: inline-flex; display: inline-block;
padding: .125rem .25rem; padding: .125rem .25rem;
color: var(--theme-caption-color); color: var(--theme-caption-color);
background-color: var(--theme-bg-focused-color); background-color: var(--theme-bg-focused-color);

View File

@ -116,12 +116,21 @@
<div class="flex-col activity content"> <div class="flex-col activity content">
{#if comments} {#if comments}
<Grid column={1} rowGap={1.5}> <Grid column={1} rowGap={1.5}>
<ActivityMsg icon={IconToDo}>Task TAS189 was created by <b>Tim Ferris</b></ActivityMsg>
<!-- Start Demo -->
<ActivityMsg icon={IconToDo}><span>Task TAS189</span> was created by <b>Tim Ferris</b> test</ActivityMsg>
<ActivityMsg icon={IconToDo}> <ActivityMsg icon={IconToDo}>
<b>Rosamund Chen</b> changed status from <span>IN PROGRESS</span> to <span class="bar">ON HOLD</span> <b>Rosamund Chen</b> changed status from <span>IN PROGRESS</span> to <span class="bar">ON HOLD</span>
<svelte:fragment slot="content">Content</svelte:fragment> <svelte:fragment slot="content">Content</svelte:fragment>
</ActivityMsg> </ActivityMsg>
<ActivityMsg icon={IconToDo}>Task TAS189 was created by <b>Tim Ferris</b></ActivityMsg> <ActivityMsg icon={IconToDo}>Task TAS189 was created by <b>Tim Ferris</b></ActivityMsg>
<ActivityMsg icon={IconToDo}>
Testing <b>Rosamund Chen</b> changed status from <span>IN PROGRESS</span> to <span class="bar">ON HOLD</span>.
<div slot="content">Content</div>
</ActivityMsg>
<ActivityMsg icon={IconToDo}>Task TAS189 was created by <b>Tim Ferris</b></ActivityMsg>
<!-- End Demo -->
{#each comments as comment} {#each comments as comment}
<Backlink {comment} /> <Backlink {comment} />
{/each} {/each}