mirror of
https://github.com/Memo-2023/mana-monorepo.git
synced 2026-05-15 01:01:09 +02:00
feat(todo/web): add "To Do" page, remove scroll-snap, allow closing last column
Add open-tasks secondary page, remove scroll-snap from fokus layout and page components for smoother scrolling, and allow closing the last remaining column. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
parent
11a2db8fcd
commit
aadd1c7538
4 changed files with 14 additions and 9 deletions
|
|
@ -240,11 +240,8 @@
|
|||
display: flex;
|
||||
gap: 1.5rem;
|
||||
overflow-x: auto;
|
||||
scroll-snap-type: x mandatory;
|
||||
/* Centering padding: pushes first sheet to viewport center.
|
||||
Works like a carousel — padding is scrollable. */
|
||||
/* Centering padding: pushes first sheet to viewport center */
|
||||
padding: 1rem calc(50% - var(--sheet-width) / 2);
|
||||
scroll-padding: calc(50% - var(--sheet-width) / 2);
|
||||
scrollbar-width: none;
|
||||
}
|
||||
.fokus-track::-webkit-scrollbar {
|
||||
|
|
@ -255,7 +252,6 @@
|
|||
flex: 0 0 auto;
|
||||
width: var(--sheet-width, min(840px, 85vw));
|
||||
min-height: 60vh;
|
||||
scroll-snap-align: center;
|
||||
background: #fffef5;
|
||||
border-radius: 0.375rem;
|
||||
box-shadow:
|
||||
|
|
|
|||
|
|
@ -1,5 +1,6 @@
|
|||
<script lang="ts">
|
||||
import {
|
||||
Circle,
|
||||
CheckCircle,
|
||||
CalendarCheck,
|
||||
Warning,
|
||||
|
|
@ -27,6 +28,13 @@
|
|||
let { onSelect, onClose, activePageIds = [] }: Props = $props();
|
||||
|
||||
const PAGE_OPTIONS: PageOption[] = [
|
||||
{
|
||||
id: 'todo',
|
||||
title: 'To Do',
|
||||
description: 'Offene Aufgaben',
|
||||
icon: Circle,
|
||||
color: '#6B7280',
|
||||
},
|
||||
{
|
||||
id: 'completed',
|
||||
title: 'Erledigt',
|
||||
|
|
@ -118,7 +126,6 @@
|
|||
flex: 0 0 auto;
|
||||
width: min(320px, 85vw);
|
||||
min-height: 60vh;
|
||||
scroll-snap-align: center;
|
||||
background: #fffef5;
|
||||
border-radius: 0.375rem;
|
||||
box-shadow:
|
||||
|
|
|
|||
|
|
@ -17,6 +17,7 @@
|
|||
const tasksCtx: { readonly value: Task[] } = getContext('tasks');
|
||||
|
||||
const PAGE_META: Record<string, { title: string; color: string }> = {
|
||||
todo: { title: 'To Do', color: '#6B7280' },
|
||||
completed: { title: 'Erledigt', color: '#22C55E' },
|
||||
today: { title: 'Heute', color: '#F59E0B' },
|
||||
overdue: { title: 'Überfällig', color: '#EF4444' },
|
||||
|
|
@ -34,6 +35,8 @@
|
|||
const weekEnd = addDays(today, 7);
|
||||
|
||||
switch (pageId) {
|
||||
case 'todo':
|
||||
return tasks.filter((t) => !t.isCompleted);
|
||||
case 'completed':
|
||||
return tasks.filter((t) => t.isCompleted);
|
||||
case 'today':
|
||||
|
|
@ -141,7 +144,6 @@
|
|||
.secondary-page {
|
||||
flex: 0 0 auto;
|
||||
min-height: 60vh;
|
||||
scroll-snap-align: center;
|
||||
background: #fffef5;
|
||||
border-radius: 0.375rem;
|
||||
box-shadow:
|
||||
|
|
|
|||
|
|
@ -37,7 +37,7 @@
|
|||
}
|
||||
|
||||
function handleColumnClose(colIdx: number) {
|
||||
if (!activeView || activeView.columns.length <= 1) return;
|
||||
if (!activeView) return;
|
||||
const columns = $state.snapshot(activeView.columns).filter((_, i) => i !== colIdx);
|
||||
updateView({ columns });
|
||||
}
|
||||
|
|
@ -83,7 +83,7 @@
|
|||
}
|
||||
|
||||
function removeColumn(colIdx: number) {
|
||||
if (!activeView || activeView.columns.length <= 1) return;
|
||||
if (!activeView) return;
|
||||
const columns = $state.snapshot(activeView.columns).filter((_, i) => i !== colIdx);
|
||||
updateView({ columns });
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue