TSK-1394,-1407,-1412,-1417,-1422,-1423: minor fixes. Fixed Scroller. (#3124)

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

plugins/task-resources/src/components/kanban/KanbanView.svelte

@@ -82,6 +82,9 @@
 
   $: dontUpdateRank = orderBy[0] !== TaskOrdering.Manual
 
+  $: lth = $deviceInfo.theme === 'theme-light'
+  const accentColors: AccentColor[] = []
+
   const spaceQuery = createQuery()
 
   let currentProject: SpaceWithStates | undefined
@@ -172,7 +175,7 @@
       if (accentColors[i] === undefined) {
         accentColors[i] = {
           textColor: 'var(--theme-caption-color)',
-          backgroundColor: '175, 175, 175'
+          backgroundColor: lth ? '230, 230, 230' : '100, 100, 108'
         }
       }
     })
@@ -243,9 +246,6 @@
 
   const getDoneUpdate = (e: any) => ({ doneState: e.detail._id } as DocumentUpdate<Doc>)
 
-  $: lth = $deviceInfo.theme === 'theme-light'
-  const accentColors: AccentColor[] = []
-
   const setAccentColor = (n: number, ev: CustomEvent) => {
     const accColor = rgbToHsl(ev.detail.r, ev.detail.g, ev.detail.b)
     const textColor = !lth ? { r: 255, g: 255, b: 255 } : hslToRgb(accColor.h, accColor.s, 0.3)
@@ -287,13 +287,13 @@
       <!-- {@const status = $statusStore.get(state._id)} -->
       {#key lth}
         <div
-          style:--kanban-header-rgb-color={accentColors[index]?.backgroundColor ?? '175, 175, 175'}
+          style:--kanban-header-rgb-color={accentColors[index].backgroundColor}
           class="header flex-row-center"
           class:gradient={!lth}
         >
           <span
             class="clear-mins fs-bold overflow-label pointer-events-none"
-            style:color={accentColors[index]?.textColor ?? 'var(--theme-caption-color)'}
+            style:color={accentColors[index].textColor}
           >
             {#if groupByKey === noCategory}
               <Label label={view.string.NoGrouping} />

plugins/task-resources/src/components/state/StatePresenter.svelte

@@ -16,7 +16,7 @@
 <script lang="ts">
   import { createEventDispatcher, onMount } from 'svelte'
   import type { State } from '@hcengineering/task'
-  import { getColorNumberByText, getPlatformColor, hexToRgb } from '@hcengineering/ui'
+  import { getColorNumberByText, getPlatformColor, hexToRgb, deviceOptionsStore as deviceInfo } from '@hcengineering/ui'
 
   export let value: State | undefined
   export let shouldShowAvatar = true
@@ -28,8 +28,12 @@
 
   const defaultFill = 'currentColor'
   $: fill = value ? getPlatformColor(value.color ?? getColorNumberByText(value.name)) : defaultFill
+  $: lth = $deviceInfo.theme === 'theme-light'
   const dispatchAccentColor = (fill: string) =>
-    dispatch('accent-color', fill !== defaultFill ? hexToRgb(fill) : { r: 127, g: 127, b: 127 })
+    dispatch(
+      'accent-color',
+      fill !== defaultFill ? hexToRgb(fill) : lth ? { r: 220, g: 220, b: 220 } : { r: 100, g: 100, b: 108 }
+    )
   $: dispatchAccentColor(fill)
 
   onMount(() => {