Kahroba/team-presence
8
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Remove blocked column from kanban board
Test and publish / verify (push) Successful in 2m41s
Details

Browse Source
This commit is contained in:
nfel
2026-08-02 12:52:08 +03:30
parent 0800487ddd
commit b0f486f026
6 changed files with 289 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files
internal/app/static/style.css
+45 -29
View File
@@ -329,8 +329,8 @@ blockquote { margin: 10px 0; padding-left: 12px; border-left: 2px solid #d8dfdb;
.board-filter-popover label > span { display: block; color: var(--muted); font-size: .57rem; }
.board-filter-popover select { min-height: 35px; margin-top: 5px; padding: 7px 29px 7px 9px; border: 0; background-color: var(--paper); font-size: .62rem; }
.board-filter-popover .button { min-height: 37px; font-size: .62rem; }
.kanban-board { display: grid; grid-template-columns: repeat(4, minmax(270px, 1fr)); gap: 14px; align-items: start; max-width: 1380px; margin: 0 auto; overflow-x: auto; padding-bottom: 18px; }
.kanban-column { min-width: 270px; padding: 13px; border: 1px solid var(--line); border-radius: 15px; background: #eef2ef; }
.kanban-board { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; align-items: start; max-width: 1500px; margin: 0 auto; padding-bottom: 18px; }
.kanban-column { min-width: 0; padding: 13px; border: 1px solid var(--line); border-radius: 15px; background: #eef2ef; }
.kanban-column-head { display: flex; justify-content: space-between; align-items: start; min-height: 51px; padding: 4px 5px 12px; }
.kanban-column-head > div { display: grid; grid-template-columns: 9px 1fr; column-gap: 8px; align-items: center; }
.column-dot { width: 8px; height: 8px; border-radius: 50%; background: #87938d; }
@@ -342,22 +342,21 @@ blockquote { margin: 10px 0; padding-left: 12px; border-left: 2px solid #d8dfdb;
.kanban-column-head > b { display: grid; min-width: 23px; height: 23px; place-items: center; border-radius: 20px; background: var(--white); color: var(--muted); font-size: .62rem; }
.kanban-cards { display: grid; gap: 9px; min-height: 100px; border-radius: 11px; transition: background .16s ease, box-shadow .16s ease; }
.kanban-cards.drag-over { background: rgba(70, 126, 100, .1); box-shadow: inset 0 0 0 2px #6c9c85; }
.kanban-card { padding: 14px; border: 1px solid #dfe4e1; border-radius: 11px; background: var(--white); box-shadow: 0 3px 10px rgba(24, 36, 31, .045); cursor: grab; transition: opacity .15s ease, transform .15s ease, box-shadow .15s ease; }
.kanban-card { position: relative; padding: 13px 14px; border: 1px solid #dfe4e1; border-radius: 11px; background: var(--white); box-shadow: 0 3px 10px rgba(24, 36, 31, .045); cursor: grab; transition: opacity .15s ease, transform .15s ease, box-shadow .15s ease; }
.kanban-card:hover { transform: translateY(-1px); box-shadow: 0 7px 18px rgba(24, 36, 31, .09); }
.kanban-card.dragging { opacity: .45; transform: rotate(1.5deg); }
.kanban-card.moving { opacity: .35; pointer-events: none; }
.card-tags { display: flex; flex-wrap: wrap; gap: 4px; margin-bottom: 9px; }
.card-topline { display: flex; justify-content: space-between; gap: 8px; align-items: center; margin-bottom: 9px; }
.card-tags { display: flex; flex-wrap: wrap; gap: 4px; }
.card-topline { display: flex; justify-content: space-between; gap: 8px; align-items: start; min-height: 21px; margin-bottom: 7px; }
.card-signals { display: flex; flex-wrap: wrap; gap: 5px; justify-content: flex-end; }
.task-id { color: #9aa39e; font-size: .58rem; font-weight: 700; }
.task-due { padding: 4px 6px; border-radius: 6px; background: var(--sand); color: #786039; font-size: .55rem; font-weight: 700; }
.importance-badge { padding: 4px 6px; border-radius: 6px; background: var(--paper); color: var(--muted); font-size: .53rem; font-weight: 800; text-transform: uppercase; }
.importance-badge.low { background: #edf0ee; color: #68736e; }
.importance-badge.high { background: #f6eddc; color: #87662c; }
.importance-badge.urgent { background: #f5e6e4; color: #9d4a44; }
.kanban-card h3 { margin-bottom: 7px; font-size: .84rem; line-height: 1.35; }
.kanban-card > p { display: -webkit-box; overflow: hidden; margin-bottom: 13px; color: #64706a; font-size: .68rem; line-height: 1.55; white-space: pre-wrap; overflow-wrap: anywhere; -webkit-box-orient: vertical; -webkit-line-clamp: 4; }
.task-meta { display: flex; justify-content: space-between; gap: 8px; align-items: center; padding-top: 10px; border-top: 1px solid var(--line); }
.task-due { padding: 3px 5px; border-radius: 6px; background: var(--sand); color: #786039; font-size: .53rem; font-weight: 700; }
.todo-progress { padding: 3px 5px; border-radius: 6px; background: var(--mint); color: var(--green-2); font-size: .53rem; font-weight: 800; }
.importance-emoji { display: grid; width: 21px; height: 21px; place-items: center; border-radius: 6px; background: var(--paper); font-size: .66rem; line-height: 1; }
.importance-emoji.high { background: #f6eddc; }
.importance-emoji.urgent { background: #f5e6e4; }
.kanban-card h3 { margin: 0 0 6px; font-size: .84rem; line-height: 1.3; }
.kanban-card > p { display: -webkit-box; overflow: hidden; margin: 0 0 10px; color: #64706a; font-size: .68rem; line-height: 1.45; white-space: pre-wrap; overflow-wrap: anywhere; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.task-meta { display: flex; justify-content: space-between; gap: 8px; align-items: center; padding-top: 9px; padding-right: 27px; border-top: 1px solid var(--line); }
.task-assignees { display: flex; min-width: 0; flex-wrap: wrap; gap: 7px; }
.task-assignee { display: flex; min-width: 0; gap: 6px; align-items: center; color: #53605a; font-size: .61rem; font-weight: 700; }
.task-assignee i { display: grid; width: 24px; height: 24px; flex: 0 0 24px; place-items: center; border-radius: 50%; background: var(--blue); color: #4d6e94; font-size: .59rem; font-style: normal; }
@@ -365,34 +364,49 @@ blockquote { margin: 10px 0; padding-left: 12px; border-left: 2px solid #d8dfdb;
.task-assignee span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.task-assignee.unassigned { color: var(--muted); font-weight: 500; }
.task-creator { overflow: hidden; color: #9aa39e; font-size: .54rem; text-overflow: ellipsis; white-space: nowrap; }
.card-controls { margin: 10px -3px -5px; }
.card-controls > summary { display: flex; justify-content: space-between; align-items: center; padding: 5px 3px; color: var(--muted); font-size: .57rem; font-weight: 700; cursor: pointer; list-style: none; }
.card-controls { position: static; }
.card-controls > summary { position: absolute; right: 10px; bottom: 10px; display: grid; width: 25px; height: 25px; place-items: center; border-radius: 8px; color: var(--muted); font-size: .95rem; font-weight: 800; line-height: 1; cursor: pointer; list-style: none; }
.card-controls > summary:hover, .card-controls[open] > summary { background: var(--paper); color: var(--ink); }
.card-controls > summary::-webkit-details-marker { display: none; }
.card-controls > summary i { font-size: .8rem; font-style: normal; transition: transform .15s ease; }
.card-controls > summary i { display: block; font-size: 1.05rem; font-style: normal; line-height: 1; transition: transform .15s ease; }
.card-controls[open] > summary i { transform: rotate(180deg); }
.card-controls-body { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; padding-top: 8px; border-top: 1px dashed var(--line); }
.card-tag-editor, .card-detail-editor { position: relative; }
.card-tag-editor > summary, .card-detail-editor > summary { width: max-content; color: var(--muted); font-size: .56rem; font-weight: 700; cursor: pointer; list-style: none; text-decoration: underline; }
.card-tag-editor > summary::-webkit-details-marker, .card-detail-editor > summary::-webkit-details-marker { display: none; }
.card-controls-body { display: flex; width: 100%; flex-wrap: wrap; gap: 10px; align-items: flex-start; align-content: flex-start; margin-top: 9px; padding: 11px 0 1px; border-top: 1px solid var(--line); }
.card-tag-editor, .card-detail-editor, .card-todo-editor { position: relative; }
.card-tag-editor > summary, .card-detail-editor > summary, .card-todo-editor > summary { width: max-content; color: var(--muted); font-size: .56rem; font-weight: 700; cursor: pointer; list-style: none; text-decoration: underline; }
.card-tag-editor > summary::-webkit-details-marker, .card-detail-editor > summary::-webkit-details-marker, .card-todo-editor > summary::-webkit-details-marker { display: none; }
.card-todo-editor > summary span { color: var(--green); }
.card-tag-editor form, .card-detail-editor form { position: absolute; z-index: 8; top: calc(100% + 5px); left: -7px; width: 250px; padding: 11px; border: 1px solid var(--line); border-radius: 10px; background: var(--white); box-shadow: 0 12px 28px rgba(24, 36, 31, .2); }
.card-tag-editor form .button, .card-detail-editor form .button { min-height: 31px; margin-top: 10px; font-size: .62rem; }
.card-detail-editor form { display: grid; gap: 10px; width: 270px; }
.compact-assignee-picker > div { max-height: 120px; overflow-y: auto; }
.card-detail-editor select { margin-top: 5px; padding-top: 7px; padding-bottom: 7px; }
.task-actions { display: flex; width: 100%; justify-content: space-between; align-items: center; }
.card-todo-editor[open] { width: 100%; }
.todo-list { display: grid; gap: 5px; max-height: 154px; margin: 8px 0; overflow-y: auto; }
.todo-item { display: flex; gap: 6px; align-items: center; padding: 5px 6px; border-radius: 7px; background: var(--paper); }
.todo-item > form:first-child { min-width: 0; flex: 1; }
.todo-item label { display: flex; min-width: 0; gap: 6px; align-items: center; color: var(--ink); font-size: .6rem; cursor: pointer; }
.todo-item input { width: 14px; height: 14px; margin: 0; accent-color: var(--green); }
.todo-item label span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.todo-item.completed label span { color: var(--muted); text-decoration: line-through; }
.todo-item .text-button { padding: 0 2px; color: var(--muted); font-size: .9rem; line-height: 1; }
.todo-empty { margin: 8px 0; color: var(--muted); font-size: .58rem; }
.todo-add-form { display: flex; gap: 6px; }
.todo-add-form input { min-width: 0; margin: 0; padding: 7px 8px; font-size: .6rem; }
.todo-add-form .button { min-height: 31px; padding: 5px 9px; font-size: .58rem; }
.task-actions { display: flex; width: 100%; box-sizing: border-box; justify-content: space-between; align-items: center; padding-right: 31px; }
.task-actions > form:first-child { display: flex; gap: 4px; align-items: center; }
.task-actions select { width: auto; min-width: 104px; margin: 0; padding: 5px 25px 5px 7px; border: 0; background-color: var(--paper); font-size: .58rem; font-weight: 700; }
.task-actions .text-button { margin: 0; }
.task-move-button { display: none; }
.task-actions form:focus-within .task-move-button { display: inline-block; }
.task-lifecycle-actions { display: flex; gap: 9px; align-items: center; }
.task-lifecycle-actions { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; justify-content: flex-end; margin-left: auto; }
.task-lifecycle-actions > form { display: flex; }
.archive-task { color: var(--green); font-weight: 700; }
.task-remove { position: relative; color: var(--muted); font-size: .58rem; }
.task-remove > summary { cursor: pointer; list-style: none; text-decoration: underline; }
.task-remove > summary::-webkit-details-marker { display: none; }
.task-remove[open] > summary { visibility: hidden; }
.task-remove form { position: absolute; right: 0; bottom: -1px; width: max-content; }
.task-remove[open] > summary { display: none; }
.task-remove form { position: static; display: flex; width: max-content; }
.task-remove form .text-button { color: var(--red); font-weight: 700; }
.kanban-empty { display: grid; min-height: 74px; place-items: center; border: 1px dashed #b8c2bd; border-radius: 10px; color: var(--muted); font-size: .62rem; }
.archived-cards-panel { max-width: 1380px; margin: 10px auto 0; border: 1px solid var(--line); border-radius: 13px; background: var(--white); }
@@ -405,6 +419,7 @@ blockquote { margin: 10px 0; padding-left: 12px; border-left: 2px solid #d8dfdb;
.archived-card { display: flex; justify-content: space-between; gap: 20px; align-items: center; padding: 14px 17px; border-bottom: 1px solid var(--line); }
.archived-card:last-child { border-bottom: 0; }
.archived-card h3 { margin: 4px 0 2px; font-size: .76rem; }
.archived-status { color: var(--muted); font-size: .56rem; font-weight: 700; text-transform: capitalize; }
.archived-card small { color: var(--muted); font-size: .58rem; }
.archived-card .card-tags { margin-bottom: 6px; }
.archived-card-actions { display: flex; gap: 8px; align-items: center; flex: 0 0 auto; }
@@ -412,8 +427,8 @@ blockquote { margin: 10px 0; padding-left: 12px; border-left: 2px solid #d8dfdb;
.archived-delete { position: relative; }
.archived-delete > summary { color: var(--red); font-size: .6rem; font-weight: 700; cursor: pointer; list-style: none; }
.archived-delete > summary::-webkit-details-marker { display: none; }
.archived-delete[open] > summary { visibility: hidden; }
.archived-delete form { position: absolute; right: 0; bottom: 0; width: max-content; }
.archived-delete[open] > summary { display: none; }
.archived-delete form { position: static; display: flex; width: max-content; }
.archived-delete form .text-button { color: var(--red); font-weight: 700; }
.updates-layout { grid-template-columns: minmax(390px, .8fr) minmax(460px, 1.2fr); }
@@ -636,8 +651,9 @@ html[data-theme="dark"] .kanban-card { border-color: #35443d; box-shadow: 0 4px
html[data-theme="dark"] .kanban-card > p { color: #aab6b0; }
html[data-theme="dark"] .task-assignee { color: #bdc8c2; }
html[data-theme="dark"] .task-due { background: #3b3222; color: #dec18b; }
html[data-theme="dark"] .importance-badge.high { background: #453820; color: #e3bd72; }
html[data-theme="dark"] .importance-badge.urgent { background: #432725; color: #efa09a; }
html[data-theme="dark"] .todo-progress { background: #1d3b2c; color: #8fd0ae; }
html[data-theme="dark"] .importance-emoji.high { background: #453820; }
html[data-theme="dark"] .importance-emoji.urgent { background: #432725; }
html[data-theme="dark"] .kanban-cards.drag-over { background: rgba(107, 172, 142, .1); }
@media (max-width: 980px) {