feat(design): centralize design system with CSS variables and semantic classes in index.css
MindSift CI & Docker Release / Build, Test in Container & Push (push) Successful in 52s
MindSift CI & Docker Release / Build, Test in Container & Push (push) Successful in 52s
This commit is contained in:
1 parent
94123c9424
commit
ec9ba8fd9f
9 files changed
+428
-304
No files matched your search
@@ -95,12 +95,12 @@ export const TasksView: React.FC<TasksViewProps> = ({ onRefreshStats, onOpenDocu
|
||||
<div className="w-full space-y-2">
|
||||
{/* Filter Tabs */}
|
||||
<div className="flex flex-wrap items-center justify-between gap-2 mb-1">
|
||||
<div className="flex items-center border border-white/[0.08] bg-[#16171a]">
|
||||
<div className="flex items-center border border-border bg-canvas">
|
||||
<button
|
||||
onClick={() => setFilter('open')}
|
||||
className={`h-8 px-3.5 text-xs font-medium border-r border-white/[0.08] transition-colors ${
|
||||
className={`h-8 px-3.5 text-xs font-medium border-r border-border transition-colors ${
|
||||
filter === 'open'
|
||||
? 'bg-[#222428] text-white'
|
||||
? 'bg-panel text-white'
|
||||
: 'text-zinc-400 hover:text-white hover:bg-white/[0.02]'
|
||||
}`}
|
||||
>
|
||||
@@ -109,9 +109,9 @@ export const TasksView: React.FC<TasksViewProps> = ({ onRefreshStats, onOpenDocu
|
||||
|
||||
<button
|
||||
onClick={() => setFilter('done')}
|
||||
className={`h-8 px-3.5 text-xs font-medium border-r border-white/[0.08] transition-colors ${
|
||||
className={`h-8 px-3.5 text-xs font-medium border-r border-border transition-colors ${
|
||||
filter === 'done'
|
||||
? 'bg-[#222428] text-white'
|
||||
? 'bg-panel text-white'
|
||||
: 'text-zinc-400 hover:text-white hover:bg-white/[0.02]'
|
||||
}`}
|
||||
>
|
||||
@@ -122,7 +122,7 @@ export const TasksView: React.FC<TasksViewProps> = ({ onRefreshStats, onOpenDocu
|
||||
onClick={() => setFilter('discarded')}
|
||||
className={`h-8 px-3.5 text-xs font-medium transition-colors ${
|
||||
filter === 'discarded'
|
||||
? 'bg-[#222428] text-white'
|
||||
? 'bg-panel text-white'
|
||||
: 'text-zinc-400 hover:text-white hover:bg-white/[0.02]'
|
||||
}`}
|
||||
>
|
||||
@@ -133,7 +133,7 @@ export const TasksView: React.FC<TasksViewProps> = ({ onRefreshStats, onOpenDocu
|
||||
{filter === 'discarded' && discarded.length > 0 && (
|
||||
<button
|
||||
onClick={handlePurgeAllDiscarded}
|
||||
className="h-7 px-3 rounded-full bg-white/[0.06] hover:bg-white/[0.12] text-zinc-300 hover:text-white text-xs font-medium flex items-center gap-1.5 transition-colors"
|
||||
className="btn-action"
|
||||
>
|
||||
<Trash2 className="w-3.5 h-3.5" />
|
||||
Papierkorb leeren
|
||||
@@ -144,7 +144,7 @@ export const TasksView: React.FC<TasksViewProps> = ({ onRefreshStats, onOpenDocu
|
||||
{loading ? (
|
||||
<div className="p-6 text-center text-zinc-500 text-sm">Lade Aufgaben…</div>
|
||||
) : filter === 'discarded' ? (
|
||||
<div className="bg-[#222428] border border-white/[0.08] divide-y divide-white/[0.06]">
|
||||
<div className="panel-surface divide-y divide-border">
|
||||
{discarded.length === 0 ? (
|
||||
<div className="px-4 py-6 text-center text-zinc-400 text-sm">
|
||||
Keine verworfenen Gedanken im Papierkorb.
|
||||
@@ -162,13 +162,14 @@ export const TasksView: React.FC<TasksViewProps> = ({ onRefreshStats, onOpenDocu
|
||||
<div className="flex items-center gap-2 flex-shrink-0">
|
||||
<button
|
||||
onClick={() => handleRestore(item)}
|
||||
className="h-7 px-2.5 rounded-full bg-[#16171a] hover:bg-[#2b2d33] border border-white/[0.06] text-xs text-[#1d8cf8] flex items-center gap-1.5 transition-colors"
|
||||
className="btn-action"
|
||||
>
|
||||
<RotateCcw className="w-3 h-3" /> Zurück
|
||||
<RotateCcw className="w-3 h-3 text-accent" /> Zurück
|
||||
</button>
|
||||
<button
|
||||
onClick={() => handleDeletePermanent(item.id)}
|
||||
className="w-7 h-7 rounded-full bg-[#16171a] hover:bg-white/[0.1] text-zinc-400 hover:text-white flex items-center justify-center transition-colors"
|
||||
className="btn-icon btn-icon-danger"
|
||||
title="Endgültig löschen"
|
||||
>
|
||||
<Trash2 className="w-3 h-3" />
|
||||
</button>
|
||||
@@ -178,7 +179,7 @@ export const TasksView: React.FC<TasksViewProps> = ({ onRefreshStats, onOpenDocu
|
||||
)}
|
||||
</div>
|
||||
) : (
|
||||
<div className="bg-[#222428] border border-white/[0.08] divide-y divide-white/[0.06]">
|
||||
<div className="panel-surface divide-y divide-border">
|
||||
{(filter === 'open' ? openTasks : doneTasks).length === 0 ? (
|
||||
<div className="px-4 py-6 text-center text-zinc-400 text-sm">
|
||||
{filter === 'open'
|
||||
@@ -199,8 +200,8 @@ export const TasksView: React.FC<TasksViewProps> = ({ onRefreshStats, onOpenDocu
|
||||
onClick={() => handleToggleDone(task)}
|
||||
className={`w-4 h-4 flex items-center justify-center flex-shrink-0 transition-colors border ${
|
||||
task.isCompleted
|
||||
? 'bg-[#1d8cf8] border-[#1d8cf8] text-white'
|
||||
: 'border-zinc-500 hover:border-[#1d8cf8] text-transparent'
|
||||
? 'bg-accent border-accent text-white'
|
||||
: 'border-zinc-500 hover:border-accent text-transparent'
|
||||
}`}
|
||||
title={task.isCompleted ? 'Als offen markieren' : 'Als erledigt abhaken'}
|
||||
>
|
||||
@@ -218,7 +219,7 @@ export const TasksView: React.FC<TasksViewProps> = ({ onRefreshStats, onOpenDocu
|
||||
|
||||
<div className="flex flex-wrap items-center gap-1.5 mt-0.5 empty:hidden">
|
||||
{task.priority === 'urgent' && (
|
||||
<span className="px-1.5 py-0.2 border border-[#1d8cf8] text-[#1d8cf8] text-[10px] font-semibold">
|
||||
<span className="badge-accent">
|
||||
Dringend
|
||||
</span>
|
||||
)}
|
||||
@@ -230,7 +231,7 @@ export const TasksView: React.FC<TasksViewProps> = ({ onRefreshStats, onOpenDocu
|
||||
{task.tags?.map((tag) => (
|
||||
<span
|
||||
key={tag}
|
||||
className="px-1.5 py-0.2 bg-[#16171a] text-zinc-400 text-[10px]"
|
||||
className="px-1.5 py-0.2 bg-canvas text-zinc-400 text-[10px]"
|
||||
>
|
||||
#{tag}
|
||||
</span>
|
||||
@@ -247,23 +248,23 @@ export const TasksView: React.FC<TasksViewProps> = ({ onRefreshStats, onOpenDocu
|
||||
type="date"
|
||||
value={task.dueDate || ''}
|
||||
onChange={(e) => handleDueDateChange(task, e.target.value)}
|
||||
className="h-7 pl-6 pr-2 bg-[#16171a] text-white text-xs border border-white/[0.08] focus:outline-none focus:border-[#1d8cf8] transition-colors"
|
||||
className="h-7 pl-6 pr-2 input-field text-xs"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<button
|
||||
onClick={() => handleConvertToDoc(task)}
|
||||
title="Als Notiz / Projekt vertiefen"
|
||||
className="h-7 px-2.5 rounded-full bg-[#16171a] hover:bg-[#2b2d33] border border-white/[0.06] text-xs text-zinc-300 hover:text-white flex items-center gap-1.5 transition-colors"
|
||||
className="btn-action"
|
||||
>
|
||||
<FileText className="w-3 h-3 text-[#1d8cf8]" />
|
||||
<FileText className="w-3 h-3 text-accent" />
|
||||
<span className="hidden md:inline">Vertiefen</span>
|
||||
</button>
|
||||
|
||||
<button
|
||||
onClick={() => handleDeletePermanent(task.id)}
|
||||
title="Löschen"
|
||||
className="w-7 h-7 rounded-full bg-[#16171a] hover:bg-white/[0.1] text-zinc-400 hover:text-white flex items-center justify-center transition-colors"
|
||||
className="btn-icon btn-icon-danger"
|
||||
>
|
||||
<Trash2 className="w-3 h-3" />
|
||||
</button>
|
||||
|
||||
Reference in new issue
Block a user