hcengineering/platform
1
0
Fork 0
mirror of https://github.com/hcengineering/platform.git synced 2024-11-22 21:50:34 +03:00
Code Issues Actions 4 Packages Projects Releases Wiki Activity

EQMS-980 Show tooltips in table of contents (#5721)

Browse Source 
Signed-off-by: Alexander Onnikov <Alexander.Onnikov@xored.com>
This commit is contained in:
Alexander Onnikov 2024-06-04 11:32:55 +07:00 committed by GitHub
parent 48e1ca9849
commit afce0be2e2
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 28 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

43
packages/text-editor/src/components/toc/TableOfContentsContent.svelte
View File

@ -15,7 +15,8 @@
//
-->
<script lang="ts">
import { FocusHandler, Label, Scroller, createFocusManager } from '@hcengineering/ui'
import { getEmbeddedLabel } from '@hcengineering/platform'
import { FocusHandler, Label, createFocusManager, tooltip } from '@hcengineering/ui'
import { createEventDispatcher } from 'svelte'
import textEditorPlugin from '../../plugin'
import { Heading } from '../../types'
@ -36,23 +37,30 @@
<FocusHandler {manager} />
<div class="header">
<span class="fs-title overflow-label title">
<Label label={textEditorPlugin.string.TableOfContents} />
</span>
<div class="m-2">
<span class="fs-title overflow-label title">
<Label label={textEditorPlugin.string.TableOfContents} />
</span>
</div>
</div>
<div class="scroll">
<div class="box">
{#each items as item}
{@const level = getIndentLevel(item.level)}
<button
class="menu-item no-focus flex-row-center item"
on:click={() => dispatch('close', item)}
use:tooltip={{ label: getEmbeddedLabel(item.title) }}
>
<div class="label overflow-label flex-grow" class:selected={item.id === selected?.id}>
<span style={`padding-left: ${level * 1.5}rem;`}>
{item.title}
</span>
</div>
</button>
{/each}
</div>
</div>
<Scroller align="start">
{#each items as item}
{@const level = getIndentLevel(item.level)}
<button class="menu-item no-focus flex-row-center item" on:click={() => dispatch('close', item)}>
<div class="label overflow-label flex-grow" class:selected={item.id === selected?.id}>
<span style={`padding-left: ${level * 1.5}rem;`}>
{item.title}
</span>
</div>
</button>
{/each}
</Scroller>
<div class="menu-space" />
<style lang="scss">
.selected {
@ -60,6 +68,7 @@
}
.title {
margin: 0 0.5rem;
@media print {
line-height: 3rem;
margin-left: 0;

2
packages/text-editor/src/components/toc/TableOfContentsPopup.svelte
View File

@ -27,5 +27,7 @@
</script>
<div class="selectPopup" use:resizeObserver={() => dispatch('changeContent')}>
<div class="menu-space" />
<TableOfContentsContent {items} {selected} on:close />
<div class="menu-space" />
</div>