d8dfun/claudecodeui
1
0
Fork 0
mirror of https://github.com/siteboon/claudecodeui.git synced 2026-02-21 16:17:34 +00:00
Code Issues Packages Projects Releases Wiki Activity

Update file permissions to executable for multiple files and add Dark Mode toggle functionality with theme context management. Introduce Quick Settings Panel for user preferences and enhance project display name generation in server logic.

Browse Source
This commit is contained in:
Simos
2025-07-03 23:15:36 +02:00
parent 01481f9114
commit 845d5346eb
64 changed files with 562 additions and 100 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
src/components/TodoList.jsx Normal file → Executable file
View File

@@ -10,43 +10,43 @@ const TodoList = ({ todos, isResult = false }) => {
const getStatusIcon = (status) => {
switch (status) {
case 'completed':
return <CheckCircle2 className="w-4 h-4 text-green-500" />;
return <CheckCircle2 className="w-4 h-4 text-green-500 dark:text-green-400" />;
case 'in_progress':
return <Clock className="w-4 h-4 text-blue-500" />;
return <Clock className="w-4 h-4 text-blue-500 dark:text-blue-400" />;
case 'pending':
default:
return <Circle className="w-4 h-4 text-gray-400" />;
return <Circle className="w-4 h-4 text-gray-400 dark:text-gray-500" />;
}
};
const getStatusColor = (status) => {
switch (status) {
case 'completed':
return 'bg-green-100 text-green-800 border-green-200';
return 'bg-green-100 dark:bg-green-900/30 text-green-800 dark:text-green-200 border-green-200 dark:border-green-800';
case 'in_progress':
return 'bg-blue-100 text-blue-800 border-blue-200';
return 'bg-blue-100 dark:bg-blue-900/30 text-blue-800 dark:text-blue-200 border-blue-200 dark:border-blue-800';
case 'pending':
default:
return 'bg-gray-100 text-gray-600 border-gray-200';
return 'bg-gray-100 dark:bg-gray-800 text-gray-600 dark:text-gray-400 border-gray-200 dark:border-gray-700';
}
};
const getPriorityColor = (priority) => {
switch (priority) {
case 'high':
return 'bg-red-100 text-red-700 border-red-200';
return 'bg-red-100 dark:bg-red-900/30 text-red-700 dark:text-red-300 border-red-200 dark:border-red-800';
case 'medium':
return 'bg-yellow-100 text-yellow-700 border-yellow-200';
return 'bg-yellow-100 dark:bg-yellow-900/30 text-yellow-700 dark:text-yellow-300 border-yellow-200 dark:border-yellow-800';
case 'low':
default:
return 'bg-gray-100 text-gray-600 border-gray-200';
return 'bg-gray-100 dark:bg-gray-800 text-gray-600 dark:text-gray-400 border-gray-200 dark:border-gray-700';
}
};
return (
<div className="space-y-3">
{isResult && (
<div className="text-sm font-medium text-gray-700 mb-3">
<div className="text-sm font-medium text-gray-700 dark:text-gray-300 mb-3">
Todo List ({todos.length} {todos.length === 1 ? 'item' : 'items'})
</div>
)}
@@ -54,7 +54,7 @@ const TodoList = ({ todos, isResult = false }) => {
{todos.map((todo) => (
<div
key={todo.id}
className="flex items-start gap-3 p-3 bg-white border rounded-lg shadow-sm hover:shadow-md transition-shadow"
className="flex items-start gap-3 p-3 bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-700 rounded-lg shadow-sm hover:shadow-md dark:shadow-gray-900/50 transition-shadow"
>
<div className="flex-shrink-0 mt-0.5">
{getStatusIcon(todo.status)}
@@ -62,7 +62,7 @@ const TodoList = ({ todos, isResult = false }) => {
<div className="flex-1 min-w-0">
<div className="flex items-start justify-between gap-2 mb-2">
<p className={`text-sm font-medium ${todo.status === 'completed' ? 'line-through text-gray-500' : 'text-gray-900'}`}>
<p className={`text-sm font-medium ${todo.status === 'completed' ? 'line-through text-gray-500 dark:text-gray-400' : 'text-gray-900 dark:text-gray-100'}`}>
{todo.content}
</p>