Fix Card layout (#2420)

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

packages/presentation/src/components/Card.svelte

@@ -15,7 +15,7 @@
 -->
 <script lang="ts">
   import type { IntlString } from '@hcengineering/platform'
-  import { Button, IconClose, Label, MiniToggle } from '@hcengineering/ui'
+  import { Button, IconClose, Label, MiniToggle, Scroller } from '@hcengineering/ui'
   import { createEventDispatcher } from 'svelte'
   import presentation from '..'
   import { deviceOptionsStore as deviceInfo, resizeObserver } from '@hcengineering/ui'
@@ -71,7 +71,11 @@
       />
     </div>
   </div>
-  <div class="antiCard-content"><slot /></div>
+  <Scroller autoscroll>
+    <div class="antiCard-content">
+      <slot />
+    </div>
+  </Scroller>
   {#if $$slots.header || $$slots.pool}
     <div class="antiCard-pool">
       <slot name="pool" />

packages/theme/styles/dialogs.scss

@@ -70,6 +70,7 @@
     display: flex;
     flex-direction: column;
     flex-grow: 1;
+    flex-shrink: 1;
     margin: 0 1rem;
     height: fit-content;
     min-height: 0;

packages/ui/src/components/Scroller.svelte

@@ -310,7 +310,7 @@
 <svelte:window on:resize={_resize} />
 
 <div class="scroller-container {invertScroll ? 'invert' : 'normal'}">
-  <div bind:this={divHScroll} class="horizontalBox flex-shrink">
+  <div bind:this={divHScroll} class="horizontalBox flex-col flex-shrink">
     <div
       bind:this={divScroll}
       use:resizeObserver={(element) => {

packages/ui/src/popups.ts

@@ -243,6 +243,7 @@ export function fitPopupElement (
     } else if (element === 'top') {
       newProps.top = '15vh'
       newProps.left = '50%'
+      newProps.maxHeight = '75vh'
       newProps.transform = 'translateX(-50%)'
       show = true
     } else if (element === 'float') {

plugins/tracker-resources/src/components/CreateIssue.svelte

@@ -713,18 +713,11 @@
     space={_space}
     alwaysEdit
     showButtons={false}
-    maxHeight={'20vh'}
     bind:content={object.description}
     placeholder={tracker.string.IssueDescriptionPlaceholder}
     on:changeSize={() => dispatch('changeContent')}
   />
-  <IssueTemplateChilds
+  <IssueTemplateChilds bind:children={subIssues} sprint={object.sprint} project={object.project} isScrollable />
-    bind:children={subIssues}
-    sprint={object.sprint}
-    project={object.project}
-    isScrollable
-    maxHeight={'20vh'}
-  />
   <svelte:fragment slot="pool">
     <div class="flex flex-wrap" style:gap={'0.2vw'}>
       {#if issueStatuses}

plugins/tracker-resources/src/components/templates/IssueTemplateChildList.svelte

@@ -108,6 +108,7 @@
 />
 
 {#each issues as issue, index (issue.id)}
+  <!-- svelte-ignore a11y-click-events-have-key-events -->
   <div
     class="flex-between row"
     class:is-dragging={index === draggingIndex}
@@ -139,6 +140,7 @@
           issue.priority = evt.detail
         }}
       />
+      <!-- svelte-ignore a11y-click-events-have-key-events -->
       <span class="issuePresenter" on:click={(evt) => openIssue(evt, issue)}>
         <FixedColumn
           width={propsWidth.issue}
@@ -156,7 +158,7 @@
     <div class="flex-center flex-no-shrink">
       <EstimationEditor
         kind={'link'}
-        size={'small'}
+        size={'large'}
         bind:value={issue}
         on:change={(evt) => {
           dispatch('update-issue', { id: issue.id, estimation: evt.detail })

plugins/tracker-resources/src/components/templates/IssueTemplateChilds.svelte

@@ -86,7 +86,7 @@
 </div>
 {#if hasSubIssues}
   <ExpandCollapse isExpanded={!isCollapsed} duration={400} on:changeContent>
-    <div class="list" class:collapsed={isCollapsed}>
+    <div class="flex-col flex-no-shrink list clear-mins" class:collapsed={isCollapsed}>
       <IssueTemplateChildList
         {project}
         {sprint}