sandrodach/MindSift
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(theme): style share modal and inputs for dark mode compatibility
MindSift CI & Docker Release / Build, Test in Container & Push (push) Successful in 58s
Details

Browse Source
This commit is contained in:
sandrodach committed 2026-10-25 11:39:29 +01:00
1 parent 0affb827a4
commit 1009487cce
4 files changed
+128 -39
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

frontend/src/features/workspace/WorkspaceView.tsx
+58 -27
View File
@@ -43,6 +43,7 @@ import {
Lock,
Unlock,
Eye,
Edit3,
Share,
Share2,
} from 'lucide-react';
@@ -2881,19 +2882,19 @@ export const WorkspaceView: React.FC<WorkspaceViewProps> = ({
{/* If current user is owner: can add shares and manage permissions */}
{selectedDoc.isOwner !== false ? (
<div className="space-y-4">
<form onSubmit={handleAddShare} className="space-y-2.5 p-3 bg-canvas border border-border rounded-card">
<form onSubmit={handleAddShare} className="space-y-2.5 p-3 bg-panel-elevated border border-border rounded-card">
<div className="text-xs font-semibold text-main">Neuen Nutzer einladen / berechtigen</div>
<div className="flex flex-col sm:flex-row gap-2">
<select
value={shareTargetEmailOrId}
onChange={(e) => setShareTargetEmailOrId(e.target.value)}
className="input-base text-xs flex-1"
className="input-field h-8 px-2.5 bg-input text-main border border-border rounded-btn focus:outline-none focus:border-accent text-xs flex-1 cursor-pointer"
>
<option value="">Nutzer auswählen oder Email eingeben…</option>
<option value="" className="bg-panel text-muted">Nutzer auswählen oder Email eingeben…</option>
{collaborators
.filter((u) => u.id !== currentUser?.id && !docShares.some((s) => s.userId === u.id))
.map((u) => (
<option key={u.id} value={u.id}>
<option key={u.id} value={u.id} className="bg-panel text-main">
{u.displayName || u.email} ({u.email})
</option>
))}
@@ -2901,10 +2902,10 @@ export const WorkspaceView: React.FC<WorkspaceViewProps> = ({
<select
value={sharePermission}
onChange={(e) => setSharePermission(e.target.value as 'read' | 'write')}
className="input-base text-xs w-full sm:w-36"
className="input-field h-8 px-2.5 bg-input text-main border border-border rounded-btn focus:outline-none focus:border-accent text-xs w-full sm:w-40 cursor-pointer"
>
<option value="read">Nur Lesen (read)</option>
<option value="write">Schreiben (write)</option>
<option value="read" className="bg-panel text-main">Nur Lesen (read)</option>
<option value="write" className="bg-panel text-main">Schreiben (write)</option>
</select>
</div>
@@ -2915,7 +2916,7 @@ export const WorkspaceView: React.FC<WorkspaceViewProps> = ({
placeholder="Oder E-Mail-Adresse direkt eingeben…"
value={shareTargetEmailOrId}
onChange={(e) => setShareTargetEmailOrId(e.target.value)}
className="input-base text-xs w-full"
className="input-field h-8 px-2.5 bg-input text-main border border-border rounded-btn focus:outline-none focus:border-accent text-xs w-full"
/>
)}
@@ -2935,7 +2936,7 @@ export const WorkspaceView: React.FC<WorkspaceViewProps> = ({
<div className="space-y-2">
<div className="text-xs font-semibold text-main">Aktuelle Freigaben ({docShares.length})</div>
{docShares.length === 0 ? (
<div className="p-3 bg-canvas border border-border rounded-card text-xs text-muted text-center">
<div className="p-3 bg-panel-elevated border border-border rounded-card text-xs text-muted text-center">
Diese Notiz ist bisher noch mit niemandem geteilt.
</div>
) : (
@@ -2943,7 +2944,7 @@ export const WorkspaceView: React.FC<WorkspaceViewProps> = ({
{docShares.map((share) => (
<div
key={share.id || share.userId}
className="p-2.5 bg-canvas border border-border rounded-card flex items-center justify-between gap-3 text-xs"
className="p-2.5 bg-panel-elevated border border-border rounded-card flex items-center justify-between gap-3 text-xs"
>
<div className="min-w-0">
<div className="font-semibold text-main truncate">
@@ -2958,11 +2959,11 @@ export const WorkspaceView: React.FC<WorkspaceViewProps> = ({
<select
value={share.permission}
onChange={(e) => handleUpdateSharePerm(share.userId, e.target.value as 'read' | 'write')}
className="input-base text-[11px] py-1 px-2 h-7"
className="input-field h-7 px-2 bg-input text-main border border-border rounded-btn focus:outline-none focus:border-accent text-[11px] cursor-pointer"
disabled={sharingLoading}
>
<option value="read">Nur Lesen</option>
<option value="write">Schreiben</option>
<option value="read" className="bg-panel text-main">Nur Lesen</option>
<option value="write" className="bg-panel text-main">Schreiben</option>
</select>
<button
@@ -2983,23 +2984,53 @@ export const WorkspaceView: React.FC<WorkspaceViewProps> = ({
</div>
) : (
/* If current user is a collaborator */
<div className="space-y-4 p-4 bg-canvas border border-border rounded-card text-xs">
<div className="text-main font-semibold">Geteilte Notiz</div>
<div className="text-muted">
Besitzer: <span className="text-main font-medium">{selectedDoc.ownerName || 'Unbekannt'}</span>
</div>
<div className="text-muted">
Deine Berechtigung:{' '}
<span className="text-accent font-semibold">
{selectedDoc.permission === 'write' ? 'Schreibzugriff (Bearbeiten erlaubt)' : 'Nur Lesezugriff'}
</span>
<div className="space-y-3">
{/* Document & Owner Card */}
<div className="p-3 bg-panel-elevated border border-border rounded-card space-y-2">
<div className="flex items-center justify-between text-xs">
<span className="text-muted">Eigentümer der Notiz:</span>
<span className="font-semibold text-main flex items-center gap-1.5">
<span className="w-5 h-5 rounded-full bg-accent/20 text-accent text-[10px] font-bold flex items-center justify-center">
{(selectedDoc.ownerName || 'U').slice(0, 1).toUpperCase()}
</span>
<span>{selectedDoc.ownerName || 'Unbekannt'}</span>
</span>
</div>
</div>
<div className="pt-2 border-t border-border">
{/* Permission Card */}
{selectedDoc.permission === 'write' ? (
<div className="p-3 bg-emerald-500/10 border border-emerald-500/30 rounded-card flex items-start gap-3">
<div className="w-8 h-8 rounded-btn bg-emerald-500/20 text-emerald-600 dark:text-emerald-400 flex items-center justify-center flex-shrink-0 mt-0.5">
<Edit3 className="w-4 h-4" />
</div>
<div className="text-xs space-y-0.5">
<div className="font-semibold text-emerald-600 dark:text-emerald-400">Schreibzugriff aktiv</div>
<div className="text-muted">
Du hast Bearbeitungsrechte für diese Notiz und kannst Inhalte in Echtzeit anpassen.
</div>
</div>
</div>
) : (
<div className="p-3 bg-accent/10 border border-accent/30 rounded-card flex items-start gap-3">
<div className="w-8 h-8 rounded-btn bg-accent/20 text-accent flex items-center justify-center flex-shrink-0 mt-0.5">
<Eye className="w-4 h-4" />
</div>
<div className="text-xs space-y-0.5">
<div className="font-semibold text-accent">Nur Lesezugriff</div>
<div className="text-muted">
Du kannst diese Notiz ansehen und durchsuchen, aber keine Änderungen an den Inhalten vornehmen.
</div>
</div>
</div>
)}
{/* Action: Leave Share */}
<div className="pt-2">
<button
type="button"
onClick={handleLeaveShare}
className="btn-danger h-8 px-3 text-xs flex items-center gap-1.5"
className="w-full btn-action h-8 px-3 text-xs text-status-err hover:bg-status-err-bg border border-status-err-border rounded-btn flex items-center justify-center gap-1.5 transition-colors"
>
<Trash2 className="w-3.5 h-3.5" />
<span>Notiz aus meinem Workspace entfernen</span>
@@ -3012,9 +3043,9 @@ export const WorkspaceView: React.FC<WorkspaceViewProps> = ({
<button
type="button"
onClick={() => setShowShareModal(false)}
className="btn-secondary h-8 px-4 text-xs"
className="btn-action h-8 px-4 text-xs font-medium"
>
Fertig
Schließen
</button>
</div>
</div>