refactor: focus habit completion feedback

frontend/src/style.test.ts

@@ -39,7 +39,8 @@ describe('mobile list row language', () => {
     expect(css).not.toContain('grid-template-columns:44px minmax(0,1fr) 72px')
     expect(css).not.toContain('grid-template-columns:40px minmax(0,1fr) 76px')
     expect(css).toContain('.task-main strong,.habit-name,.countdown-main>b{font-size:14px;')
-    expect(css).toContain('.meta,.habit-progress,.countdown-main>small,.countdown-state small{font-size:11px;')
+    expect(css).toContain('.meta,.countdown-main>small,.countdown-state small{font-size:11px;')
+    expect(css).toContain('.habit-progress{font-size:16px}')
   })
 
   it('keeps destructive habit actions in a detail sheet instead of the list row', () => {
@@ -65,7 +66,8 @@ describe('task and habit row decoration', () => {
     expect(app).toContain('@pointerdown.stop="startTaskReorder')
     expect(app).toContain('@pointerup.stop="finishTaskReorder')
     expect(app).toContain("api('/tasks/reorder'")
-    expect(mvpPanel.match(/class="drag-handle habit-drag-handle"/g)?.length).toBe(2)
+    expect(mvpPanel.match(/class="drag-handle habit-drag-handle"/g)?.length).toBe(1)
+    expect(mvpPanel).not.toMatch(/today-habit-list[\s\S]*?habit-drag-handle[\s\S]*?<!-- 完整习惯列表 -->/)
     expect(mvpPanel).toContain('@pointerdown.stop="startHabitReorder')
     expect(mvpPanel).toContain('@pointerup.stop="finishHabitReorder')
     expect(mvpPanel).toContain("request('/habits/reorder'")
@@ -73,7 +75,7 @@ describe('task and habit row decoration', () => {
     expect(css).toContain('.reordering{')
     expect(css).toContain('var(--reorder-y,0px)')
     expect(app).toContain("'--reorder-y': `${taskReorder?.id === node.task.id ? taskReorder.offsetY : 0}px`")
-    expect(mvpPanel.match(/'--reorder-y': `\$\{habitReorder\?\.id === h\.id \? habitReorder\.offsetY : 0\}px`/g)?.length).toBe(2)
+    expect(mvpPanel.match(/'--reorder-y': `\$\{habitReorder\?\.id === h\.id \? habitReorder\.offsetY : 0\}px`/g)?.length).toBe(1)
   })
 
   it('supports pointer dragging for desktop task and subtask completion', () => {
@@ -160,10 +162,21 @@ describe('task and habit row decoration', () => {
     expect(css).toContain('.habit-progress{margin-left:auto;')
   })
 
-  it('shows an accessible progress bar for numeric habits in both habit views', () => {
+  it('keeps Today focused and adds the weekly grid only to the full habits view', () => {
+    expect(mvpPanel.match(/class="habit-week"/g)?.length).toBe(1)
+    expect(mvpPanel).toContain('v-for="cell in h.cells"')
+    expect(mvpPanel).toContain('class="habit-week-cell"')
+    expect(mvpPanel).toContain('class="habit-week-day"')
+    expect(mvpPanel).not.toMatch(/today-habit-list[\s\S]*?class="habit-week"[\s\S]*?<!-- 完整习惯列表 -->/)
+    expect(mvpPanel).not.toMatch(/today-habit-list[\s\S]*?habit-drag-handle[\s\S]*?<!-- 完整习惯列表 -->/)
+  })
+
+  it('uses numeric progress as the main feedback and omits it for boolean habits', () => {
     expect(mvpPanel.match(/<progress v-if="h.kind === 'numeric'" class="habit-progress-bar"/g)?.length).toBe(2)
     expect(mvpPanel.match(/:value="habitProgressValue\(h\)" :max="habitProgressMax\(h\)"/g)?.length).toBe(2)
     expect(mvpPanel.match(/:aria-label="`\$\{h.name\}进度：\$\{habitProgressText\(h\)\}`"/g)?.length).toBe(2)
+    expect(css).toContain('.habit-progress{margin-left:auto;')
+    expect(css).toContain('font-size:16px')
     expect(css).toContain('.habit-progress-bar{grid-column:1/-1;')
     expect(css).toContain('.habit-progress-bar::-webkit-progress-value{background:linear-gradient')
   })
@@ -269,8 +282,11 @@ describe('task and habit row decoration', () => {
     expect(css).toContain('.password-form{width:100%;display:grid;gap:10px}')
   })
 
-  it('strikes through completed habit names', () => {
-    expect(css).toContain('.habit-row.done .habit-name{color:var(--accent);text-decoration:line-through')
+  it('uses a gentle completion treatment instead of a discarded-task strike', () => {
+    expect(css).toContain('.habit-row.done .habit-name{color:#756c61;')
+    expect(css).toContain('text-decoration-color:#d8c8bb')
+    expect(css).toContain('text-decoration-thickness:1px')
+    expect(css).not.toContain('.habit-row.done .habit-name{color:var(--accent);text-decoration:line-through')
   })
 
   it('keeps habit cards borderless so the rounded left edge has no visual gap', () => {