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

style: overhaul design to authentic Google Gemini Material 3 Dark theme
MindSift CI & Docker Release / Lint, Build & Unit Tests (push) Successful in 2m8s
Details
MindSift CI & Docker Release / Build & Push Docker Image (push) Successful in 1m45s
Details

Browse Source
This commit is contained in:
sandrodach committed 2026-10-24 18:32:03 +02:00
1 parent 10323867e9
commit 31aa43c460
11 files changed
+413 -444
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

frontend/src/features/triage/TasksView.tsx
+34 -34
View File
@@ -97,10 +97,10 @@ export const TasksView: React.FC<TasksViewProps> = ({ onRefreshStats, onOpenDocu
<div className="flex items-center gap-2">
<button
onClick={() => setFilter('open')}
className={`h-10 px-4 rounded-full text-xs sm:text-sm font-medium transition-colors ${
className={`h-9 px-4 rounded-full text-xs sm:text-sm font-medium transition-colors ${
filter === 'open'
? 'bg-[#8ab4f8] text-[#0b0f19] font-semibold'
: 'bg-[#1e1f20] text-[#9aa0a6] hover:text-[#e3e3e3] gemini-border'
? 'bg-[#282a2c] text-[#a8c7fa] border border-[#a8c7fa]/30'
: 'text-[#c4c7c5] hover:text-[#e3e3e3] hover:bg-[#1e1f20] border border-transparent'
}`}
>
Offene Aufgaben ({openTasks.length})
@@ -108,10 +108,10 @@ export const TasksView: React.FC<TasksViewProps> = ({ onRefreshStats, onOpenDocu
<button
onClick={() => setFilter('done')}
className={`h-10 px-4 rounded-full text-xs sm:text-sm font-medium transition-colors ${
className={`h-9 px-4 rounded-full text-xs sm:text-sm font-medium transition-colors ${
filter === 'done'
? 'bg-[#81c995] text-[#0b0f19] font-semibold'
: 'bg-[#1e1f20] text-[#9aa0a6] hover:text-[#e3e3e3] gemini-border'
? 'bg-[#282a2c] text-[#a8dab5] border border-[#a8dab5]/30'
: 'text-[#c4c7c5] hover:text-[#e3e3e3] hover:bg-[#1e1f20] border border-transparent'
}`}
>
Erledigt ({doneTasks.length})
@@ -119,10 +119,10 @@ export const TasksView: React.FC<TasksViewProps> = ({ onRefreshStats, onOpenDocu
<button
onClick={() => setFilter('discarded')}
className={`h-10 px-4 rounded-full text-xs sm:text-sm font-medium transition-colors ${
className={`h-9 px-4 rounded-full text-xs sm:text-sm font-medium transition-colors ${
filter === 'discarded'
? 'bg-[#f28b82] text-[#0b0f19] font-semibold'
: 'bg-[#1e1f20] text-[#9aa0a6] hover:text-[#e3e3e3] gemini-border'
? 'bg-[#282a2c] text-[#f28b82] border border-[#f28b82]/30'
: 'text-[#c4c7c5] hover:text-[#e3e3e3] hover:bg-[#1e1f20] border border-transparent'
}`}
>
Verworfen ({discarded.length})
@@ -132,7 +132,7 @@ export const TasksView: React.FC<TasksViewProps> = ({ onRefreshStats, onOpenDocu
{filter === 'discarded' && discarded.length > 0 && (
<button
onClick={handlePurgeAllDiscarded}
className="h-9 px-4 rounded-full bg-[#f28b82]/15 hover:bg-[#f28b82]/25 text-[#f28b82] text-xs font-medium flex items-center gap-1.5 transition-colors"
className="h-8 px-3.5 rounded-full bg-[#f28b82]/10 hover:bg-[#f28b82]/20 border border-[#f28b82]/25 text-[#f28b82] text-xs font-medium flex items-center gap-1.5 transition-colors"
>
<Trash2 className="w-3.5 h-3.5" />
Papierkorb leeren
@@ -141,32 +141,32 @@ export const TasksView: React.FC<TasksViewProps> = ({ onRefreshStats, onOpenDocu
</div>
{loading ? (
<div className="p-8 text-center text-[#9aa0a6] text-sm">Lade Aufgaben…</div>
<div className="p-8 text-center text-[#8e918f] text-sm">Lade Aufgaben…</div>
) : filter === 'discarded' ? (
<div className="space-y-2.5">
{discarded.length === 0 ? (
<div className="p-10 rounded-3xl bg-[#1e1f20] gemini-border text-center text-[#9aa0a6] text-sm">
<div className="p-10 rounded-2xl bg-[#1e1f20] border border-white/[0.08] text-center text-[#8e918f] text-sm">
Keine verworfenen Gedanken im Papierkorb.
</div>
) : (
discarded.map((item) => (
<div
key={item.id}
className="p-4 rounded-3xl bg-[#1e1f20] gemini-border flex items-center justify-between gap-4"
className="p-4 rounded-2xl bg-[#1e1f20] border border-white/[0.08] flex items-center justify-between gap-4"
>
<div className="min-w-0 flex-1">
<p className="text-sm text-[#9aa0a6] line-through truncate">{item.content}</p>
<p className="text-sm text-[#8e918f] line-through truncate">{item.content}</p>
</div>
<div className="flex items-center gap-2 flex-shrink-0">
<button
onClick={() => handleRestore(item)}
className="h-8 px-3 rounded-full bg-[#282a2c] hover:bg-[#323639] text-xs text-[#8ab4f8] flex items-center gap-1"
className="h-8 px-3 rounded-full bg-[#282a2c] hover:bg-[#323639] border border-white/[0.08] text-xs text-[#a8c7fa] flex items-center gap-1.5 transition-colors"
>
<RotateCcw className="w-3.5 h-3.5" /> Zurück in Inbox
</button>
<button
onClick={() => handleDeletePermanent(item.id)}
className="w-8 h-8 rounded-full bg-[#282a2c] hover:bg-[#f28b82]/20 text-[#f28b82] flex items-center justify-center"
className="w-8 h-8 rounded-full bg-[#282a2c] hover:bg-[#f28b82]/20 border border-white/[0.08] text-[#8e918f] hover:text-[#f28b82] flex items-center justify-center transition-colors"
>
<Trash2 className="w-3.5 h-3.5" />
</button>
@@ -178,33 +178,33 @@ export const TasksView: React.FC<TasksViewProps> = ({ onRefreshStats, onOpenDocu
) : (
<div className="space-y-2.5">
{(filter === 'open' ? openTasks : doneTasks).length === 0 ? (
<div className="p-10 rounded-3xl bg-[#1e1f20] gemini-border text-center text-[#9aa0a6] text-sm">
<div className="p-10 rounded-2xl bg-[#1e1f20] border border-white/[0.08] text-center text-[#8e918f] text-sm">
{filter === 'open'
? 'Keine offenen Aufgaben. Wische Gedanken in der Triage nach rechts, um Aufgaben anzulegen!'
? 'Keine offenen Aufgaben. Wische Gedanken in der Triage nach rechts, um Aufgaben anzulegen.'
: 'Noch keine erledigten Aufgaben.'}
</div>
) : (
(filter === 'open' ? openTasks : doneTasks).map((task) => (
<div
key={task.id}
className="p-4 sm:p-5 rounded-3xl bg-[#1e1f20] hover:bg-[#242628] gemini-border flex flex-col sm:flex-row sm:items-center justify-between gap-3 transition-colors"
className="p-4 sm:p-5 rounded-2xl bg-[#1e1f20] hover:bg-[#282a2c]/60 border border-white/[0.08] flex flex-col sm:flex-row sm:items-center justify-between gap-3 transition-colors"
>
<div className="flex items-start gap-3.5 min-w-0 flex-1">
<button
onClick={() => handleToggleDone(task)}
className="mt-0.5 flex-shrink-0 text-[#8ab4f8] hover:scale-110 transition-transform"
className="mt-0.5 flex-shrink-0 text-[#8e918f] hover:text-[#a8c7fa] transition-colors"
>
{task.isCompleted ? (
<CheckCircle2 className="w-5 h-5 text-[#81c995]" />
<CheckCircle2 className="w-5 h-5 text-[#a8dab5]" />
) : (
<Circle className="w-5 h-5 text-[#9aa0a6] hover:text-[#8ab4f8]" />
<Circle className="w-5 h-5" />
)}
</button>
<div className="min-w-0 flex-1">
<p
className={`text-sm sm:text-base font-medium break-words ${
task.isCompleted ? 'line-through text-[#5f6368]' : 'text-[#e3e3e3]'
className={`text-sm sm:text-base font-normal break-words ${
task.isCompleted ? 'line-through text-[#8e918f]' : 'text-[#e3e3e3]'
}`}
>
{task.content}
@@ -212,21 +212,21 @@ export const TasksView: React.FC<TasksViewProps> = ({ onRefreshStats, onOpenDocu
<div className="flex flex-wrap items-center gap-2 mt-2">
{task.priority === 'urgent' && (
<span className="px-2.5 py-0.5 rounded-full bg-[#f28b82]/20 text-[#f28b82] text-xs flex items-center gap-1">
<span className="px-2.5 py-0.5 rounded-full bg-[#f28b82]/15 text-[#f28b82] border border-[#f28b82]/25 text-xs flex items-center gap-1 font-medium">
<AlertCircle className="w-3 h-3" /> Dringend
</span>
)}
{task.priority === 'high' && (
<span className="px-2.5 py-0.5 rounded-full bg-[#8ab4f8]/20 text-[#8ab4f8] text-xs">
<span className="px-2.5 py-0.5 rounded-full bg-[#a8c7fa]/15 text-[#a8c7fa] border border-[#a8c7fa]/25 text-xs font-medium">
Hoch
</span>
)}
{task.tags?.map((tag) => (
<span
key={tag}
className="px-2.5 py-0.5 rounded-full bg-[#131314] text-[#8ab4f8] text-xs flex items-center gap-1"
className="px-2.5 py-0.5 rounded-full bg-[#131314] text-[#c4c7c5] border border-white/[0.08] text-xs flex items-center gap-1"
>
<Tag className="w-2.5 h-2.5" />#{tag}
<Tag className="w-2.5 h-2.5 text-[#8e918f]" />#{tag}
</span>
))}
</div>
@@ -236,28 +236,28 @@ export const TasksView: React.FC<TasksViewProps> = ({ onRefreshStats, onOpenDocu
{/* Action Controls */}
<div className="flex items-center gap-2 self-end sm:self-center flex-shrink-0">
<div className="relative flex items-center">
<Calendar className="w-3.5 h-3.5 text-[#8ab4f8] absolute left-3 pointer-events-none" />
<Calendar className="w-3.5 h-3.5 text-[#a8c7fa] absolute left-3 pointer-events-none" />
<input
type="date"
value={task.dueDate || ''}
onChange={(e) => handleDueDateChange(task, e.target.value)}
className="pl-8 pr-3 py-1 rounded-full bg-[#131314] text-[#e3e3e3] text-xs gemini-border focus:outline-none focus:border-[#8ab4f8]"
className="pl-8 pr-3 py-1 rounded-full bg-[#131314] text-[#e3e3e3] text-xs border border-white/[0.08] focus:outline-none focus:border-[#a8c7fa] transition-colors"
/>
</div>
<button
onClick={() => handleConvertToDoc(task)}
title="Im Workspace als Projekt-Dokument vertiefen"
className="h-8 px-3 rounded-full bg-[#282a2c] hover:bg-[#323538] text-xs text-[#c58af9] flex items-center gap-1"
title="Im Workspace als Dokument vertiefen"
className="h-8 px-3 rounded-full bg-[#282a2c] hover:bg-[#323639] border border-white/[0.08] text-xs text-[#c4c7c5] hover:text-[#e3e3e3] flex items-center gap-1.5 transition-colors"
>
<FileText className="w-3.5 h-3.5" />
<FileText className="w-3.5 h-3.5 text-[#a8c7fa]" />
<span className="hidden md:inline">Vertiefen</span>
</button>
<button
onClick={() => handleDeletePermanent(task.id)}
title="Löschen"
className="w-8 h-8 rounded-full bg-[#282a2c] hover:bg-[#f28b82]/20 text-[#9aa0a6] hover:text-[#f28b82] flex items-center justify-center"
className="w-8 h-8 rounded-full bg-[#282a2c] hover:bg-[#f28b82]/20 border border-white/[0.08] text-[#8e918f] hover:text-[#f28b82] flex items-center justify-center transition-colors"
>
<Trash2 className="w-3.5 h-3.5" />
</button>