Redesign task create/edit modals with desktop sidebar layout and mobile bottom sheet

build-css.mjs

@@ -16,6 +16,7 @@ const CSS_FILES = [
     'styles/search-box.css',         // SearchBox component with proper BEM scoping
     'styles/modal-bem.css',          // Modal components with proper BEM scoping
     'styles/task-modal.css',         // Task modal components (Google Keep/Todoist style)
+    'styles/task-modal-sheet.css',   // Task modal sheet, chips, sidebar
     'styles/reminder-modal.css',     // Reminder modal component with proper BEM scoping
     'styles/date-picker.css',        // Enhanced date/time picker styling
     'styles/task-selector-with-create-modal.css', // TaskSelectorWithCreateModal component with proper BEM scoping

docs/releases/unreleased.md

@@ -31,3 +31,67 @@ When a change has user-facing documentation, include a canonical tasknotes.dev l
 ```
 
 -->
+
+## Changed
+
+- Redesigned task creation and edit modals with a Todoist-inspired layout: labeled action chips, a dedicated scheduled date row, organization sections with completion counts, and labeled bottom actions on desktop (icon-only on mobile).
+- On mobile, task create/edit now opens as a bottom sheet with drag-to-resize and swipe-down-to-dismiss gestures. Properties are grouped into differentiated card sections on a recessed background, similar to a native grouped list.
+- On mobile, the bottom sheet footer action buttons now sit closer to the content above them on both create and edit, with a modest gap above the buttons.
+- On desktop, the edit modal uses a right sidebar for task properties and organization fields (projects, subtasks, dependencies) while the main column focuses on title, description, and task information.
+- On desktop, the expanded create-task dialog now uses the same two-pane layout as the edit modal, with title and description in the main column and task properties in the right sidebar.
+- The title and description fields now show "Title" and "Description" as placeholder text instead of a persisting label above the field.
+- Title and description are now the first fields shown in the task modal, with the description appearing directly below the title.
+- Removed the duplicate title field from the expanded create-task dialog when using natural-language input; expanding now switches to the same title-and-description layout as the edit modal.
+- Clicking contexts or tags in the task modal now opens a compact editor dialog directly instead of showing an intermediate menu. Existing values appear as removable chips, with a separate input and vault autocomplete for adding new ones.
+- On mobile, the contexts and tags editor dialogs now use icon-only cancel and confirm buttons on a single row, matching the task modal footer.
+- The due date icon is now a target instead of a calendar, to distinguish it from the scheduled date icon.
+- Create-task action chips now wrap onto multiple lines instead of scrolling horizontally.
+- Scheduled date in the create-task dialog is now a chip alongside the other task properties instead of a separate full-width row.
+- In the create-task dialog, property chips now appear on a second row below the natural-language actions.
+- Simplified property row labels in the mobile task modal bottom sheet (for example, "Due date" instead of "Set due date") and removed the "Add date" subtitle from empty date rows.
+
+## Fixed
+
+- Fixed the "Add project/subtask/blocked by/blocking" sections in the task modal showing an extra empty header and "+" button alongside the "Add" button when the section had no items.
+- Fixed the project/subtask/blocked by/blocking section headers staying clickable when a separate "+" add button was already shown.
+- Removed the completed/total counts from project, subtask, and dependency section headers in the task modal.
+- Fixed the desktop task edit modal rendering a second, disconnected title field near the bottom of the form.
+- Fixed the mobile task modal showing the "Add to project/subtask/blocked by/blocking" sections above the title and description fields instead of below them.
+- Fixed the title field appearing clipped on a wide bottom-sheet modal (e.g. a touch-screen device with a wide window), caused by the legacy wide-screen split layout being applied at the same time as the mobile bottom sheet.
+- Fixed the desktop task edit modal showing duplicate contexts, tags, and time estimate fields in the main column when they were already shown in the right sidebar.
+- Fixed the desktop task edit modal showing subtasks in the main column instead of the right sidebar with the other organization fields.
+- Fixed the desktop task edit modal placing project, subtask, and dependency lists at the bottom of the sidebar instead of directly under their property row.
+- Fixed the desktop task edit modal sidebar clipping project, subtask, and dependency lists inside a short scroll box instead of letting them grow with their content.
+- Fixed misaligned remove buttons in the desktop task edit modal sidebar organization lists.
+- Fixed the desktop task edit modal leaving a large empty gap on the right side of the dialog because its content area was capped at a much narrower width than the dialog itself.
+- Fixed the desktop task edit modal's content not scrolling, which could squeeze the Save/Cancel buttons in with the rest of the form instead of keeping them pinned to the bottom.
+- Fixed the mobile task edit modal action buttons wrapping onto a second row, caused by legacy footer layout rules treating each icon as a separate grid/flex item instead of grouping leading actions and cancel/save into left/right clusters on one row.
+- Fixed the mobile bottom sheet drag handle indicator not being centered in its touch target.
+- Fixed the Save button in the task modal not showing a full primary accent fill on mobile bottom-sheet layouts.
+- Fixed the Task information section in the mobile bottom sheet and desktop edit modal so its section title stays flush with other section headers while metadata rows sit inset inside the grouped card.
+- Fixed the Task information section in the mobile bottom sheet using a different card style than the desktop edit modal.
+- Fixed the Task information section in the mobile bottom sheet still using Obsidian's generic metadata styles instead of the grouped card layout shown on desktop.
+- Fixed repeated console errors when scrolling the mobile task edit modal.
+- Fixed the completions calendar month navigation arrows not being visible on mobile, caused by Obsidian hiding SVG icons that are direct children of generic modal buttons.
+- Fixed extra horizontal inset on the Completions calendar in the mobile bottom sheet.
+- Fixed the Completions and Task information sections in the edit modal showing divider lines that other grouped sections no longer use.
+- Fixed missing vertical spacing between the Completions and Task information sections in the edit modal.
+- Fixed the Completions and Task information section headers rendering in all caps instead of sentence case.
+- Fixed tight spacing between the Completions and Task information section titles and their content in the edit modal.
+- Fixed the task modal description field only accepting focus when tapping the first line, instead of anywhere in the description area.
+- Fixed missing dividers between some property rows in the mobile task edit bottom sheet.
+- Fixed inconsistent divider widths in the mobile task edit bottom sheet by rendering full-width divider elements between property rows instead of relying on row borders across separate grouped cards.
+- Fixed the desktop task edit modal sidebar showing "Add to project" and "Add subtask" subtitles on the Projects and Subtasks rows when those sections were empty.
+- Fixed the desktop task edit modal sidebar missing its top and bottom border, caused by the panel stretching flush against the scroll container and clipping the border edges.
+- Fixed the desktop task edit modal scrollbar sitting flush against the right sidebar instead of leaving a small inset beside it.
+- Fixed uneven divider spacing in the desktop task edit modal sidebar after Projects, Subtasks, and dependency rows when those sections were empty.
+- Fixed sidebar property row chevrons rendering larger than their row icons and sitting off-center on rows with a value.
+- Fixed the mobile task edit modal showing plain "Add to project/subtask/blocked by/blocking" buttons for empty organization sections instead of the icon-and-chevron sidebar rows used on desktop.
+- Fixed the mobile task edit modal listing organization and dependency sections after the property rows instead of matching the desktop sidebar order (projects and subtasks first, then properties, then blocked-by and blocking).
+- Fixed the mobile task edit modal splitting projects/subtasks, properties, and blocked-by/blocking into separate grouped cards instead of one continuous sidebar-style list.
+- Fixed the mobile create/edit bottom sheet staying at the desktop dialog width and leaving large side gutters instead of sizing to its content up to the small-screen maximum.
+- Fixed the mobile create/edit bottom sheet expanding flush to the top of the screen when dragged to full height instead of leaving a safe area above the sheet.
+- Fixed the mobile create/edit bottom sheet staying behind the on-screen keyboard or formatting toolbar when editing fields. The whole sheet now displaces upward from the bottom edge without changing height.
+- Fixed the mobile create/edit bottom sheet footer action buttons scrolling out of view or being clipped when the sheet was partially expanded.
+- Fixed the mobile create/edit bottom sheet leaving the content scrollbar inside the padded container instead of along its outer edge.
+- Fixed task modal footer buttons so non-save actions use an outlined style while Save stays filled, and icons align vertically with their labels on desktop. Removed Obsidian's default button shadow from footer actions so outlined buttons stay flat.

i18n.manifest.json

@@ -1537,9 +1537,9 @@
   "modals.migration.prompt.remindLater": "bebc1c9cd489e6013a5c3229ef5dbd13702aa9e1",
   "modals.task.titlePlaceholder": "c8196f1d1039c2fb290add52ee990c571173d6f1",
   "modals.task.titleLabel": "768e0c1c69573fb588f61f1308a015c11468e05f",
-  "modals.task.titleDetailedPlaceholder": "da3700738242c039de32d3f5e3a0ba10bc28ba0b",
+  "modals.task.titleDetailedPlaceholder": "768e0c1c69573fb588f61f1308a015c11468e05f",
   "modals.task.detailsLabel": "dc3decbb93847518f1a049dcf49d0d7c6560bcc6",
-  "modals.task.detailsPlaceholder": "52fa1dfb1b96ceaa971d057d24e0b1f9dd17e61d",
+  "modals.task.detailsPlaceholder": "55f8ebc805e65b5b71ddafdae390e3be2bcd69af",
   "modals.task.projectsLabel": "53e890d5f0fffe09587c55dce74e9a6febf59b5c",
   "modals.task.projectsAdd": "2470e8667bfae5270588f1574daf0d7cd7a89c41",
   "modals.task.projectsTooltip": "6f7dba5b3167c06a50500ad739f8e6462a7ac47f",
@@ -1559,6 +1559,8 @@
   "modals.task.dependencies.blocking": "d785c0d4b3b9c24878b62f64a7bcf78e9506ab27",
   "modals.task.dependencies.placeholder": "67c2a027f7b139a8b9103081eb4fb418e135cd38",
   "modals.task.dependencies.addTaskButton": "24700e60fedcf00a741c5adb1d9f15aee05f95d8",
+  "modals.task.dependencies.addBlockedByButton": "7239dddd703cf9a0813a78c4e439a4a289f168c1",
+  "modals.task.dependencies.addBlockingButton": "e5c2a4e67304f3e6d57030ee79bdd09e3155abab",
   "modals.task.dependencies.selectTaskTooltip": "752b3be46866220ce17567bede45bdac374d4a4f",
   "modals.task.dependencies.removeTaskTooltip": "5be1bc9e1837b131abac53534235a44b4bca541e",
   "modals.task.organization.projects": "53e890d5f0fffe09587c55dce74e9a6febf59b5c",
@@ -1569,15 +1571,28 @@
   "modals.task.organization.addSubtasksButton": "65b9d7a6f28a02d5a60ab0005804c73e137d14b6",
   "modals.task.organization.addSubtasksTooltip": "1a875945612b63d144cb3cf02c792a38443378e1",
   "modals.task.organization.removeSubtaskTooltip": "d6acf378b038ad0b4b130817b370fb9dba31caef",
+  "modals.task.organization.completionCount": "c55d20b2f6cea63c674b3cd3083f8f2b0daaf852",
   "modals.task.organization.notices.noEligibleSubtasks": "bce7ca1d7ce5603179f86b83b9074a4aa27de835",
   "modals.task.organization.notices.subtaskSelectFailed": "333c06c796628bc21ecdaa6da4556bbe343c2284",
+  "modals.task.scheduledRow.label": "eb9a4bc1c0c153e4e4b042a79113b815b7e3021d",
+  "modals.task.scheduledRow.placeholder": "3ae746949032a7a1812864103fa43d1a5560de39",
+  "modals.task.detailsShowMore": "25911d48e023cd10fc08d378641ee620f5e39d86",
+  "modals.task.detailsShowLess": "4c852b26d1b71054cb8fbccc79ae72e91dc94144",
+  "modals.task.chips.timeEstimate": "4f46c57b82ca0a791c945fde8075d2c4d8fcd907",
+  "modals.task.chips.timeEstimateValue": "09a22c220816f5d148ab0269bda9f7d1463c55d5",
+  "modals.task.chips.contextsPlural": "103dd09aab7acd6c6e3b7b5547231f51d85ed787",
+  "modals.task.chips.tagsPlural": "6cabb6f2900acd83895435f56f046a15adc09f35",
+  "modals.task.chips.tagSelected": "5dc2abcb70ea56a88ab2bfadf4012a0e0cad4265",
+  "modals.task.chips.remindersSingle": "38ce8707038cb67ede5e3492fa81023e208343b5",
+  "modals.task.chips.remindersPlural": "a1ac44f49ac22dc5e94882cb7a587c72ebd7c381",
+  "modals.task.chipList.removeItem": "0ae125470113ea9a36b875a8a99d290620b454ea",
   "modals.task.customFieldsLabel": "d1f86d5227e987ad9feec36387a01f71ac50987e",
-  "modals.task.actions.due": "ecf07cea2d2a6681f6074ac3d82bcae990c04a8d",
-  "modals.task.actions.scheduled": "d45d07555befa2ffc895f9d0425ce30f4bc92c3d",
-  "modals.task.actions.status": "45c5d329b685f50b513e431eb0cc226e3cba63eb",
-  "modals.task.actions.priority": "993fd2a5326b1f03d2cf7f4bb7e6a5bc13154f28",
-  "modals.task.actions.recurrence": "1aa43ddb78d67c24780c22cb775db45de4a0becf",
-  "modals.task.actions.reminders": "230294dc92087b5bab4f814f2151680d45063213",
+  "modals.task.actions.due": "4c1aeebc433bcb8eb4b05434619ea3136b785ea8",
+  "modals.task.actions.scheduled": "b41cf063eca8243b7b8039af57f2b039fc868668",
+  "modals.task.actions.status": "bae7d5be70820ed56467bd9a63744e23b47bd711",
+  "modals.task.actions.priority": "886cbff9d9df761ec642945e519631a23ed173a2",
+  "modals.task.actions.recurrence": "f7ad40f58caa3ee3d9e72be4378d5acf7807f657",
+  "modals.task.actions.reminders": "ae8c3939382fbd2f6a05825c70d474b3c1de2b8d",
   "modals.task.buttons.openNote": "c66a827e3397b1e4eb14c164a586dbd77b36e8bc",
   "modals.task.buttons.save": "efc007a393f66cdb14d57d385822a3d9e36ef873",
   "modals.task.tooltips.dueValue": "b3812726f9ed81d808a0976e193b08617690b0e5",