fix: compact todo-item spacing, fix checkbox alignment in detail

Todo items in preview were ~60px tall because marked.js wraps
checkbox-list content in <p> tags, and .prose p adds 0.75em
vertical margin inside the flex item. Three changes:

  - .todo-item p { margin:0; min-height:0 } kills the paragraph
    bloat inside todo rows.
  - Padding 5px→2px, min-height 28→24px, gap 10→8px for tighter
    stacking.
  - align-items switches from center to flex-start with margin-top
    on the checkbox so it sits at the first text line regardless of
    whether the <li> contains a bare text node or a <p>. Fixes the
    upward shift that appeared in the detail preview but not in the
    side panel.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
thandClaude Opus 4.6 committed 2026-04-16 12:46:01 +02:00
1 parent 82b2ebc15f
commit 4c3954d989
3 files changed
+8 -6

No files matched your search

+1 -1
View File
@@ -1,7 +1,7 @@
<?php <?php
define('APP_NAME', 'hyprcrd'); define('APP_NAME', 'hyprcrd');
define('APP_VERSION', '1.9.23'); define('APP_VERSION', '1.9.24');
// Database path — writable directory, outside webroot // Database path — writable directory, outside webroot
// DB_PATH / UPLOAD_DIR can be pre-defined by the Electron router for app isolation // DB_PATH / UPLOAD_DIR can be pre-defined by the Electron router for app isolation
+1 -1
View File
@@ -1,6 +1,6 @@
{ {
"name": "hyprcrd", "name": "hyprcrd",
"version": "1.9.23", "version": "1.9.24",
"description": "hyprcrd — self-hosted card manager", "description": "hyprcrd — self-hosted card manager",
"main": "main.js", "main": "main.js",
"scripts": { "scripts": {
+6 -4
View File
@@ -1117,11 +1117,13 @@ body.anim-slow .board-card.card-pulse-local {
margin: 0 !important; margin: 0 !important;
margin-left: -1.5em !important; margin-left: -1.5em !important;
display: flex !important; display: flex !important;
align-items: center; align-items: flex-start;
gap: 10px; gap: 8px;
min-height: 28px; min-height: 24px;
padding: 5px 0; padding: 2px 0;
} }
.todo-item p { margin: 0 !important; min-height: 0 !important; }
.todo-cb { margin-top: 2px; }
.todo-item { cursor: pointer; } .todo-item { cursor: pointer; }
.todo-item:hover { background: color-mix(in srgb, var(--t-raised) 50%, transparent); } .todo-item:hover { background: color-mix(in srgb, var(--t-raised) 50%, transparent); }
.todo-item.todo-done .todo-text { color: var(--t-dim); text-decoration: line-through; } .todo-item.todo-done .todo-text { color: var(--t-dim); text-decoration: line-through; }