Hacker-Software/opencrm
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

PdfDragButton: Info-Icon mit Chrome/Edge-Hinweis als Tooltip

Browse Source 
Kleines Info-Icon hinter dem Drag-Element mit Tooltip, dass das Ziehen
nur in Chrome/Edge funktioniert und man in Firefox stattdessen klicken
soll. Gilt automatisch an allen Einbaustellen.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
duffyduck
2026-07-30 11:55:06 +02:00
co-authored by Claude Opus 4.8
parent a509bb7826
commit 8e74f7733a
1 changed files with 19 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/components/ui/PdfDragButton.tsx
+19 -11
View File
@@ -1,4 +1,4 @@
import { GripVertical, FileDown } from 'lucide-react';
import { GripVertical, FileDown, Info } from 'lucide-react';
import { fileUrl } from '../../utils/fileUrl';
/**
@@ -81,16 +81,24 @@ export default function PdfDragButton({
const iconSize = size === 'sm' ? 'w-3.5 h-3.5' : 'w-4 h-4';
return (
<span
draggable
onDragStart={handleDragStart}
onClick={() => window.open(fileUrl(path, { inline: true }), '_blank', 'noopener')}
title={title || 'In Outlook/Explorer ziehen (Chrome/Edge). Klick: im Tab öffnen.'}
className={`inline-flex items-center gap-1 cursor-grab active:cursor-grabbing select-none rounded border border-gray-200 bg-gray-50 px-1.5 py-0.5 text-xs text-gray-600 hover:text-blue-600 hover:border-blue-300 hover:bg-blue-50 transition-colors ${className}`}
>
<GripVertical className={`${iconSize} text-gray-400`} />
<FileDown className={iconSize} />
<span>{label}</span>
<span className={`inline-flex items-center gap-1 ${className}`}>
<span
draggable
onDragStart={handleDragStart}
onClick={() => window.open(fileUrl(path, { inline: true }), '_blank', 'noopener')}
title={title || 'In Outlook/Explorer ziehen (Chrome/Edge). Klick: im Tab öffnen.'}
className="inline-flex items-center gap-1 cursor-grab active:cursor-grabbing select-none rounded border border-gray-200 bg-gray-50 px-1.5 py-0.5 text-xs text-gray-600 hover:text-blue-600 hover:border-blue-300 hover:bg-blue-50 transition-colors"
>
<GripVertical className={`${iconSize} text-gray-400`} />
<FileDown className={iconSize} />
<span>{label}</span>
</span>
<span
className="inline-flex cursor-help text-gray-400"
title="Ziehen funktioniert nur in Chrome/Edge. In Firefox stattdessen anklicken, um das PDF zu öffnen."
>
<Info className={iconSize} />
</span>
</span>
);
}