Adding basic hover toolbar for all paragraphs

This commit is contained in:
Julio Ruiz 2026-05-25 18:41:45 -05:00
parent f963c48e75
commit 09b99985eb
1 changed files with 42 additions and 9 deletions

View File

@ -843,15 +843,48 @@ function highlightTextNodes(root: HTMLElement, terms: string[]): number {
<div v-for="(hit, idx) in paragraphs" :key="idx" :data-paragraph-number="hit.document.number">
<div class="grid grid-cols-1fr items-start gap-2 mb-2" :class="(showParagraphNumbers && 'grid-cols-[32px_1fr]')">
<div v-if="showParagraphNumbers" class="w-full select-none cursor-pointer flex justify-end">
<UBadge
v-if="hit.document.number"
:label="`${hit.document.number}`"
size="md"
variant="ghost"
@click="copyToClipboard(hit.document.text, hit.document.type)"
class="text-gray-300 hover:text-white"
:class="(hit.document.type=='activities'?'hover:bg-carpagreen':'hover:bg-carpablue')"
/>
<UPopover :content="{
align: 'right',
side: 'top',
sideOffset: -10
}" placement="top" :ui="{ maxWidth: 'max-w-lg' }">
<UBadge
v-if="hit.document.number"
:label="`${hit.document.number}`"
size="md"
variant="ghost"
class="text-gray-300 hover:text-white"
:class="(hit.document.type=='activities'?'hover:bg-carpagreen':'hover:bg-carpablue')"
/>
<template #content>
<UFieldGroup size="sm" orientation="horizontal" class="bg-white p-0 rounded-md shadow-md">
<UButton
v-if="hit.document.text"
icon="ph-note-pencil"
variant="ghost"
color="neutral"
size="lg"
@click="addNote(hit.document.id)"
></UButton>
<UButton
v-if="hit.document.text"
icon="ph-highlighter"
variant="ghost"
color="neutral"
size="lg"
@click="highlightParagraph(hit.document.id)"
></UButton>
<UButton
v-if="hit.document.text"
icon="ph-copy"
variant="ghost"
color="neutral"
size="lg"
@click="copyToClipboard(hit.document.text, hit.document.type)"
></UButton>
</UFieldGroup>
</template>
</UPopover>
</div>
<div class="">
<div