danak/danak-admin
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

responsive task manager

Browse Source
This commit is contained in:
hamid zarghami
2026-06-20 09:21:13 +03:30
parent 19d60a9225
commit f836abd8f4
8 changed files with 80 additions and 71 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/pages/taskmanager/components/task-detail/TaskDetailMetadataPreview.tsx
+12 -8
View File
@@ -19,8 +19,8 @@ const TaskDetailMetadataPreview: FC<Props> = ({ selectedLabels, selectedUsers, s
const dateLabel = formatDateRange(startDate, endDate);
return (
<div className="mt-7 flex gap-10">
<div>
<div className="mt-5 sm:mt-7 grid grid-cols-[auto_auto] gap-x-6 gap-y-4 sm:flex sm:flex-wrap sm:gap-x-10 sm:gap-y-4">
<div className="min-w-0">
<div className="text-xs font-medium mb-2">{t("taskmanager.task_detail.labels")}</div>
<div className="flex items-center gap-2 flex-wrap">
{selectedLabels.map((label) => (
@@ -34,7 +34,7 @@ const TaskDetailMetadataPreview: FC<Props> = ({ selectedLabels, selectedUsers, s
))}
<button
type="button"
className="size-7 rounded-lg border border-[#D0D0D0] bg-white/60 flex items-center justify-center cursor-pointer"
className="size-7 rounded-lg border border-[#D0D0D0] bg-white/60 flex items-center justify-center cursor-pointer shrink-0"
aria-label={t("taskmanager.task_detail.new_label")}
>
<Add
@@ -45,13 +45,13 @@ const TaskDetailMetadataPreview: FC<Props> = ({ selectedLabels, selectedUsers, s
</div>
</div>
<div>
<div className="min-w-0">
<div className="text-xs font-medium mb-2">{t("taskmanager.users")}</div>
<div className="flex items-center gap-2 flex-wrap">
{selectedUsers.map((user) => (
<div
key={user.id}
className="size-8 rounded-full bg-[#D0D0D0] overflow-hidden"
className="size-8 rounded-full bg-[#D0D0D0] overflow-hidden shrink-0"
>
<img
src={user.avatar ?? AvatarImage}
@@ -62,7 +62,7 @@ const TaskDetailMetadataPreview: FC<Props> = ({ selectedLabels, selectedUsers, s
))}
<button
type="button"
className="size-7 rounded-full border border-[#D0D0D0] bg-white/60 flex items-center justify-center cursor-pointer"
className="size-7 rounded-full border border-[#D0D0D0] bg-white/60 flex items-center justify-center cursor-pointer shrink-0"
aria-label={t("taskmanager.users")}
>
<Add
@@ -73,9 +73,13 @@ const TaskDetailMetadataPreview: FC<Props> = ({ selectedLabels, selectedUsers, s
</div>
</div>
<div>
<div className="col-span-2 sm:col-span-1 min-w-0">
<div className="text-xs font-medium mb-2">{t("taskmanager.task_detail.date")}</div>
{dateLabel ? <span className="inline-flex items-center h-7 px-3 rounded-lg text-xs font-medium bg-[#E8E8E8] text-[#292D32]">{dateLabel}</span> : null}
{dateLabel ? (
<span className="inline-flex items-center min-h-7 px-3 py-1 rounded-lg text-xs font-medium bg-[#E8E8E8] text-[#292D32] whitespace-nowrap">
{dateLabel}
</span>
) : null}
</div>
</div>
);