Move and update ShowMore. Limits in CommentPresenter. (#690)

Signed-off-by: Alexander Platov <sas_lord@mail.ru>

plugins/activity-resources/src/components/ShowMore.svelte

@@ -1,83 +0,0 @@
-<!--
-// Copyright © 2020, 2021 Anticrm Platform Contributors.
-// Copyright © 2021 Hardcore Engineering Inc.
-// 
-// Licensed under the Eclipse Public License, Version 2.0 (the "License");
-// you may not use this file except in compliance with the License. You may
-// obtain a copy of the License at https://www.eclipse.org/legal/epl-2.0
-// 
-// Unless required by applicable law or agreed to in writing, software
-// distributed under the License is distributed on an "AS IS" BASIS,
-// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-// 
-// See the License for the specific language governing permissions and
-// limitations under the License.
--->
-
-<script lang="ts">
-  import { Label } from '@anticrm/ui'
-  import activity from '@anticrm/activity'
-
-  export let limit: number = 240
-  export let ignore: boolean = false
-
-  let cHeight: number
-  let bigger: boolean = false
-  let crop: boolean = false
-
-  const toggle = (): void => { crop = !crop }
-
-  $: if (cHeight > limit && !bigger) bigger = true
-  $: if (bigger && !ignore) crop = true
-</script>
-
-<div class="relative">
-  <div
-    bind:clientHeight={cHeight}
-    class="showMore-content"
-    class:crop={!ignore && crop}
-    class:full={bigger && !ignore && !crop}
-  ><slot /></div>
-
-  {#if !ignore && bigger}
-    <div class="showMore" class:outter={cHeight > limit} on:click={toggle}>
-      <Label label={(cHeight > limit) ? activity.string.ShowLess : activity.string.ShowMore} />
-    </div>
-  {/if}
-</div>
-
-<style lang="scss">
-  .showMore-content {
-    max-height: max-content;
-
-    &.crop {
-      overflow: hidden;
-      max-height: 15rem;
-      mask: linear-gradient(to top, rgba(0, 0, 0, 0) 0, black 5rem);
-    }
-    &.full { margin-bottom: 2.75rem; }
-  }
-
-  .showMore {
-    position: absolute;
-    left: 50%;
-    bottom: 0;
-    padding: .5rem 1rem;
-    transform: translateX(-50%);
-
-    word-wrap: none;
-    font-size: .75rem;
-    color: var(--theme-caption-color);
-    background: var(--theme-showmore-color);
-    border: .5px solid var(--theme-card-divider);
-    box-shadow: 0px 8px 15px rgba(0, 0, 0, .1);
-    border-radius: 2.5rem;
-    user-select: none;
-    cursor: pointer;
-    
-    &.outter {
-      bottom: -2.75rem;
-      transform: translateX(-50%);
-    }
-  }
-</style>

plugins/activity-resources/src/components/TxView.svelte

@@ -31,12 +31,12 @@
     Label,
     Menu,
     showPopup,
-    TimeSince
+    TimeSince,
+    ShowMore
   } from '@anticrm/ui'
   import type { AttributeModel } from '@anticrm/view'
   import { buildModel, getActions, getObjectPresenter } from '@anticrm/view-resources'
   import { activityKey, ActivityKey, DisplayTx } from '../activity'
-  import ShowMore from './ShowMore.svelte'
 
   export let tx: DisplayTx
   export let viewlets: Map<ActivityKey, TxViewlet>