adminbruno/docuseal
1
0 Fork 0
mirror of https://github.com/docusealco/docuseal synced 2026-11-14 15:52:32 -05:00
Code Issues Packages Projects Releases Wiki Activity

sticky table tools

Browse Source
This commit is contained in:
Pete Matsyburka committed 2026-10-03 18:35:29 +03:00
1 parent 5c168f4a29
commit c1c99621ff
1 file changed
+33 -29
Download Patch File Download Diff File Expand all files Collapse all files
app/javascript/template_builder/dynamic_block_menu.vue
+33 -29
View File
@@ -4,42 +4,46 @@
:style="{ top: coords.top + 'px', left: coords.left + 'px', width: coords.width + 'px', height: coords.height + 'px' }" :style="{ top: coords.top + 'px', left: coords.left + 'px', width: coords.width + 'px', height: coords.height + 'px' }"
> >
<div <div
ref="toolbar" class="absolute left-0 bottom-0"
class="absolute left-0 flex flex-col sm:flex-row gap-0.5 p-1 bg-white border border-neutral-200 rounded-lg shadow-lg pointer-events-auto"
:style="{ top: Math.max(coords.top - toolbarHeight - 2, 0) - coords.top + 'px' }" :style="{ top: Math.max(coords.top - toolbarHeight - 2, 0) - coords.top + 'px' }"
@mousedown.prevent
> >
<div <div
v-for="(row, rowIndex) in actionRows" ref="toolbar"
:key="rowIndex" class="sticky top-1.5 flex flex-col sm:flex-row gap-0.5 p-1 bg-white border border-neutral-200 rounded-lg shadow-lg pointer-events-auto"
class="flex items-center gap-0.5" @mousedown.prevent
> >
<template <div
v-for="(group, groupIndex) in row" v-for="(row, rowIndex) in actionRows"
:key="groupIndex" :key="rowIndex"
class="flex items-center gap-0.5"
> >
<div <template
v-if="rowIndex > 0 || groupIndex > 0" v-for="(group, groupIndex) in row"
class="w-px h-5 bg-neutral-200 mx-1" :key="groupIndex"
:class="{ 'hidden sm:block': rowIndex > 0 && groupIndex === 0 }"
/>
<button
v-for="action in group"
:key="action.title"
class="inline-flex items-center justify-center w-7 h-7 rounded-md"
:class="{ 'text-red-600': action.danger, 'bg-neutral-200': action.active, 'hover:bg-neutral-100': !action.active && !isDisabled(action), 'opacity-50 cursor-not-allowed': isDisabled(action) }"
:title="action.structural && !coords.isRegular ? t('irregular_table_structure') : t(action.title)"
:disabled="isDisabled(action)"
@click="$emit('command', action.command, action.arg)"
> >
<component <div
:is="action.icon" v-if="rowIndex > 0 || groupIndex > 0"
:width="16" class="w-px h-5 bg-neutral-200 mx-1"
:height="16" :class="{ 'hidden sm:block': rowIndex > 0 && groupIndex === 0 }"
:stroke-width="1.6"
/> />
</button> <button
</template> v-for="action in group"
:key="action.title"
class="inline-flex items-center justify-center w-7 h-7 rounded-md"
:class="{ 'text-red-600': action.danger, 'bg-neutral-200': action.active, 'hover:bg-neutral-100': !action.active && !isDisabled(action), 'opacity-50 cursor-not-allowed': isDisabled(action) }"
:title="action.structural && !coords.isRegular ? t('irregular_table_structure') : t(action.title)"
:disabled="isDisabled(action)"
@click="$emit('command', action.command, action.arg)"
>
<component
:is="action.icon"
:width="16"
:height="16"
:stroke-width="1.6"
/>
</button>
</template>
</div>
</div> </div>
</div> </div>
<div <div