fix(tasks): unify grouped column container

This commit is contained in:
lizerk 2026-08-06 19:02:26 +03:00
parent ba5dc52d10
commit 31a0ec922f
2 changed files with 8 additions and 11 deletions

View File

@ -1000,7 +1000,7 @@ html[data-bs-theme="dark"] .shadow-xl {
.tasks-board-column-group {
--tasks-board-stack-gap: 0.5rem;
--tasks-board-column-header-height: 4rem;
--tasks-board-subcolumn-header-height: 5.125rem;
--tasks-board-subcolumn-header-height: 4rem;
}
.tasks-board-column-header {
@ -1009,7 +1009,6 @@ html[data-bs-theme="dark"] .shadow-xl {
z-index: 30;
min-height: var(--tasks-board-column-header-height, 4rem);
background: var(--surface-elevated);
box-shadow: 0 var(--tasks-board-stack-gap, 0.5rem) 0 var(--background);
}
.tasks-board-subcolumn-header-row {
@ -1019,22 +1018,20 @@ html[data-bs-theme="dark"] .shadow-xl {
+ var(--tasks-board-stack-gap, 0.5rem)
);
z-index: 20;
min-height: var(--tasks-board-subcolumn-header-height, 5.125rem);
min-height: var(--tasks-board-subcolumn-header-height, 4rem);
background: var(--surface-secondary);
box-shadow: 0 var(--tasks-board-stack-gap, 0.5rem) 0 var(--background);
}
.tasks-board-lane-header {
position: sticky;
top: calc(
var(--tasks-board-column-header-height, 4rem)
+ var(--tasks-board-subcolumn-header-height, 5.125rem)
+ var(--tasks-board-subcolumn-header-height, 4rem)
+ var(--tasks-board-stack-gap, 0.5rem)
+ var(--tasks-board-stack-gap, 0.5rem)
);
z-index: 15;
background: var(--surface-secondary);
box-shadow: 0 var(--tasks-board-stack-gap, 0.5rem) 0 var(--surface-secondary);
}
.tasks-board-content-section-continuous {

View File

@ -1216,7 +1216,7 @@ function BoardSubcolumnHeader({
className={`flex w-full min-w-0 flex-col transition ${isDragging ? "opacity-70" : ""}`}
>
<div
className={`flex items-center justify-between gap-3 rounded-xl border bg-[var(--surface-primary)] px-3 py-3 shadow-sm transition ${columnBorderClass} ${
className={`flex min-h-16 items-center justify-between gap-3 rounded-xl border bg-[var(--surface-primary)] px-3 py-3 shadow-sm transition ${columnBorderClass} ${
isDragging ? "shadow-xl" : ""
}`}
>
@ -1517,7 +1517,7 @@ function BoardColumnGroup({
</div>
</div>
{contentVisible ? (
<div className="mt-2 flex w-full min-w-0 flex-col gap-2 xl:w-auto xl:min-w-max">
<div className="mt-2 flex w-full min-w-0 flex-col gap-2 rounded-xl border border-[var(--border-subtle)] bg-[var(--surface-secondary)] p-2 xl:w-auto xl:min-w-max">
{children}
</div>
) : null}
@ -1547,7 +1547,7 @@ function BoardColumnRowView({
hasFollowingSection: boolean;
}) {
return (
<section className={`tasks-board-content-section min-w-0 rounded-xl border border-[var(--border-subtle)] bg-[var(--surface-secondary)] p-2 ${
<section className={`tasks-board-content-section min-w-0 ${
hasFollowingSection ? "tasks-board-content-section-continuous" : ""
}`}>
<div className={`tasks-board-lane-header flex items-center justify-between gap-3 px-1 ${expanded ? "mb-2" : ""}`}>
@ -1632,7 +1632,7 @@ function BoardBaseColumnsView({
hasFollowingSection: boolean;
}) {
return (
<section className={`tasks-board-content-section min-w-0 rounded-xl border border-[var(--border-subtle)] bg-[var(--surface-secondary)] p-2 ${
<section className={`tasks-board-content-section min-w-0 ${
hasFollowingSection ? "tasks-board-content-section-continuous" : ""
}`}>
{headers ? (
@ -7070,7 +7070,7 @@ function TasksPageContent() {
return (
<div className="flex min-w-0 flex-col gap-2 xl:w-max">
<div
className="tasks-board-subcolumn-header-row flex min-w-0 flex-col gap-2 rounded-xl border border-[var(--border-subtle)] bg-[var(--surface-secondary)] p-2 xl:grid xl:w-max"
className="tasks-board-subcolumn-header-row flex min-w-0 flex-col gap-2 xl:grid xl:w-max"
style={{ gridTemplateColumns }}
>
{subcolumnHeaders}