obsidian-plugin/callumalpass_tasknotes
1
0
Fork 0
mirror of https://github.com/callumalpass/tasknotes.git synced 2026-07-22 12:50:26 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions
callumalpass_tasknotes/styles/task-inline-widget.css

521 lines
14 KiB
CSS
Raw Normal View History

Refactor task update handling & cleanup inline widget styles • Introduce a new CodeMirror state effect for task updates in TaskLinkOverlay.ts: - Added the taskUpdateEffect to signal task updates. - Updated decoration rebuild logic to check for the new state effect instead of relying on a refreshController. - Modified the widget cache logic to clear active widgets when a task update effect is detected. - Removed the now-unused refreshController from the createTaskLinkField function. • Enhance global task update dispatching in main.ts: - Updated the import to include the new dispatchTaskUpdate helper. - Modified the task update listener to dispatch a proper state effect via dispatchTaskUpdate, passing along the task path received from the event. - This change ensures that the CodeMirror view correctly rebuilds decorations when a task update event occurs. • Clean up inline widget styles: - Removed outdated inline task preview and instant convert button styles from task-card-bem.css. - Created a new stylesheet (task-inline-widget.css) with BEM-named, scoped styles for inline task widgets. - The new stylesheet provides a clearer structure, improved responsiveness, and appropriate separation of concerns for inline widgets. This refactor modernizes the task link overlay update mechanism using CodeMirror’s state effects, simplifies the update flow in main.ts, and cleans up style management by migrating inline widget CSS to a dedicated file.
2025-06-10 11:01:07 +00:00
/* =================================================================
INLINE TASK WIDGET STYLES - BEM NAMING CONVENTION & PROPER SCOPING
================================================================= */
/* All inline task widget styles are scoped under .tasknotes-plugin for proper isolation */
Fix: Task embeds appearing on new line instead of inline with bullets (#1157) Task embeds (inline task link widgets) were wrapping to a new line instead of appearing inline with bullet points in lists, particularly when the task card was wider than the editor screen. Changes: - Changed inline task cards to use <span> elements instead of <div> for proper inline flow in CodeMirror's rendering context - Added max-width: calc(100% - 40px) to prevent wrapping to new line - Added explicit inline display styles to wrapper and child containers - Strengthened CSS with !important and vertical-align: baseline The fix ensures task embeds display correctly inline with bullets during live preview/editing mode, even when they contain multiple metadata properties. Fixes #1157
2025-11-19 20:40:58 +00:00
/* =================================================================
INLINE TASK LINK WIDGET WRAPPER
================================================================= */
/* Wrapper for inline task link widgets - ensures proper inline display with bullets */
.tasknotes-plugin.tasknotes-inline-widget {
Clean up CSS lint issues
2026-05-14 11:06:30 +00:00
display: inline;
Fix: Task embeds appearing on new line instead of inline with bullets (#1157) Task embeds (inline task link widgets) were wrapping to a new line instead of appearing inline with bullet points in lists, particularly when the task card was wider than the editor screen. Changes: - Changed inline task cards to use <span> elements instead of <div> for proper inline flow in CodeMirror's rendering context - Added max-width: calc(100% - 40px) to prevent wrapping to new line - Added explicit inline display styles to wrapper and child containers - Strengthened CSS with !important and vertical-align: baseline The fix ensures task embeds display correctly inline with bullets during live preview/editing mode, even when they contain multiple metadata properties. Fixes #1157
2025-11-19 20:40:58 +00:00
vertical-align: baseline;
fix: improve inline task embed layout for indented bullets (#1157) Rework inline task card CSS to properly handle indented bullet lists: - Switch from inline-flex to inline display for natural text flow - Allow title text to wrap naturally within line boundaries - Add scrollable metadata that stays on same line when space permits - Use em-based sizing for icons to scale with editor font - Add proper spacing between metadata categories
2025-11-28 21:48:34 +00:00
line-height: inherit;
Fix: Task embeds appearing on new line instead of inline with bullets (#1157) Task embeds (inline task link widgets) were wrapping to a new line instead of appearing inline with bullet points in lists, particularly when the task card was wider than the editor screen. Changes: - Changed inline task cards to use <span> elements instead of <div> for proper inline flow in CodeMirror's rendering context - Added max-width: calc(100% - 40px) to prevent wrapping to new line - Added explicit inline display styles to wrapper and child containers - Strengthened CSS with !important and vertical-align: baseline The fix ensures task embeds display correctly inline with bullets during live preview/editing mode, even when they contain multiple metadata properties. Fixes #1157
2025-11-19 20:40:58 +00:00
/* Prevent wrapper from causing line breaks */
white-space: normal;
}
Refactor task update handling & cleanup inline widget styles • Introduce a new CodeMirror state effect for task updates in TaskLinkOverlay.ts: - Added the taskUpdateEffect to signal task updates. - Updated decoration rebuild logic to check for the new state effect instead of relying on a refreshController. - Modified the widget cache logic to clear active widgets when a task update effect is detected. - Removed the now-unused refreshController from the createTaskLinkField function. • Enhance global task update dispatching in main.ts: - Updated the import to include the new dispatchTaskUpdate helper. - Modified the task update listener to dispatch a proper state effect via dispatchTaskUpdate, passing along the task path received from the event. - This change ensures that the CodeMirror view correctly rebuilds decorations when a task update event occurs. • Clean up inline widget styles: - Removed outdated inline task preview and instant convert button styles from task-card-bem.css. - Created a new stylesheet (task-inline-widget.css) with BEM-named, scoped styles for inline task widgets. - The new stylesheet provides a clearer structure, improved responsiveness, and appropriate separation of concerns for inline widgets. This refactor modernizes the task link overlay update mechanism using CodeMirror’s state effects, simplifies the update flow in main.ts, and cleans up style management by migrating inline widget CSS to a dedicated file.
2025-06-10 11:01:07 +00:00
/* =================================================================
INLINE TASK PREVIEW STYLES (Editor Widgets)
================================================================= */
/* Standalone inline task preview widget */
.tasknotes-plugin .task-inline-preview {
Improve inline task preview widget layout and spacing • Switch layout from "display: inline" to "inline-flex" for .task-inline-preview to ensure proper element alignment, adding align-items: center and a gap for consistent spacing. • Update padding and margin values across elements:   – Add padding (2px 4px) to .task-inline-preview for improved clickable area.   – Adjust spacing on status dot, date icon, and pencil icon by setting explicit margin and vertical-align values. • Remove redundant task title styles and consolidate text overflow rules:   – Reduce max-width from 300px to 250px and add flex-shrink/vertical-align settings for better cropping and responsiveness. • Tweak responsive design in media query and reading mode context:   – Modify padding and gap in media query for max-width adjustments.   – Ensure reading mode styling uses consistent gap and increased padding. These CSS updates enhance both the visual consistency and usability of the inline task preview widget.
2025-06-22 10:20:42 +00:00
/* Layout - inline flexbox for proper element alignment */
display: inline-flex;
align-items: center;
gap: 8px;
Refactor task update handling & cleanup inline widget styles • Introduce a new CodeMirror state effect for task updates in TaskLinkOverlay.ts: - Added the taskUpdateEffect to signal task updates. - Updated decoration rebuild logic to check for the new state effect instead of relying on a refreshController. - Modified the widget cache logic to clear active widgets when a task update effect is detected. - Removed the now-unused refreshController from the createTaskLinkField function. • Enhance global task update dispatching in main.ts: - Updated the import to include the new dispatchTaskUpdate helper. - Modified the task update listener to dispatch a proper state effect via dispatchTaskUpdate, passing along the task path received from the event. - This change ensures that the CodeMirror view correctly rebuilds decorations when a task update event occurs. • Clean up inline widget styles: - Removed outdated inline task preview and instant convert button styles from task-card-bem.css. - Created a new stylesheet (task-inline-widget.css) with BEM-named, scoped styles for inline task widgets. - The new stylesheet provides a clearer structure, improved responsiveness, and appropriate separation of concerns for inline widgets. This refactor modernizes the task link overlay update mechanism using CodeMirror’s state effects, simplifies the update flow in main.ts, and cleans up style management by migrating inline widget CSS to a dedicated file.
2025-06-10 11:01:07 +00:00
white-space: nowrap;
fix(css): wrap inline task overlay title using white-space: break-spaces; (#517)
2025-08-31 00:41:15 +00:00
Refactor task update handling & cleanup inline widget styles • Introduce a new CodeMirror state effect for task updates in TaskLinkOverlay.ts: - Added the taskUpdateEffect to signal task updates. - Updated decoration rebuild logic to check for the new state effect instead of relying on a refreshController. - Modified the widget cache logic to clear active widgets when a task update effect is detected. - Removed the now-unused refreshController from the createTaskLinkField function. • Enhance global task update dispatching in main.ts: - Updated the import to include the new dispatchTaskUpdate helper. - Modified the task update listener to dispatch a proper state effect via dispatchTaskUpdate, passing along the task path received from the event. - This change ensures that the CodeMirror view correctly rebuilds decorations when a task update event occurs. • Clean up inline widget styles: - Removed outdated inline task preview and instant convert button styles from task-card-bem.css. - Created a new stylesheet (task-inline-widget.css) with BEM-named, scoped styles for inline task widgets. - The new stylesheet provides a clearer structure, improved responsiveness, and appropriate separation of concerns for inline widgets. This refactor modernizes the task link overlay update mechanism using CodeMirror’s state effects, simplifies the update flow in main.ts, and cleans up style management by migrating inline widget CSS to a dedicated file.
2025-06-10 11:01:07 +00:00
/* Typography - match editor font */
font-size: var(--editor-font-size, 16px);
font-family: var(--editor-font-family, var(--font-interface));
fix(css): wrap inline task overlay title using white-space: break-spaces; (#517)
2025-08-31 00:41:15 +00:00
Refactor task update handling & cleanup inline widget styles • Introduce a new CodeMirror state effect for task updates in TaskLinkOverlay.ts: - Added the taskUpdateEffect to signal task updates. - Updated decoration rebuild logic to check for the new state effect instead of relying on a refreshController. - Modified the widget cache logic to clear active widgets when a task update effect is detected. - Removed the now-unused refreshController from the createTaskLinkField function. • Enhance global task update dispatching in main.ts: - Updated the import to include the new dispatchTaskUpdate helper. - Modified the task update listener to dispatch a proper state effect via dispatchTaskUpdate, passing along the task path received from the event. - This change ensures that the CodeMirror view correctly rebuilds decorations when a task update event occurs. • Clean up inline widget styles: - Removed outdated inline task preview and instant convert button styles from task-card-bem.css. - Created a new stylesheet (task-inline-widget.css) with BEM-named, scoped styles for inline task widgets. - The new stylesheet provides a clearer structure, improved responsiveness, and appropriate separation of concerns for inline widgets. This refactor modernizes the task link overlay update mechanism using CodeMirror’s state effects, simplifies the update flow in main.ts, and cleans up style management by migrating inline widget CSS to a dedicated file.
2025-06-10 11:01:07 +00:00
/* Visual styling - clean text appearance */
Improve inline task preview widget layout and spacing • Switch layout from "display: inline" to "inline-flex" for .task-inline-preview to ensure proper element alignment, adding align-items: center and a gap for consistent spacing. • Update padding and margin values across elements:   – Add padding (2px 4px) to .task-inline-preview for improved clickable area.   – Adjust spacing on status dot, date icon, and pencil icon by setting explicit margin and vertical-align values. • Remove redundant task title styles and consolidate text overflow rules:   – Reduce max-width from 300px to 250px and add flex-shrink/vertical-align settings for better cropping and responsiveness. • Tweak responsive design in media query and reading mode context:   – Modify padding and gap in media query for max-width adjustments.   – Ensure reading mode styling uses consistent gap and increased padding. These CSS updates enhance both the visual consistency and usability of the inline task preview widget.
2025-06-22 10:20:42 +00:00
padding: 2px 4px;
fix(css): wrap inline task overlay title using white-space: break-spaces; (#517)
2025-08-31 00:41:15 +00:00
Refactor task update handling & cleanup inline widget styles • Introduce a new CodeMirror state effect for task updates in TaskLinkOverlay.ts: - Added the taskUpdateEffect to signal task updates. - Updated decoration rebuild logic to check for the new state effect instead of relying on a refreshController. - Modified the widget cache logic to clear active widgets when a task update effect is detected. - Removed the now-unused refreshController from the createTaskLinkField function. • Enhance global task update dispatching in main.ts: - Updated the import to include the new dispatchTaskUpdate helper. - Modified the task update listener to dispatch a proper state effect via dispatchTaskUpdate, passing along the task path received from the event. - This change ensures that the CodeMirror view correctly rebuilds decorations when a task update event occurs. • Clean up inline widget styles: - Removed outdated inline task preview and instant convert button styles from task-card-bem.css. - Created a new stylesheet (task-inline-widget.css) with BEM-named, scoped styles for inline task widgets. - The new stylesheet provides a clearer structure, improved responsiveness, and appropriate separation of concerns for inline widgets. This refactor modernizes the task link overlay update mechanism using CodeMirror’s state effects, simplifies the update flow in main.ts, and cleans up style management by migrating inline widget CSS to a dedicated file.
2025-06-10 11:01:07 +00:00
/* Interactivity */
fix: restore pointer cursor fallback on interactive elements (#1470)
2026-02-08 08:05:31 +00:00
cursor: var(--cursor, pointer);
fix(css): wrap inline task overlay title using white-space: break-spaces; (#517)
2025-08-31 00:41:15 +00:00
Refactor task update handling & cleanup inline widget styles • Introduce a new CodeMirror state effect for task updates in TaskLinkOverlay.ts: - Added the taskUpdateEffect to signal task updates. - Updated decoration rebuild logic to check for the new state effect instead of relying on a refreshController. - Modified the widget cache logic to clear active widgets when a task update effect is detected. - Removed the now-unused refreshController from the createTaskLinkField function. • Enhance global task update dispatching in main.ts: - Updated the import to include the new dispatchTaskUpdate helper. - Modified the task update listener to dispatch a proper state effect via dispatchTaskUpdate, passing along the task path received from the event. - This change ensures that the CodeMirror view correctly rebuilds decorations when a task update event occurs. • Clean up inline widget styles: - Removed outdated inline task preview and instant convert button styles from task-card-bem.css. - Created a new stylesheet (task-inline-widget.css) with BEM-named, scoped styles for inline task widgets. - The new stylesheet provides a clearer structure, improved responsiveness, and appropriate separation of concerns for inline widgets. This refactor modernizes the task link overlay update mechanism using CodeMirror’s state effects, simplifies the update flow in main.ts, and cleans up style management by migrating inline widget CSS to a dedicated file.
2025-06-10 11:01:07 +00:00
/* Prevent text selection issues */
user-select: none;
-webkit-user-select: none;
fix(css): wrap inline task overlay title using white-space: break-spaces; (#517)
2025-08-31 00:41:15 +00:00
Improve inline task preview widget layout and spacing • Switch layout from "display: inline" to "inline-flex" for .task-inline-preview to ensure proper element alignment, adding align-items: center and a gap for consistent spacing. • Update padding and margin values across elements:   – Add padding (2px 4px) to .task-inline-preview for improved clickable area.   – Adjust spacing on status dot, date icon, and pencil icon by setting explicit margin and vertical-align values. • Remove redundant task title styles and consolidate text overflow rules:   – Reduce max-width from 300px to 250px and add flex-shrink/vertical-align settings for better cropping and responsiveness. • Tweak responsive design in media query and reading mode context:   – Modify padding and gap in media query for max-width adjustments.   – Ensure reading mode styling uses consistent gap and increased padding. These CSS updates enhance both the visual consistency and usability of the inline task preview widget.
2025-06-22 10:20:42 +00:00
/* Ensure proper vertical alignment with text */
vertical-align: baseline;
line-height: 1.4;
Clean up CSS lint issues
2026-05-14 11:06:30 +00:00
animation: tn-fadeInTaskPreview 0.2s ease-out;
Refactor task update handling & cleanup inline widget styles • Introduce a new CodeMirror state effect for task updates in TaskLinkOverlay.ts: - Added the taskUpdateEffect to signal task updates. - Updated decoration rebuild logic to check for the new state effect instead of relying on a refreshController. - Modified the widget cache logic to clear active widgets when a task update effect is detected. - Removed the now-unused refreshController from the createTaskLinkField function. • Enhance global task update dispatching in main.ts: - Updated the import to include the new dispatchTaskUpdate helper. - Modified the task update listener to dispatch a proper state effect via dispatchTaskUpdate, passing along the task path received from the event. - This change ensures that the CodeMirror view correctly rebuilds decorations when a task update event occurs. • Clean up inline widget styles: - Removed outdated inline task preview and instant convert button styles from task-card-bem.css. - Created a new stylesheet (task-inline-widget.css) with BEM-named, scoped styles for inline task widgets. - The new stylesheet provides a clearer structure, improved responsiveness, and appropriate separation of concerns for inline widgets. This refactor modernizes the task link overlay update mechanism using CodeMirror’s state effects, simplifies the update flow in main.ts, and cleans up style management by migrating inline widget CSS to a dedicated file.
2025-06-10 11:01:07 +00:00
}
/* Hide when cursor is on the same line */
.tasknotes-plugin .task-inline-preview.task-inline-preview--cursor-hidden {
display: none;
}
feat(ui): update inline and card task widgets with enhanced status cycling and Todoist-inspired styling • In TaskLinkWidget.ts: - Added an import for dispatchTaskUpdate from TaskLinkOverlay. - Moved the status indicator dot before the task title and updated its styling to use a border color instead of text color. - Introduced a click handler on the status dot to: • Retrieve the latest task information. • Cycle the task status using the plugin’s statusManager. • Update the UI immediately (status dot color and container’s completed state). • Dispatch a system-wide task update event after a short delay. - Reordered the priority indicator dot so it appears before the title. • In TaskCard.ts: - Updated the status and priority dot styling from using backgroundColor to setting borderColor to better match the new theme. - Added a click handler on the status dot to: • Distinguish between recurring tasks (toggle completion) and standard tasks (cycle status). • Refresh task data before updating status. • Provide error feedback via a Notice on failure. - Adjusted the logic for dynamically adding/removing/updating the priority dot on task cards. • In task-card-bem.css: - Revamped task card styling to reflect a Todoist minimal/compact design: • Adjusted padding, margins, background, and interactive states. • Styled focus states, drag-and-drop feedback (ghosts, drop zones, and dragging pulsing animation), and media queries for responsive/touch devices. • Updated status dots, priority indicators, and added improvements for accessibility and reduced motion. - Replaced older animations and shadows with simplified transitions and color mixes. • In task-inline-widget.css: - Revised inline widget styling to align status dot appearance with the task card (matching border, size, and hover effects). - Updated task title styling to improve spacing. - Amended the completed status styling to show a filled circle checkmark. This commit refines both the task inline widget and task card components for consistent interactions and modern visual design while improving accessibility and responsive behavior.
2025-06-22 08:12:10 +00:00
/* Status indicator dot - match task card styling */
Refactor task update handling & cleanup inline widget styles • Introduce a new CodeMirror state effect for task updates in TaskLinkOverlay.ts: - Added the taskUpdateEffect to signal task updates. - Updated decoration rebuild logic to check for the new state effect instead of relying on a refreshController. - Modified the widget cache logic to clear active widgets when a task update effect is detected. - Removed the now-unused refreshController from the createTaskLinkField function. • Enhance global task update dispatching in main.ts: - Updated the import to include the new dispatchTaskUpdate helper. - Modified the task update listener to dispatch a proper state effect via dispatchTaskUpdate, passing along the task path received from the event. - This change ensures that the CodeMirror view correctly rebuilds decorations when a task update event occurs. • Clean up inline widget styles: - Removed outdated inline task preview and instant convert button styles from task-card-bem.css. - Created a new stylesheet (task-inline-widget.css) with BEM-named, scoped styles for inline task widgets. - The new stylesheet provides a clearer structure, improved responsiveness, and appropriate separation of concerns for inline widgets. This refactor modernizes the task link overlay update mechanism using CodeMirror’s state effects, simplifies the update flow in main.ts, and cleans up style management by migrating inline widget CSS to a dedicated file.
2025-06-10 11:01:07 +00:00
.tasknotes-plugin .task-inline-preview__status-dot {
ui: improve task inline widget status and priority dot alignment (#410)
2025-08-17 02:45:38 +00:00
display: inline-flex;
align-items: center;
justify-content: center;
feat(ui): update inline and card task widgets with enhanced status cycling and Todoist-inspired styling • In TaskLinkWidget.ts: - Added an import for dispatchTaskUpdate from TaskLinkOverlay. - Moved the status indicator dot before the task title and updated its styling to use a border color instead of text color. - Introduced a click handler on the status dot to: • Retrieve the latest task information. • Cycle the task status using the plugin’s statusManager. • Update the UI immediately (status dot color and container’s completed state). • Dispatch a system-wide task update event after a short delay. - Reordered the priority indicator dot so it appears before the title. • In TaskCard.ts: - Updated the status and priority dot styling from using backgroundColor to setting borderColor to better match the new theme. - Added a click handler on the status dot to: • Distinguish between recurring tasks (toggle completion) and standard tasks (cycle status). • Refresh task data before updating status. • Provide error feedback via a Notice on failure. - Adjusted the logic for dynamically adding/removing/updating the priority dot on task cards. • In task-card-bem.css: - Revamped task card styling to reflect a Todoist minimal/compact design: • Adjusted padding, margins, background, and interactive states. • Styled focus states, drag-and-drop feedback (ghosts, drop zones, and dragging pulsing animation), and media queries for responsive/touch devices. • Updated status dots, priority indicators, and added improvements for accessibility and reduced motion. - Replaced older animations and shadows with simplified transitions and color mixes. • In task-inline-widget.css: - Revised inline widget styling to align status dot appearance with the task card (matching border, size, and hover effects). - Updated task title styling to improve spacing. - Amended the completed status styling to show a filled circle checkmark. This commit refines both the task inline widget and task card components for consistent interactions and modern visual design while improving accessibility and responsive behavior.
2025-06-22 08:12:10 +00:00
width: 14px;
height: 14px;
border-radius: 50%;
border: 2px solid var(--tn-border-color);
background-color: transparent;
transition: all 0.2s ease;
fix: restore pointer cursor fallback on interactive elements (#1470)
2026-02-08 08:05:31 +00:00
cursor: var(--cursor, pointer);
feat(ui): update inline and card task widgets with enhanced status cycling and Todoist-inspired styling • In TaskLinkWidget.ts: - Added an import for dispatchTaskUpdate from TaskLinkOverlay. - Moved the status indicator dot before the task title and updated its styling to use a border color instead of text color. - Introduced a click handler on the status dot to: • Retrieve the latest task information. • Cycle the task status using the plugin’s statusManager. • Update the UI immediately (status dot color and container’s completed state). • Dispatch a system-wide task update event after a short delay. - Reordered the priority indicator dot so it appears before the title. • In TaskCard.ts: - Updated the status and priority dot styling from using backgroundColor to setting borderColor to better match the new theme. - Added a click handler on the status dot to: • Distinguish between recurring tasks (toggle completion) and standard tasks (cycle status). • Refresh task data before updating status. • Provide error feedback via a Notice on failure. - Adjusted the logic for dynamically adding/removing/updating the priority dot on task cards. • In task-card-bem.css: - Revamped task card styling to reflect a Todoist minimal/compact design: • Adjusted padding, margins, background, and interactive states. • Styled focus states, drag-and-drop feedback (ghosts, drop zones, and dragging pulsing animation), and media queries for responsive/touch devices. • Updated status dots, priority indicators, and added improvements for accessibility and reduced motion. - Replaced older animations and shadows with simplified transitions and color mixes. • In task-inline-widget.css: - Revised inline widget styling to align status dot appearance with the task card (matching border, size, and hover effects). - Updated task title styling to improve spacing. - Amended the completed status styling to show a filled circle checkmark. This commit refines both the task inline widget and task card components for consistent interactions and modern visual design while improving accessibility and responsive behavior.
2025-06-22 08:12:10 +00:00
position: relative;
flex-shrink: 0;
Improve inline task preview widget layout and spacing • Switch layout from "display: inline" to "inline-flex" for .task-inline-preview to ensure proper element alignment, adding align-items: center and a gap for consistent spacing. • Update padding and margin values across elements:   – Add padding (2px 4px) to .task-inline-preview for improved clickable area.   – Adjust spacing on status dot, date icon, and pencil icon by setting explicit margin and vertical-align values. • Remove redundant task title styles and consolidate text overflow rules:   – Reduce max-width from 300px to 250px and add flex-shrink/vertical-align settings for better cropping and responsiveness. • Tweak responsive design in media query and reading mode context:   – Modify padding and gap in media query for max-width adjustments.   – Ensure reading mode styling uses consistent gap and increased padding. These CSS updates enhance both the visual consistency and usability of the inline task preview widget.
2025-06-22 10:20:42 +00:00
margin-right: 6px; /* More gap between status and priority */
ui: improve task inline widget status and priority dot alignment (#410)
2025-08-17 02:45:38 +00:00
transform: translateY(2px); /* Lower the status circle slightly for better visual alignment */
feat(ui): update inline and card task widgets with enhanced status cycling and Todoist-inspired styling • In TaskLinkWidget.ts: - Added an import for dispatchTaskUpdate from TaskLinkOverlay. - Moved the status indicator dot before the task title and updated its styling to use a border color instead of text color. - Introduced a click handler on the status dot to: • Retrieve the latest task information. • Cycle the task status using the plugin’s statusManager. • Update the UI immediately (status dot color and container’s completed state). • Dispatch a system-wide task update event after a short delay. - Reordered the priority indicator dot so it appears before the title. • In TaskCard.ts: - Updated the status and priority dot styling from using backgroundColor to setting borderColor to better match the new theme. - Added a click handler on the status dot to: • Distinguish between recurring tasks (toggle completion) and standard tasks (cycle status). • Refresh task data before updating status. • Provide error feedback via a Notice on failure. - Adjusted the logic for dynamically adding/removing/updating the priority dot on task cards. • In task-card-bem.css: - Revamped task card styling to reflect a Todoist minimal/compact design: • Adjusted padding, margins, background, and interactive states. • Styled focus states, drag-and-drop feedback (ghosts, drop zones, and dragging pulsing animation), and media queries for responsive/touch devices. • Updated status dots, priority indicators, and added improvements for accessibility and reduced motion. - Replaced older animations and shadows with simplified transitions and color mixes. • In task-inline-widget.css: - Revised inline widget styling to align status dot appearance with the task card (matching border, size, and hover effects). - Updated task title styling to improve spacing. - Amended the completed status styling to show a filled circle checkmark. This commit refines both the task inline widget and task card components for consistent interactions and modern visual design while improving accessibility and responsive behavior.
2025-06-22 08:12:10 +00:00
}
.tasknotes-plugin .task-inline-preview__status-dot:hover {
border-color: var(--tn-text-muted);
Refactor Task Link/UI Updates and Enhance Status Handling • Refactored TaskLinkOverlay widget caching:  – In createTaskLinkField, now checks for a specific task update payload in transaction.effects.  – If a task update provides a taskPath, only active widgets whose key includes that path are removed; otherwise, all widgets are cleared.  – Updated widget creation logic to always build a new widget instance and update the cache only when the existing widget differs. • Improved dispatchTaskUpdate safety:  – Added validation to ensure the provided EditorView has a valid dispatch function before dispatching.  – Wrapped view.dispatch in a try-catch block to log errors if dispatching fails. • Enhanced TaskLinkWidget visual updates:  – Modified the status dot rendering: if the task is completed (using the plugin’s statusManager), the status dot is filled with the status color.  – Updated the widget’s click handler: ensured safe dispatch of task update events by checking the validity of the EditorView.  – Removed redundant inline checkmark and simplified visual design. • Updated main.ts task dispatch logic:  – Now extracts the task path from either data?.path or data?.updatedTask?.path to ensure the correct widget refresh is triggered. • Improved TaskService recurring task toggling:  – Retrieves fresh task data from the cache before toggling to reflect the latest completion state.  – Uses the fresh task info for checking recurrence, updating the cached task data, and triggering the EVENT_TASK_UPDATED notification. • Refined TaskCard UI updates:  – On toggling a recurring task’s completion, fetches the updated task info and computes the new effective status.  – Immediately updates the status dot’s border color and fills the task card with appropriate classes (e.g., completed, archived, active, recurring, priority, status).  – Adjusts the title element styling for a completed task. • Updated CSS for improved theming and interactivity:  – In task-action-palette-modal.css, updated category colors to be theme aware (using var(--color-blue), etc.), adjusted selected item opacity/colors.  – In task-card-bem.css, revised completed status styles:   * Now fills the status dot using the current status color instead of a transparent background with a checkmark.   * Increased the priority dot size from 6px to 8px.  – In task-inline-widget.css, added hover effects (box-shadow & scaling) to the inline status dot for better visual feedback. These changes enhance the efficiency of widget updates, improve error handling, provide clearer visual feedback on task status changes, and ensure consistency between task data and UI updates.
2025-06-22 09:33:03 +00:00
box-shadow: 0 0 6px rgba(100, 149, 237, 0.4);
ui: improve task inline widget status and priority dot alignment (#410)
2025-08-17 02:45:38 +00:00
transform: translateY(2px) scale(1.1); /* Maintain the lowered position while scaling */
Refactor task update handling & cleanup inline widget styles • Introduce a new CodeMirror state effect for task updates in TaskLinkOverlay.ts: - Added the taskUpdateEffect to signal task updates. - Updated decoration rebuild logic to check for the new state effect instead of relying on a refreshController. - Modified the widget cache logic to clear active widgets when a task update effect is detected. - Removed the now-unused refreshController from the createTaskLinkField function. • Enhance global task update dispatching in main.ts: - Updated the import to include the new dispatchTaskUpdate helper. - Modified the task update listener to dispatch a proper state effect via dispatchTaskUpdate, passing along the task path received from the event. - This change ensures that the CodeMirror view correctly rebuilds decorations when a task update event occurs. • Clean up inline widget styles: - Removed outdated inline task preview and instant convert button styles from task-card-bem.css. - Created a new stylesheet (task-inline-widget.css) with BEM-named, scoped styles for inline task widgets. - The new stylesheet provides a clearer structure, improved responsiveness, and appropriate separation of concerns for inline widgets. This refactor modernizes the task link overlay update mechanism using CodeMirror’s state effects, simplifies the update flow in main.ts, and cleans up style management by migrating inline widget CSS to a dedicated file.
2025-06-10 11:01:07 +00:00
}
feat(ui): update inline and card task widgets with enhanced status cycling and Todoist-inspired styling • In TaskLinkWidget.ts: - Added an import for dispatchTaskUpdate from TaskLinkOverlay. - Moved the status indicator dot before the task title and updated its styling to use a border color instead of text color. - Introduced a click handler on the status dot to: • Retrieve the latest task information. • Cycle the task status using the plugin’s statusManager. • Update the UI immediately (status dot color and container’s completed state). • Dispatch a system-wide task update event after a short delay. - Reordered the priority indicator dot so it appears before the title. • In TaskCard.ts: - Updated the status and priority dot styling from using backgroundColor to setting borderColor to better match the new theme. - Added a click handler on the status dot to: • Distinguish between recurring tasks (toggle completion) and standard tasks (cycle status). • Refresh task data before updating status. • Provide error feedback via a Notice on failure. - Adjusted the logic for dynamically adding/removing/updating the priority dot on task cards. • In task-card-bem.css: - Revamped task card styling to reflect a Todoist minimal/compact design: • Adjusted padding, margins, background, and interactive states. • Styled focus states, drag-and-drop feedback (ghosts, drop zones, and dragging pulsing animation), and media queries for responsive/touch devices. • Updated status dots, priority indicators, and added improvements for accessibility and reduced motion. - Replaced older animations and shadows with simplified transitions and color mixes. • In task-inline-widget.css: - Revised inline widget styling to align status dot appearance with the task card (matching border, size, and hover effects). - Updated task title styling to improve spacing. - Amended the completed status styling to show a filled circle checkmark. This commit refines both the task inline widget and task card components for consistent interactions and modern visual design while improving accessibility and responsive behavior.
2025-06-22 08:12:10 +00:00
/* Priority indicator dot - filled solid circle */
Refactor task update handling & cleanup inline widget styles • Introduce a new CodeMirror state effect for task updates in TaskLinkOverlay.ts: - Added the taskUpdateEffect to signal task updates. - Updated decoration rebuild logic to check for the new state effect instead of relying on a refreshController. - Modified the widget cache logic to clear active widgets when a task update effect is detected. - Removed the now-unused refreshController from the createTaskLinkField function. • Enhance global task update dispatching in main.ts: - Updated the import to include the new dispatchTaskUpdate helper. - Modified the task update listener to dispatch a proper state effect via dispatchTaskUpdate, passing along the task path received from the event. - This change ensures that the CodeMirror view correctly rebuilds decorations when a task update event occurs. • Clean up inline widget styles: - Removed outdated inline task preview and instant convert button styles from task-card-bem.css. - Created a new stylesheet (task-inline-widget.css) with BEM-named, scoped styles for inline task widgets. - The new stylesheet provides a clearer structure, improved responsiveness, and appropriate separation of concerns for inline widgets. This refactor modernizes the task link overlay update mechanism using CodeMirror’s state effects, simplifies the update flow in main.ts, and cleans up style management by migrating inline widget CSS to a dedicated file.
2025-06-10 11:01:07 +00:00
.tasknotes-plugin .task-inline-preview__priority-dot {
ui: improve task inline widget status and priority dot alignment (#410)
2025-08-17 02:45:38 +00:00
display: inline-flex;
align-items: center;
justify-content: center;
Fix widget alignment
2025-06-29 02:25:52 +00:00
width: 10px;
height: 10px;
feat(ui): update inline and card task widgets with enhanced status cycling and Todoist-inspired styling • In TaskLinkWidget.ts: - Added an import for dispatchTaskUpdate from TaskLinkOverlay. - Moved the status indicator dot before the task title and updated its styling to use a border color instead of text color. - Introduced a click handler on the status dot to: • Retrieve the latest task information. • Cycle the task status using the plugin’s statusManager. • Update the UI immediately (status dot color and container’s completed state). • Dispatch a system-wide task update event after a short delay. - Reordered the priority indicator dot so it appears before the title. • In TaskCard.ts: - Updated the status and priority dot styling from using backgroundColor to setting borderColor to better match the new theme. - Added a click handler on the status dot to: • Distinguish between recurring tasks (toggle completion) and standard tasks (cycle status). • Refresh task data before updating status. • Provide error feedback via a Notice on failure. - Adjusted the logic for dynamically adding/removing/updating the priority dot on task cards. • In task-card-bem.css: - Revamped task card styling to reflect a Todoist minimal/compact design: • Adjusted padding, margins, background, and interactive states. • Styled focus states, drag-and-drop feedback (ghosts, drop zones, and dragging pulsing animation), and media queries for responsive/touch devices. • Updated status dots, priority indicators, and added improvements for accessibility and reduced motion. - Replaced older animations and shadows with simplified transitions and color mixes. • In task-inline-widget.css: - Revised inline widget styling to align status dot appearance with the task card (matching border, size, and hover effects). - Updated task title styling to improve spacing. - Amended the completed status styling to show a filled circle checkmark. This commit refines both the task inline widget and task card components for consistent interactions and modern visual design while improving accessibility and responsive behavior.
2025-06-22 08:12:10 +00:00
border-radius: 50%;
background-color: var(--tn-text-muted);
border: none;
flex-shrink: 0;
Improve inline task preview widget layout and spacing • Switch layout from "display: inline" to "inline-flex" for .task-inline-preview to ensure proper element alignment, adding align-items: center and a gap for consistent spacing. • Update padding and margin values across elements:   – Add padding (2px 4px) to .task-inline-preview for improved clickable area.   – Adjust spacing on status dot, date icon, and pencil icon by setting explicit margin and vertical-align values. • Remove redundant task title styles and consolidate text overflow rules:   – Reduce max-width from 300px to 250px and add flex-shrink/vertical-align settings for better cropping and responsiveness. • Tweak responsive design in media query and reading mode context:   – Modify padding and gap in media query for max-width adjustments.   – Ensure reading mode styling uses consistent gap and increased padding. These CSS updates enhance both the visual consistency and usability of the inline task preview widget.
2025-06-22 10:20:42 +00:00
margin-right: 6px; /* Gap between priority and title */
fix: restore pointer cursor fallback on interactive elements (#1470)
2026-02-08 08:05:31 +00:00
cursor: var(--cursor, pointer);
Refactor task update handling & cleanup inline widget styles • Introduce a new CodeMirror state effect for task updates in TaskLinkOverlay.ts: - Added the taskUpdateEffect to signal task updates. - Updated decoration rebuild logic to check for the new state effect instead of relying on a refreshController. - Modified the widget cache logic to clear active widgets when a task update effect is detected. - Removed the now-unused refreshController from the createTaskLinkField function. • Enhance global task update dispatching in main.ts: - Updated the import to include the new dispatchTaskUpdate helper. - Modified the task update listener to dispatch a proper state effect via dispatchTaskUpdate, passing along the task path received from the event. - This change ensures that the CodeMirror view correctly rebuilds decorations when a task update event occurs. • Clean up inline widget styles: - Removed outdated inline task preview and instant convert button styles from task-card-bem.css. - Created a new stylesheet (task-inline-widget.css) with BEM-named, scoped styles for inline task widgets. - The new stylesheet provides a clearer structure, improved responsiveness, and appropriate separation of concerns for inline widgets. This refactor modernizes the task link overlay update mechanism using CodeMirror’s state effects, simplifies the update flow in main.ts, and cleans up style management by migrating inline widget CSS to a dedicated file.
2025-06-10 11:01:07 +00:00
}
/* Date info styling */
.tasknotes-plugin .task-inline-preview__date {
opacity: 0.7;
font-size: 0.9em;
Add clickable date fields with modals and UI enhancements in TaskLinkWidget This commit introduces several improvements to the inline task preview by making the due and scheduled date fields interactive. The main changes include: • In TaskLinkWidget.ts: - Enhanced the due date span element by appending an extra CSS class ("task-inline-preview__date--clickable") and updating its tooltip to indicate that the date is clickable. - Added an event listener on the due date span so that clicking it asynchronously imports and opens the DueDateModal. This makes it easier for users to modify the due date directly from the inline preview. - Similarly, updated the scheduled date span element with the clickable class and updated tooltip, and attached an event listener to asynchronously import and display the ScheduledDateModal when clicked. - Both click handlers prevent event propagation and default actions, ensuring a smooth user experience. • In task-inline-widget.css: - Introduced new styles for clickable date elements, including a pointer cursor, padding, border-radius, and smooth transitions. - Added hover effects for clickable date elements, such as increased opacity, background color change, and a slight upward translation, providing visual feedback when users interact with the dates. - Applied similar transition effects to icons and pencil elements for consistency across the widget UI. These changes improve the overall interactivity and user experience of task editing, allowing quick modifications to dates without leaving the current context.
2025-06-22 09:47:25 +00:00
transition: opacity 0.15s ease;
Improve inline task preview widget layout and spacing • Switch layout from "display: inline" to "inline-flex" for .task-inline-preview to ensure proper element alignment, adding align-items: center and a gap for consistent spacing. • Update padding and margin values across elements:   – Add padding (2px 4px) to .task-inline-preview for improved clickable area.   – Adjust spacing on status dot, date icon, and pencil icon by setting explicit margin and vertical-align values. • Remove redundant task title styles and consolidate text overflow rules:   – Reduce max-width from 300px to 250px and add flex-shrink/vertical-align settings for better cropping and responsiveness. • Tweak responsive design in media query and reading mode context:   – Modify padding and gap in media query for max-width adjustments.   – Ensure reading mode styling uses consistent gap and increased padding. These CSS updates enhance both the visual consistency and usability of the inline task preview widget.
2025-06-22 10:20:42 +00:00
flex-shrink: 0;
Fix widget alignment
2025-06-29 02:25:52 +00:00
vertical-align: baseline;
Add clickable date fields with modals and UI enhancements in TaskLinkWidget This commit introduces several improvements to the inline task preview by making the due and scheduled date fields interactive. The main changes include: • In TaskLinkWidget.ts: - Enhanced the due date span element by appending an extra CSS class ("task-inline-preview__date--clickable") and updating its tooltip to indicate that the date is clickable. - Added an event listener on the due date span so that clicking it asynchronously imports and opens the DueDateModal. This makes it easier for users to modify the due date directly from the inline preview. - Similarly, updated the scheduled date span element with the clickable class and updated tooltip, and attached an event listener to asynchronously import and display the ScheduledDateModal when clicked. - Both click handlers prevent event propagation and default actions, ensuring a smooth user experience. • In task-inline-widget.css: - Introduced new styles for clickable date elements, including a pointer cursor, padding, border-radius, and smooth transitions. - Added hover effects for clickable date elements, such as increased opacity, background color change, and a slight upward translation, providing visual feedback when users interact with the dates. - Applied similar transition effects to icons and pencil elements for consistency across the widget UI. These changes improve the overall interactivity and user experience of task editing, allowing quick modifications to dates without leaving the current context.
2025-06-22 09:47:25 +00:00
}
/* Clickable date styling */
.tasknotes-plugin .task-inline-preview__date--clickable {
fix: restore pointer cursor fallback on interactive elements (#1470)
2026-02-08 08:05:31 +00:00
cursor: var(--cursor, pointer);
Add clickable date fields with modals and UI enhancements in TaskLinkWidget This commit introduces several improvements to the inline task preview by making the due and scheduled date fields interactive. The main changes include: • In TaskLinkWidget.ts: - Enhanced the due date span element by appending an extra CSS class ("task-inline-preview__date--clickable") and updating its tooltip to indicate that the date is clickable. - Added an event listener on the due date span so that clicking it asynchronously imports and opens the DueDateModal. This makes it easier for users to modify the due date directly from the inline preview. - Similarly, updated the scheduled date span element with the clickable class and updated tooltip, and attached an event listener to asynchronously import and display the ScheduledDateModal when clicked. - Both click handlers prevent event propagation and default actions, ensuring a smooth user experience. • In task-inline-widget.css: - Introduced new styles for clickable date elements, including a pointer cursor, padding, border-radius, and smooth transitions. - Added hover effects for clickable date elements, such as increased opacity, background color change, and a slight upward translation, providing visual feedback when users interact with the dates. - Applied similar transition effects to icons and pencil elements for consistency across the widget UI. These changes improve the overall interactivity and user experience of task editing, allowing quick modifications to dates without leaving the current context.
2025-06-22 09:47:25 +00:00
border-radius: 3px;
padding: 1px 3px;
transition: all 0.15s ease;
}
.tasknotes-plugin .task-inline-preview__date--clickable:hover {
opacity: 1;
background-color: var(--background-modifier-hover);
transform: translateY(-1px);
Refactor task update handling & cleanup inline widget styles • Introduce a new CodeMirror state effect for task updates in TaskLinkOverlay.ts: - Added the taskUpdateEffect to signal task updates. - Updated decoration rebuild logic to check for the new state effect instead of relying on a refreshController. - Modified the widget cache logic to clear active widgets when a task update effect is detected. - Removed the now-unused refreshController from the createTaskLinkField function. • Enhance global task update dispatching in main.ts: - Updated the import to include the new dispatchTaskUpdate helper. - Modified the task update listener to dispatch a proper state effect via dispatchTaskUpdate, passing along the task path received from the event. - This change ensures that the CodeMirror view correctly rebuilds decorations when a task update event occurs. • Clean up inline widget styles: - Removed outdated inline task preview and instant convert button styles from task-card-bem.css. - Created a new stylesheet (task-inline-widget.css) with BEM-named, scoped styles for inline task widgets. - The new stylesheet provides a clearer structure, improved responsiveness, and appropriate separation of concerns for inline widgets. This refactor modernizes the task link overlay update mechanism using CodeMirror’s state effects, simplifies the update flow in main.ts, and cleans up style management by migrating inline widget CSS to a dedicated file.
2025-06-10 11:01:07 +00:00
}
/* Date icon styling */
.tasknotes-plugin .task-inline-preview__date-icon {
display: inline-block;
width: 12px;
height: 12px;
Refactor task UI to support and update recurring tasks with context menus • Update TaskLinkWidget.ts: - Import and use additional helper functions (getEffectiveTaskStatus, getDatePart, getTimePart) for better date and status handling. - For recurring tasks, determine an effective task status based on the target date and update the click handler to toggle completion using toggleRecurringTaskComplete. - Switch status dot styling and tooltip updates to reflect effective status changes. - Add click context menus for priority, due date, scheduled date, and recurrence. These context menus let users update the respective task properties inline, updating both the UI and the internal task data. - When a user interacts (clicks) on date or priority elements, the corresponding context menu (DateContextMenu, PriorityContextMenu or RecurrenceContextMenu) is displayed and selections update the task properties accordingly. - Improve the equality check by considering recurrence and complete_instances in the widget’s comparison. • Update TaskCard.ts: - Import and integrate RecurrenceContextMenu. - For tasks with recurrence, adjust tooltip attributes on the recurring indicator to indicate clickable functionality. - Add a click event on the recurring indicator to show a RecurrenceContextMenu, allowing the user to update the recurrence pattern. If an error occurs, a Notice is shown to the user. • Update CSS styles (task-card-bem.css and task-inline-widget.css): - Enhance styling for recurring indicators in both card and inline widget views. - Adjust positions, sizes, margins, and transitions for better visual feedback and interactivity (e.g., hover effects, cursor pointer). - Align and style the recurring icon (using Obsidian’s rotate-ccw icon) consistently in both TaskCard and TaskLinkWidget. These changes ensure consistency with TaskCard interactions and improve the overall user experience for recurring tasks and inline task properties editing.
2025-06-29 00:41:37 +00:00
margin-left: 6px;
Improve inline task preview widget layout and spacing • Switch layout from "display: inline" to "inline-flex" for .task-inline-preview to ensure proper element alignment, adding align-items: center and a gap for consistent spacing. • Update padding and margin values across elements:   – Add padding (2px 4px) to .task-inline-preview for improved clickable area.   – Adjust spacing on status dot, date icon, and pencil icon by setting explicit margin and vertical-align values. • Remove redundant task title styles and consolidate text overflow rules:   – Reduce max-width from 300px to 250px and add flex-shrink/vertical-align settings for better cropping and responsiveness. • Tweak responsive design in media query and reading mode context:   – Modify padding and gap in media query for max-width adjustments.   – Ensure reading mode styling uses consistent gap and increased padding. These CSS updates enhance both the visual consistency and usability of the inline task preview widget.
2025-06-22 10:20:42 +00:00
margin-right: 6px;
Add clickable date fields with modals and UI enhancements in TaskLinkWidget This commit introduces several improvements to the inline task preview by making the due and scheduled date fields interactive. The main changes include: • In TaskLinkWidget.ts: - Enhanced the due date span element by appending an extra CSS class ("task-inline-preview__date--clickable") and updating its tooltip to indicate that the date is clickable. - Added an event listener on the due date span so that clicking it asynchronously imports and opens the DueDateModal. This makes it easier for users to modify the due date directly from the inline preview. - Similarly, updated the scheduled date span element with the clickable class and updated tooltip, and attached an event listener to asynchronously import and display the ScheduledDateModal when clicked. - Both click handlers prevent event propagation and default actions, ensuring a smooth user experience. • In task-inline-widget.css: - Introduced new styles for clickable date elements, including a pointer cursor, padding, border-radius, and smooth transitions. - Added hover effects for clickable date elements, such as increased opacity, background color change, and a slight upward translation, providing visual feedback when users interact with the dates. - Applied similar transition effects to icons and pencil elements for consistency across the widget UI. These changes improve the overall interactivity and user experience of task editing, allowing quick modifications to dates without leaving the current context.
2025-06-22 09:47:25 +00:00
transition: opacity 0.15s ease;
Fix widget alignment
2025-06-29 02:25:52 +00:00
vertical-align: baseline;
Add clickable date fields with modals and UI enhancements in TaskLinkWidget This commit introduces several improvements to the inline task preview by making the due and scheduled date fields interactive. The main changes include: • In TaskLinkWidget.ts: - Enhanced the due date span element by appending an extra CSS class ("task-inline-preview__date--clickable") and updating its tooltip to indicate that the date is clickable. - Added an event listener on the due date span so that clicking it asynchronously imports and opens the DueDateModal. This makes it easier for users to modify the due date directly from the inline preview. - Similarly, updated the scheduled date span element with the clickable class and updated tooltip, and attached an event listener to asynchronously import and display the ScheduledDateModal when clicked. - Both click handlers prevent event propagation and default actions, ensuring a smooth user experience. • In task-inline-widget.css: - Introduced new styles for clickable date elements, including a pointer cursor, padding, border-radius, and smooth transitions. - Added hover effects for clickable date elements, such as increased opacity, background color change, and a slight upward translation, providing visual feedback when users interact with the dates. - Applied similar transition effects to icons and pencil elements for consistency across the widget UI. These changes improve the overall interactivity and user experience of task editing, allowing quick modifications to dates without leaving the current context.
2025-06-22 09:47:25 +00:00
}
Fix alignment
2025-06-22 10:58:30 +00:00
/* Fix Lucide icon alignment within date icons */
.tasknotes-plugin .task-inline-preview__date-icon svg {
Fix widget alignment
2025-06-29 02:25:52 +00:00
vertical-align: baseline;
Fix alignment
2025-06-22 10:58:30 +00:00
width: 12px;
height: 12px;
}
Add clickable date fields with modals and UI enhancements in TaskLinkWidget This commit introduces several improvements to the inline task preview by making the due and scheduled date fields interactive. The main changes include: • In TaskLinkWidget.ts: - Enhanced the due date span element by appending an extra CSS class ("task-inline-preview__date--clickable") and updating its tooltip to indicate that the date is clickable. - Added an event listener on the due date span so that clicking it asynchronously imports and opens the DueDateModal. This makes it easier for users to modify the due date directly from the inline preview. - Similarly, updated the scheduled date span element with the clickable class and updated tooltip, and attached an event listener to asynchronously import and display the ScheduledDateModal when clicked. - Both click handlers prevent event propagation and default actions, ensuring a smooth user experience. • In task-inline-widget.css: - Introduced new styles for clickable date elements, including a pointer cursor, padding, border-radius, and smooth transitions. - Added hover effects for clickable date elements, such as increased opacity, background color change, and a slight upward translation, providing visual feedback when users interact with the dates. - Applied similar transition effects to icons and pencil elements for consistency across the widget UI. These changes improve the overall interactivity and user experience of task editing, allowing quick modifications to dates without leaving the current context.
2025-06-22 09:47:25 +00:00
.tasknotes-plugin .task-inline-preview__date--clickable:hover .task-inline-preview__date-icon {
opacity: 1;
filter: brightness(1.3);
Refactor task update handling & cleanup inline widget styles • Introduce a new CodeMirror state effect for task updates in TaskLinkOverlay.ts: - Added the taskUpdateEffect to signal task updates. - Updated decoration rebuild logic to check for the new state effect instead of relying on a refreshController. - Modified the widget cache logic to clear active widgets when a task update effect is detected. - Removed the now-unused refreshController from the createTaskLinkField function. • Enhance global task update dispatching in main.ts: - Updated the import to include the new dispatchTaskUpdate helper. - Modified the task update listener to dispatch a proper state effect via dispatchTaskUpdate, passing along the task path received from the event. - This change ensures that the CodeMirror view correctly rebuilds decorations when a task update event occurs. • Clean up inline widget styles: - Removed outdated inline task preview and instant convert button styles from task-card-bem.css. - Created a new stylesheet (task-inline-widget.css) with BEM-named, scoped styles for inline task widgets. - The new stylesheet provides a clearer structure, improved responsiveness, and appropriate separation of concerns for inline widgets. This refactor modernizes the task link overlay update mechanism using CodeMirror’s state effects, simplifies the update flow in main.ts, and cleans up style management by migrating inline widget CSS to a dedicated file.
2025-06-10 11:01:07 +00:00
}
Refactor task UI to support and update recurring tasks with context menus • Update TaskLinkWidget.ts: - Import and use additional helper functions (getEffectiveTaskStatus, getDatePart, getTimePart) for better date and status handling. - For recurring tasks, determine an effective task status based on the target date and update the click handler to toggle completion using toggleRecurringTaskComplete. - Switch status dot styling and tooltip updates to reflect effective status changes. - Add click context menus for priority, due date, scheduled date, and recurrence. These context menus let users update the respective task properties inline, updating both the UI and the internal task data. - When a user interacts (clicks) on date or priority elements, the corresponding context menu (DateContextMenu, PriorityContextMenu or RecurrenceContextMenu) is displayed and selections update the task properties accordingly. - Improve the equality check by considering recurrence and complete_instances in the widget’s comparison. • Update TaskCard.ts: - Import and integrate RecurrenceContextMenu. - For tasks with recurrence, adjust tooltip attributes on the recurring indicator to indicate clickable functionality. - Add a click event on the recurring indicator to show a RecurrenceContextMenu, allowing the user to update the recurrence pattern. If an error occurs, a Notice is shown to the user. • Update CSS styles (task-card-bem.css and task-inline-widget.css): - Enhance styling for recurring indicators in both card and inline widget views. - Adjust positions, sizes, margins, and transitions for better visual feedback and interactivity (e.g., hover effects, cursor pointer). - Align and style the recurring icon (using Obsidian’s rotate-ccw icon) consistently in both TaskCard and TaskLinkWidget. These changes ensure consistency with TaskCard interactions and improve the overall user experience for recurring tasks and inline task properties editing.
2025-06-29 00:41:37 +00:00
/* Recurring indicator styling */
.tasknotes-plugin .task-inline-preview__recurring-indicator {
opacity: 0.6;
fix: restore pointer cursor fallback on interactive elements (#1470)
2026-02-08 08:05:31 +00:00
cursor: var(--cursor, pointer);
Refactor task UI to support and update recurring tasks with context menus • Update TaskLinkWidget.ts: - Import and use additional helper functions (getEffectiveTaskStatus, getDatePart, getTimePart) for better date and status handling. - For recurring tasks, determine an effective task status based on the target date and update the click handler to toggle completion using toggleRecurringTaskComplete. - Switch status dot styling and tooltip updates to reflect effective status changes. - Add click context menus for priority, due date, scheduled date, and recurrence. These context menus let users update the respective task properties inline, updating both the UI and the internal task data. - When a user interacts (clicks) on date or priority elements, the corresponding context menu (DateContextMenu, PriorityContextMenu or RecurrenceContextMenu) is displayed and selections update the task properties accordingly. - Improve the equality check by considering recurrence and complete_instances in the widget’s comparison. • Update TaskCard.ts: - Import and integrate RecurrenceContextMenu. - For tasks with recurrence, adjust tooltip attributes on the recurring indicator to indicate clickable functionality. - Add a click event on the recurring indicator to show a RecurrenceContextMenu, allowing the user to update the recurrence pattern. If an error occurs, a Notice is shown to the user. • Update CSS styles (task-card-bem.css and task-inline-widget.css): - Enhance styling for recurring indicators in both card and inline widget views. - Adjust positions, sizes, margins, and transitions for better visual feedback and interactivity (e.g., hover effects, cursor pointer). - Align and style the recurring icon (using Obsidian’s rotate-ccw icon) consistently in both TaskCard and TaskLinkWidget. These changes ensure consistency with TaskCard interactions and improve the overall user experience for recurring tasks and inline task properties editing.
2025-06-29 00:41:37 +00:00
display: inline-block;
width: 12px;
height: 12px;
border-radius: 3px;
padding: 1px 3px;
transition: all 0.15s ease;
flex-shrink: 0;
Fix widget alignment
2025-06-29 02:25:52 +00:00
vertical-align: baseline;
Refactor task UI to support and update recurring tasks with context menus • Update TaskLinkWidget.ts: - Import and use additional helper functions (getEffectiveTaskStatus, getDatePart, getTimePart) for better date and status handling. - For recurring tasks, determine an effective task status based on the target date and update the click handler to toggle completion using toggleRecurringTaskComplete. - Switch status dot styling and tooltip updates to reflect effective status changes. - Add click context menus for priority, due date, scheduled date, and recurrence. These context menus let users update the respective task properties inline, updating both the UI and the internal task data. - When a user interacts (clicks) on date or priority elements, the corresponding context menu (DateContextMenu, PriorityContextMenu or RecurrenceContextMenu) is displayed and selections update the task properties accordingly. - Improve the equality check by considering recurrence and complete_instances in the widget’s comparison. • Update TaskCard.ts: - Import and integrate RecurrenceContextMenu. - For tasks with recurrence, adjust tooltip attributes on the recurring indicator to indicate clickable functionality. - Add a click event on the recurring indicator to show a RecurrenceContextMenu, allowing the user to update the recurrence pattern. If an error occurs, a Notice is shown to the user. • Update CSS styles (task-card-bem.css and task-inline-widget.css): - Enhance styling for recurring indicators in both card and inline widget views. - Adjust positions, sizes, margins, and transitions for better visual feedback and interactivity (e.g., hover effects, cursor pointer). - Align and style the recurring icon (using Obsidian’s rotate-ccw icon) consistently in both TaskCard and TaskLinkWidget. These changes ensure consistency with TaskCard interactions and improve the overall user experience for recurring tasks and inline task properties editing.
2025-06-29 00:41:37 +00:00
margin-right: 2px;
}
/* Fix Lucide icon alignment within recurring indicator */
.tasknotes-plugin .task-inline-preview__recurring-indicator svg {
Fix widget alignment
2025-06-29 02:25:52 +00:00
vertical-align: baseline;
Refactor task UI to support and update recurring tasks with context menus • Update TaskLinkWidget.ts: - Import and use additional helper functions (getEffectiveTaskStatus, getDatePart, getTimePart) for better date and status handling. - For recurring tasks, determine an effective task status based on the target date and update the click handler to toggle completion using toggleRecurringTaskComplete. - Switch status dot styling and tooltip updates to reflect effective status changes. - Add click context menus for priority, due date, scheduled date, and recurrence. These context menus let users update the respective task properties inline, updating both the UI and the internal task data. - When a user interacts (clicks) on date or priority elements, the corresponding context menu (DateContextMenu, PriorityContextMenu or RecurrenceContextMenu) is displayed and selections update the task properties accordingly. - Improve the equality check by considering recurrence and complete_instances in the widget’s comparison. • Update TaskCard.ts: - Import and integrate RecurrenceContextMenu. - For tasks with recurrence, adjust tooltip attributes on the recurring indicator to indicate clickable functionality. - Add a click event on the recurring indicator to show a RecurrenceContextMenu, allowing the user to update the recurrence pattern. If an error occurs, a Notice is shown to the user. • Update CSS styles (task-card-bem.css and task-inline-widget.css): - Enhance styling for recurring indicators in both card and inline widget views. - Adjust positions, sizes, margins, and transitions for better visual feedback and interactivity (e.g., hover effects, cursor pointer). - Align and style the recurring icon (using Obsidian’s rotate-ccw icon) consistently in both TaskCard and TaskLinkWidget. These changes ensure consistency with TaskCard interactions and improve the overall user experience for recurring tasks and inline task properties editing.
2025-06-29 00:41:37 +00:00
width: 12px;
height: 12px;
}
.tasknotes-plugin .task-inline-preview:hover .task-inline-preview__recurring-indicator {
opacity: 0.8;
}
.tasknotes-plugin .task-inline-preview__recurring-indicator:hover {
opacity: 1;
color: var(--interactive-accent);
transform: translateY(-1px);
filter: brightness(1.3);
}
Refactor task update handling & cleanup inline widget styles • Introduce a new CodeMirror state effect for task updates in TaskLinkOverlay.ts: - Added the taskUpdateEffect to signal task updates. - Updated decoration rebuild logic to check for the new state effect instead of relying on a refreshController. - Modified the widget cache logic to clear active widgets when a task update effect is detected. - Removed the now-unused refreshController from the createTaskLinkField function. • Enhance global task update dispatching in main.ts: - Updated the import to include the new dispatchTaskUpdate helper. - Modified the task update listener to dispatch a proper state effect via dispatchTaskUpdate, passing along the task path received from the event. - This change ensures that the CodeMirror view correctly rebuilds decorations when a task update event occurs. • Clean up inline widget styles: - Removed outdated inline task preview and instant convert button styles from task-card-bem.css. - Created a new stylesheet (task-inline-widget.css) with BEM-named, scoped styles for inline task widgets. - The new stylesheet provides a clearer structure, improved responsiveness, and appropriate separation of concerns for inline widgets. This refactor modernizes the task link overlay update mechanism using CodeMirror’s state effects, simplifies the update flow in main.ts, and cleans up style management by migrating inline widget CSS to a dedicated file.
2025-06-10 11:01:07 +00:00
/* Pencil icon styling */
.tasknotes-plugin .task-inline-preview__pencil {
Change task-related icons and update CSS styling for improved UI clarity and interactivity. • Update icon usage: - In TaskLinkWidget.ts and TaskCard.ts, replace the default "pencil" icon with Obsidian’s built-in "ellipsis-vertical" icon. (#80) - This change clarifies that the icon now represents a menu/options action rather than a direct edit. • Adjust task card styling: - In task-card-bem.css, modify the top position of the recurring-indicator from 6px to 8px for better vertical alignment. • Refine task inline widget styles: - In task-inline-widget.css, set the opacity of the pencil icon from 0.4 to 0, effectively hiding it since it’s no longer used for editing. - Add a hover effect for completed task titles, enhancing visual feedback by changing the text color and opacity. - Enhance the hover style for task titles by adding a pointer cursor, transition effect, slight padding, and a border-radius to improve the interactive appearance. These adjustments aim to streamline the UI elements and provide clearer interactive cues for users.
2025-06-29 00:52:37 +00:00
opacity: 0;
fix: restore pointer cursor fallback on interactive elements (#1470)
2026-02-08 08:05:31 +00:00
cursor: var(--cursor, pointer);
Refactor task update handling & cleanup inline widget styles • Introduce a new CodeMirror state effect for task updates in TaskLinkOverlay.ts: - Added the taskUpdateEffect to signal task updates. - Updated decoration rebuild logic to check for the new state effect instead of relying on a refreshController. - Modified the widget cache logic to clear active widgets when a task update effect is detected. - Removed the now-unused refreshController from the createTaskLinkField function. • Enhance global task update dispatching in main.ts: - Updated the import to include the new dispatchTaskUpdate helper. - Modified the task update listener to dispatch a proper state effect via dispatchTaskUpdate, passing along the task path received from the event. - This change ensures that the CodeMirror view correctly rebuilds decorations when a task update event occurs. • Clean up inline widget styles: - Removed outdated inline task preview and instant convert button styles from task-card-bem.css. - Created a new stylesheet (task-inline-widget.css) with BEM-named, scoped styles for inline task widgets. - The new stylesheet provides a clearer structure, improved responsiveness, and appropriate separation of concerns for inline widgets. This refactor modernizes the task link overlay update mechanism using CodeMirror’s state effects, simplifies the update flow in main.ts, and cleans up style management by migrating inline widget CSS to a dedicated file.
2025-06-10 11:01:07 +00:00
display: inline-block;
width: 12px;
height: 12px;
Add clickable date fields with modals and UI enhancements in TaskLinkWidget This commit introduces several improvements to the inline task preview by making the due and scheduled date fields interactive. The main changes include: • In TaskLinkWidget.ts: - Enhanced the due date span element by appending an extra CSS class ("task-inline-preview__date--clickable") and updating its tooltip to indicate that the date is clickable. - Added an event listener on the due date span so that clicking it asynchronously imports and opens the DueDateModal. This makes it easier for users to modify the due date directly from the inline preview. - Similarly, updated the scheduled date span element with the clickable class and updated tooltip, and attached an event listener to asynchronously import and display the ScheduledDateModal when clicked. - Both click handlers prevent event propagation and default actions, ensuring a smooth user experience. • In task-inline-widget.css: - Introduced new styles for clickable date elements, including a pointer cursor, padding, border-radius, and smooth transitions. - Added hover effects for clickable date elements, such as increased opacity, background color change, and a slight upward translation, providing visual feedback when users interact with the dates. - Applied similar transition effects to icons and pencil elements for consistency across the widget UI. These changes improve the overall interactivity and user experience of task editing, allowing quick modifications to dates without leaving the current context.
2025-06-22 09:47:25 +00:00
border-radius: 3px;
padding: 1px 3px;
transition: all 0.15s ease;
Improve inline task preview widget layout and spacing • Switch layout from "display: inline" to "inline-flex" for .task-inline-preview to ensure proper element alignment, adding align-items: center and a gap for consistent spacing. • Update padding and margin values across elements:   – Add padding (2px 4px) to .task-inline-preview for improved clickable area.   – Adjust spacing on status dot, date icon, and pencil icon by setting explicit margin and vertical-align values. • Remove redundant task title styles and consolidate text overflow rules:   – Reduce max-width from 300px to 250px and add flex-shrink/vertical-align settings for better cropping and responsiveness. • Tweak responsive design in media query and reading mode context:   – Modify padding and gap in media query for max-width adjustments.   – Ensure reading mode styling uses consistent gap and increased padding. These CSS updates enhance both the visual consistency and usability of the inline task preview widget.
2025-06-22 10:20:42 +00:00
flex-shrink: 0;
Fix widget alignment
2025-06-29 02:25:52 +00:00
vertical-align: baseline;
Refactor task update handling & cleanup inline widget styles • Introduce a new CodeMirror state effect for task updates in TaskLinkOverlay.ts: - Added the taskUpdateEffect to signal task updates. - Updated decoration rebuild logic to check for the new state effect instead of relying on a refreshController. - Modified the widget cache logic to clear active widgets when a task update effect is detected. - Removed the now-unused refreshController from the createTaskLinkField function. • Enhance global task update dispatching in main.ts: - Updated the import to include the new dispatchTaskUpdate helper. - Modified the task update listener to dispatch a proper state effect via dispatchTaskUpdate, passing along the task path received from the event. - This change ensures that the CodeMirror view correctly rebuilds decorations when a task update event occurs. • Clean up inline widget styles: - Removed outdated inline task preview and instant convert button styles from task-card-bem.css. - Created a new stylesheet (task-inline-widget.css) with BEM-named, scoped styles for inline task widgets. - The new stylesheet provides a clearer structure, improved responsiveness, and appropriate separation of concerns for inline widgets. This refactor modernizes the task link overlay update mechanism using CodeMirror’s state effects, simplifies the update flow in main.ts, and cleans up style management by migrating inline widget CSS to a dedicated file.
2025-06-10 11:01:07 +00:00
}
Fix alignment
2025-06-22 10:58:30 +00:00
/* Fix Lucide icon alignment within pencil icon */
.tasknotes-plugin .task-inline-preview__pencil svg {
Fix widget alignment
2025-06-29 02:25:52 +00:00
vertical-align: baseline;
Fix alignment
2025-06-22 10:58:30 +00:00
width: 12px;
height: 12px;
}
Refactor task update handling & cleanup inline widget styles • Introduce a new CodeMirror state effect for task updates in TaskLinkOverlay.ts: - Added the taskUpdateEffect to signal task updates. - Updated decoration rebuild logic to check for the new state effect instead of relying on a refreshController. - Modified the widget cache logic to clear active widgets when a task update effect is detected. - Removed the now-unused refreshController from the createTaskLinkField function. • Enhance global task update dispatching in main.ts: - Updated the import to include the new dispatchTaskUpdate helper. - Modified the task update listener to dispatch a proper state effect via dispatchTaskUpdate, passing along the task path received from the event. - This change ensures that the CodeMirror view correctly rebuilds decorations when a task update event occurs. • Clean up inline widget styles: - Removed outdated inline task preview and instant convert button styles from task-card-bem.css. - Created a new stylesheet (task-inline-widget.css) with BEM-named, scoped styles for inline task widgets. - The new stylesheet provides a clearer structure, improved responsiveness, and appropriate separation of concerns for inline widgets. This refactor modernizes the task link overlay update mechanism using CodeMirror’s state effects, simplifies the update flow in main.ts, and cleans up style management by migrating inline widget CSS to a dedicated file.
2025-06-10 11:01:07 +00:00
.tasknotes-plugin .task-inline-preview:hover .task-inline-preview__pencil {
opacity: 0.8;
}
Add clickable date fields with modals and UI enhancements in TaskLinkWidget This commit introduces several improvements to the inline task preview by making the due and scheduled date fields interactive. The main changes include: • In TaskLinkWidget.ts: - Enhanced the due date span element by appending an extra CSS class ("task-inline-preview__date--clickable") and updating its tooltip to indicate that the date is clickable. - Added an event listener on the due date span so that clicking it asynchronously imports and opens the DueDateModal. This makes it easier for users to modify the due date directly from the inline preview. - Similarly, updated the scheduled date span element with the clickable class and updated tooltip, and attached an event listener to asynchronously import and display the ScheduledDateModal when clicked. - Both click handlers prevent event propagation and default actions, ensuring a smooth user experience. • In task-inline-widget.css: - Introduced new styles for clickable date elements, including a pointer cursor, padding, border-radius, and smooth transitions. - Added hover effects for clickable date elements, such as increased opacity, background color change, and a slight upward translation, providing visual feedback when users interact with the dates. - Applied similar transition effects to icons and pencil elements for consistency across the widget UI. These changes improve the overall interactivity and user experience of task editing, allowing quick modifications to dates without leaving the current context.
2025-06-22 09:47:25 +00:00
.tasknotes-plugin .task-inline-preview__pencil:hover {
Refactor and clean up modal/dialog and UI components • Introduced two new modal classes (ConfirmationModal and StorageLocationConfirmationModal) in the “src/modals” folder that use Obsidian’s Modal API. These generic confirmation dialogs replace previously inline-created DOM modals for actions such as deleting statuses and priorities, and for confirming storage location changes. • Updated the settings code (src/settings/settings.ts) to use the new modal utilities. The inline modal creation and event handling logic was removed and replaced with calls to showConfirmationModal and showStorageLocationConfirmationModal. This simplifies the confirmation workflow, improves consistency, and reduces duplicate code. • Removed the old native implementation of a confirmation dialog for switching storage locations and also cleaned up legacy modal code. • Deleted the NativeMetadataCacheManager file from “src/utils”, as its functionality is no longer needed or has been replaced by more up-to-date implementations. • Revised the AdvancedCalendarView context menu logic in “src/views/AdvancedCalendarView.ts” to leverage Obsidian’s Menu API instead of manually constructing and managing DOM elements. This change results in a cleaner, more reliable context menu for ICS events. • Removed the entire components.css stylesheet, simplifying the style assets and reducing unused styles. • Made minor tweaks to task inline widget CSS for better specificity and consistency in hover and interactive states. Overall, this commit refactors modal/dialog management, removes legacy code, and refines UI component behavior for a cleaner and more maintainable code base.
2025-06-20 10:58:08 +00:00
opacity: 1;
Add clickable date fields with modals and UI enhancements in TaskLinkWidget This commit introduces several improvements to the inline task preview by making the due and scheduled date fields interactive. The main changes include: • In TaskLinkWidget.ts: - Enhanced the due date span element by appending an extra CSS class ("task-inline-preview__date--clickable") and updating its tooltip to indicate that the date is clickable. - Added an event listener on the due date span so that clicking it asynchronously imports and opens the DueDateModal. This makes it easier for users to modify the due date directly from the inline preview. - Similarly, updated the scheduled date span element with the clickable class and updated tooltip, and attached an event listener to asynchronously import and display the ScheduledDateModal when clicked. - Both click handlers prevent event propagation and default actions, ensuring a smooth user experience. • In task-inline-widget.css: - Introduced new styles for clickable date elements, including a pointer cursor, padding, border-radius, and smooth transitions. - Added hover effects for clickable date elements, such as increased opacity, background color change, and a slight upward translation, providing visual feedback when users interact with the dates. - Applied similar transition effects to icons and pencil elements for consistency across the widget UI. These changes improve the overall interactivity and user experience of task editing, allowing quick modifications to dates without leaving the current context.
2025-06-22 09:47:25 +00:00
transform: translateY(-1px);
filter: brightness(1.3);
Refactor task update handling & cleanup inline widget styles • Introduce a new CodeMirror state effect for task updates in TaskLinkOverlay.ts: - Added the taskUpdateEffect to signal task updates. - Updated decoration rebuild logic to check for the new state effect instead of relying on a refreshController. - Modified the widget cache logic to clear active widgets when a task update effect is detected. - Removed the now-unused refreshController from the createTaskLinkField function. • Enhance global task update dispatching in main.ts: - Updated the import to include the new dispatchTaskUpdate helper. - Modified the task update listener to dispatch a proper state effect via dispatchTaskUpdate, passing along the task path received from the event. - This change ensures that the CodeMirror view correctly rebuilds decorations when a task update event occurs. • Clean up inline widget styles: - Removed outdated inline task preview and instant convert button styles from task-card-bem.css. - Created a new stylesheet (task-inline-widget.css) with BEM-named, scoped styles for inline task widgets. - The new stylesheet provides a clearer structure, improved responsiveness, and appropriate separation of concerns for inline widgets. This refactor modernizes the task link overlay update mechanism using CodeMirror’s state effects, simplifies the update flow in main.ts, and cleans up style management by migrating inline widget CSS to a dedicated file.
2025-06-10 11:01:07 +00:00
}
/* Hover state */
.tasknotes-plugin .task-inline-preview:hover {
background-color: var(--background-modifier-hover);
}
/* Completed task styling with maximum specificity */
Refactor event listeners, modals, and styles to improve consistency and maintainability • Remove workspace layout check in the EVENT_TASK_UPDATED handler (src/main.ts) so that editor decorations refresh regardless of app.workspace.layoutReady. • Introduce two new modal components:   – ICSEventInfoModal (src/modals/ICSEventInfoModal.ts): Displays detailed calendar event information including title, date/time, description, location, URL, and optional source.   – TimeblockInfoModal (src/modals/TimeblockInfoModal.ts): Displays detailed timeblock information with title, time range, description, and attachments. • Update TimeblockCreationModal (src/modals/TimeblockCreationModal.ts):   – Adjust UI labels and placeholders (e.g., “Create timeblock”, “Deep work session”, “Start time”, “End time”) for consistent casing. • Modify AdvancedCalendarView (src/views/AdvancedCalendarView.ts):   – Replace manual DOM construction for modals with instantiation of the new ICSEventInfoModal and TimeblockInfoModal classes. • Revise styling in base.css and task-inline-widget.css:   – Rename keyframes from “task-flash”, “task-pulse”, and “task-fade-in” to “tn-task-flash”, “tn-task-pulse”, and “tn-task-fade-in” to namespace animations under the plugin.   – Update CSS selectors to scope styles properly under .tasknotes-plugin. • Remove legacy BEM compatibility classes from modal-bem.css to phase out temporary support for old form-group and related classes. These changes enhance code readability, promote reuse of modal components, and align the UI styling with the plugin’s namespace for a cleaner, more maintainable codebase.
2025-06-20 11:35:41 +00:00
.tasknotes-plugin span.task-inline-preview.task-inline-preview--completed span.task-inline-preview__title,
.tasknotes-plugin.task-inline-preview.task-inline-preview--completed .task-inline-preview__title,
.tasknotes-plugin .task-inline-preview--completed .task-inline-preview__title {
Refactor and clean up modal/dialog and UI components • Introduced two new modal classes (ConfirmationModal and StorageLocationConfirmationModal) in the “src/modals” folder that use Obsidian’s Modal API. These generic confirmation dialogs replace previously inline-created DOM modals for actions such as deleting statuses and priorities, and for confirming storage location changes. • Updated the settings code (src/settings/settings.ts) to use the new modal utilities. The inline modal creation and event handling logic was removed and replaced with calls to showConfirmationModal and showStorageLocationConfirmationModal. This simplifies the confirmation workflow, improves consistency, and reduces duplicate code. • Removed the old native implementation of a confirmation dialog for switching storage locations and also cleaned up legacy modal code. • Deleted the NativeMetadataCacheManager file from “src/utils”, as its functionality is no longer needed or has been replaced by more up-to-date implementations. • Revised the AdvancedCalendarView context menu logic in “src/views/AdvancedCalendarView.ts” to leverage Obsidian’s Menu API instead of manually constructing and managing DOM elements. This change results in a cleaner, more reliable context menu for ICS events. • Removed the entire components.css stylesheet, simplifying the style assets and reducing unused styles. • Made minor tweaks to task inline widget CSS for better specificity and consistency in hover and interactive states. Overall, this commit refactors modal/dialog management, removes legacy code, and refines UI component behavior for a cleaner and more maintainable code base.
2025-06-20 10:58:08 +00:00
text-decoration: line-through;
opacity: 0.7;
color: var(--text-muted);
Refactor task update handling & cleanup inline widget styles • Introduce a new CodeMirror state effect for task updates in TaskLinkOverlay.ts: - Added the taskUpdateEffect to signal task updates. - Updated decoration rebuild logic to check for the new state effect instead of relying on a refreshController. - Modified the widget cache logic to clear active widgets when a task update effect is detected. - Removed the now-unused refreshController from the createTaskLinkField function. • Enhance global task update dispatching in main.ts: - Updated the import to include the new dispatchTaskUpdate helper. - Modified the task update listener to dispatch a proper state effect via dispatchTaskUpdate, passing along the task path received from the event. - This change ensures that the CodeMirror view correctly rebuilds decorations when a task update event occurs. • Clean up inline widget styles: - Removed outdated inline task preview and instant convert button styles from task-card-bem.css. - Created a new stylesheet (task-inline-widget.css) with BEM-named, scoped styles for inline task widgets. - The new stylesheet provides a clearer structure, improved responsiveness, and appropriate separation of concerns for inline widgets. This refactor modernizes the task link overlay update mechanism using CodeMirror’s state effects, simplifies the update flow in main.ts, and cleans up style management by migrating inline widget CSS to a dedicated file.
2025-06-10 11:01:07 +00:00
}
Change task-related icons and update CSS styling for improved UI clarity and interactivity. • Update icon usage: - In TaskLinkWidget.ts and TaskCard.ts, replace the default "pencil" icon with Obsidian’s built-in "ellipsis-vertical" icon. (#80) - This change clarifies that the icon now represents a menu/options action rather than a direct edit. • Adjust task card styling: - In task-card-bem.css, modify the top position of the recurring-indicator from 6px to 8px for better vertical alignment. • Refine task inline widget styles: - In task-inline-widget.css, set the opacity of the pencil icon from 0.4 to 0, effectively hiding it since it’s no longer used for editing. - Add a hover effect for completed task titles, enhancing visual feedback by changing the text color and opacity. - Enhance the hover style for task titles by adding a pointer cursor, transition effect, slight padding, and a border-radius to improve the interactive appearance. These adjustments aim to streamline the UI elements and provide clearer interactive cues for users.
2025-06-29 00:52:37 +00:00
/* Completed task title hover effect */
.tasknotes-plugin .task-inline-preview--completed .task-inline-preview__title:hover {
color: var(--interactive-accent);
opacity: 0.9;
}
Refactor event listeners, modals, and styles to improve consistency and maintainability • Remove workspace layout check in the EVENT_TASK_UPDATED handler (src/main.ts) so that editor decorations refresh regardless of app.workspace.layoutReady. • Introduce two new modal components:   – ICSEventInfoModal (src/modals/ICSEventInfoModal.ts): Displays detailed calendar event information including title, date/time, description, location, URL, and optional source.   – TimeblockInfoModal (src/modals/TimeblockInfoModal.ts): Displays detailed timeblock information with title, time range, description, and attachments. • Update TimeblockCreationModal (src/modals/TimeblockCreationModal.ts):   – Adjust UI labels and placeholders (e.g., “Create timeblock”, “Deep work session”, “Start time”, “End time”) for consistent casing. • Modify AdvancedCalendarView (src/views/AdvancedCalendarView.ts):   – Replace manual DOM construction for modals with instantiation of the new ICSEventInfoModal and TimeblockInfoModal classes. • Revise styling in base.css and task-inline-widget.css:   – Rename keyframes from “task-flash”, “task-pulse”, and “task-fade-in” to “tn-task-flash”, “tn-task-pulse”, and “tn-task-fade-in” to namespace animations under the plugin.   – Update CSS selectors to scope styles properly under .tasknotes-plugin. • Remove legacy BEM compatibility classes from modal-bem.css to phase out temporary support for old form-group and related classes. These changes enhance code readability, promote reuse of modal components, and align the UI styling with the plugin’s namespace for a cleaner, more maintainable codebase.
2025-06-20 11:35:41 +00:00
.tasknotes-plugin span.task-inline-preview.task-inline-preview--completed,
.tasknotes-plugin.task-inline-preview.task-inline-preview--completed,
.tasknotes-plugin .task-inline-preview--completed {
Refactor and clean up modal/dialog and UI components • Introduced two new modal classes (ConfirmationModal and StorageLocationConfirmationModal) in the “src/modals” folder that use Obsidian’s Modal API. These generic confirmation dialogs replace previously inline-created DOM modals for actions such as deleting statuses and priorities, and for confirming storage location changes. • Updated the settings code (src/settings/settings.ts) to use the new modal utilities. The inline modal creation and event handling logic was removed and replaced with calls to showConfirmationModal and showStorageLocationConfirmationModal. This simplifies the confirmation workflow, improves consistency, and reduces duplicate code. • Removed the old native implementation of a confirmation dialog for switching storage locations and also cleaned up legacy modal code. • Deleted the NativeMetadataCacheManager file from “src/utils”, as its functionality is no longer needed or has been replaced by more up-to-date implementations. • Revised the AdvancedCalendarView context menu logic in “src/views/AdvancedCalendarView.ts” to leverage Obsidian’s Menu API instead of manually constructing and managing DOM elements. This change results in a cleaner, more reliable context menu for ICS events. • Removed the entire components.css stylesheet, simplifying the style assets and reducing unused styles. • Made minor tweaks to task inline widget CSS for better specificity and consistency in hover and interactive states. Overall, this commit refactors modal/dialog management, removes legacy code, and refines UI component behavior for a cleaner and more maintainable code base.
2025-06-20 10:58:08 +00:00
opacity: 0.8;
Refactor task update handling & cleanup inline widget styles • Introduce a new CodeMirror state effect for task updates in TaskLinkOverlay.ts: - Added the taskUpdateEffect to signal task updates. - Updated decoration rebuild logic to check for the new state effect instead of relying on a refreshController. - Modified the widget cache logic to clear active widgets when a task update effect is detected. - Removed the now-unused refreshController from the createTaskLinkField function. • Enhance global task update dispatching in main.ts: - Updated the import to include the new dispatchTaskUpdate helper. - Modified the task update listener to dispatch a proper state effect via dispatchTaskUpdate, passing along the task path received from the event. - This change ensures that the CodeMirror view correctly rebuilds decorations when a task update event occurs. • Clean up inline widget styles: - Removed outdated inline task preview and instant convert button styles from task-card-bem.css. - Created a new stylesheet (task-inline-widget.css) with BEM-named, scoped styles for inline task widgets. - The new stylesheet provides a clearer structure, improved responsiveness, and appropriate separation of concerns for inline widgets. This refactor modernizes the task link overlay update mechanism using CodeMirror’s state effects, simplifies the update flow in main.ts, and cleans up style management by migrating inline widget CSS to a dedicated file.
2025-06-10 11:01:07 +00:00
}
/* =================================================================
INSTANT CONVERT BUTTON STYLES
================================================================= */
Refactor and clean up modal/dialog and UI components • Introduced two new modal classes (ConfirmationModal and StorageLocationConfirmationModal) in the “src/modals” folder that use Obsidian’s Modal API. These generic confirmation dialogs replace previously inline-created DOM modals for actions such as deleting statuses and priorities, and for confirming storage location changes. • Updated the settings code (src/settings/settings.ts) to use the new modal utilities. The inline modal creation and event handling logic was removed and replaced with calls to showConfirmationModal and showStorageLocationConfirmationModal. This simplifies the confirmation workflow, improves consistency, and reduces duplicate code. • Removed the old native implementation of a confirmation dialog for switching storage locations and also cleaned up legacy modal code. • Deleted the NativeMetadataCacheManager file from “src/utils”, as its functionality is no longer needed or has been replaced by more up-to-date implementations. • Revised the AdvancedCalendarView context menu logic in “src/views/AdvancedCalendarView.ts” to leverage Obsidian’s Menu API instead of manually constructing and managing DOM elements. This change results in a cleaner, more reliable context menu for ICS events. • Removed the entire components.css stylesheet, simplifying the style assets and reducing unused styles. • Made minor tweaks to task inline widget CSS for better specificity and consistency in hover and interactive states. Overall, this commit refactors modal/dialog management, removes legacy code, and refines UI component behavior for a cleaner and more maintainable code base.
2025-06-20 10:58:08 +00:00
/* Convert button for checkbox tasks - High specificity to override browser defaults */
Refactor event listeners, modals, and styles to improve consistency and maintainability • Remove workspace layout check in the EVENT_TASK_UPDATED handler (src/main.ts) so that editor decorations refresh regardless of app.workspace.layoutReady. • Introduce two new modal components:   – ICSEventInfoModal (src/modals/ICSEventInfoModal.ts): Displays detailed calendar event information including title, date/time, description, location, URL, and optional source.   – TimeblockInfoModal (src/modals/TimeblockInfoModal.ts): Displays detailed timeblock information with title, time range, description, and attachments. • Update TimeblockCreationModal (src/modals/TimeblockCreationModal.ts):   – Adjust UI labels and placeholders (e.g., “Create timeblock”, “Deep work session”, “Start time”, “End time”) for consistent casing. • Modify AdvancedCalendarView (src/views/AdvancedCalendarView.ts):   – Replace manual DOM construction for modals with instantiation of the new ICSEventInfoModal and TimeblockInfoModal classes. • Revise styling in base.css and task-inline-widget.css:   – Rename keyframes from “task-flash”, “task-pulse”, and “task-fade-in” to “tn-task-flash”, “tn-task-pulse”, and “tn-task-fade-in” to namespace animations under the plugin.   – Update CSS selectors to scope styles properly under .tasknotes-plugin. • Remove legacy BEM compatibility classes from modal-bem.css to phase out temporary support for old form-group and related classes. These changes enhance code readability, promote reuse of modal components, and align the UI styling with the plugin’s namespace for a cleaner, more maintainable codebase.
2025-06-20 11:35:41 +00:00
.tasknotes-plugin button.instant-convert-button {
Refactor task update handling & cleanup inline widget styles • Introduce a new CodeMirror state effect for task updates in TaskLinkOverlay.ts: - Added the taskUpdateEffect to signal task updates. - Updated decoration rebuild logic to check for the new state effect instead of relying on a refreshController. - Modified the widget cache logic to clear active widgets when a task update effect is detected. - Removed the now-unused refreshController from the createTaskLinkField function. • Enhance global task update dispatching in main.ts: - Updated the import to include the new dispatchTaskUpdate helper. - Modified the task update listener to dispatch a proper state effect via dispatchTaskUpdate, passing along the task path received from the event. - This change ensures that the CodeMirror view correctly rebuilds decorations when a task update event occurs. • Clean up inline widget styles: - Removed outdated inline task preview and instant convert button styles from task-card-bem.css. - Created a new stylesheet (task-inline-widget.css) with BEM-named, scoped styles for inline task widgets. - The new stylesheet provides a clearer structure, improved responsiveness, and appropriate separation of concerns for inline widgets. This refactor modernizes the task link overlay update mechanism using CodeMirror’s state effects, simplifies the update flow in main.ts, and cleans up style management by migrating inline widget CSS to a dedicated file.
2025-06-10 11:01:07 +00:00
/* Layout */
Refactor and clean up modal/dialog and UI components • Introduced two new modal classes (ConfirmationModal and StorageLocationConfirmationModal) in the “src/modals” folder that use Obsidian’s Modal API. These generic confirmation dialogs replace previously inline-created DOM modals for actions such as deleting statuses and priorities, and for confirming storage location changes. • Updated the settings code (src/settings/settings.ts) to use the new modal utilities. The inline modal creation and event handling logic was removed and replaced with calls to showConfirmationModal and showStorageLocationConfirmationModal. This simplifies the confirmation workflow, improves consistency, and reduces duplicate code. • Removed the old native implementation of a confirmation dialog for switching storage locations and also cleaned up legacy modal code. • Deleted the NativeMetadataCacheManager file from “src/utils”, as its functionality is no longer needed or has been replaced by more up-to-date implementations. • Revised the AdvancedCalendarView context menu logic in “src/views/AdvancedCalendarView.ts” to leverage Obsidian’s Menu API instead of manually constructing and managing DOM elements. This change results in a cleaner, more reliable context menu for ICS events. • Removed the entire components.css stylesheet, simplifying the style assets and reducing unused styles. • Made minor tweaks to task inline widget CSS for better specificity and consistency in hover and interactive states. Overall, this commit refactors modal/dialog management, removes legacy code, and refines UI component behavior for a cleaner and more maintainable code base.
2025-06-20 10:58:08 +00:00
display: inline-flex;
align-items: center;
justify-content: center;
Refactor task update handling & cleanup inline widget styles • Introduce a new CodeMirror state effect for task updates in TaskLinkOverlay.ts: - Added the taskUpdateEffect to signal task updates. - Updated decoration rebuild logic to check for the new state effect instead of relying on a refreshController. - Modified the widget cache logic to clear active widgets when a task update effect is detected. - Removed the now-unused refreshController from the createTaskLinkField function. • Enhance global task update dispatching in main.ts: - Updated the import to include the new dispatchTaskUpdate helper. - Modified the task update listener to dispatch a proper state effect via dispatchTaskUpdate, passing along the task path received from the event. - This change ensures that the CodeMirror view correctly rebuilds decorations when a task update event occurs. • Clean up inline widget styles: - Removed outdated inline task preview and instant convert button styles from task-card-bem.css. - Created a new stylesheet (task-inline-widget.css) with BEM-named, scoped styles for inline task widgets. - The new stylesheet provides a clearer structure, improved responsiveness, and appropriate separation of concerns for inline widgets. This refactor modernizes the task link overlay update mechanism using CodeMirror’s state effects, simplifies the update flow in main.ts, and cleans up style management by migrating inline widget CSS to a dedicated file.
2025-06-10 11:01:07 +00:00
/* Sizing */
Refactor and clean up modal/dialog and UI components • Introduced two new modal classes (ConfirmationModal and StorageLocationConfirmationModal) in the “src/modals” folder that use Obsidian’s Modal API. These generic confirmation dialogs replace previously inline-created DOM modals for actions such as deleting statuses and priorities, and for confirming storage location changes. • Updated the settings code (src/settings/settings.ts) to use the new modal utilities. The inline modal creation and event handling logic was removed and replaced with calls to showConfirmationModal and showStorageLocationConfirmationModal. This simplifies the confirmation workflow, improves consistency, and reduces duplicate code. • Removed the old native implementation of a confirmation dialog for switching storage locations and also cleaned up legacy modal code. • Deleted the NativeMetadataCacheManager file from “src/utils”, as its functionality is no longer needed or has been replaced by more up-to-date implementations. • Revised the AdvancedCalendarView context menu logic in “src/views/AdvancedCalendarView.ts” to leverage Obsidian’s Menu API instead of manually constructing and managing DOM elements. This change results in a cleaner, more reliable context menu for ICS events. • Removed the entire components.css stylesheet, simplifying the style assets and reducing unused styles. • Made minor tweaks to task inline widget CSS for better specificity and consistency in hover and interactive states. Overall, this commit refactors modal/dialog management, removes legacy code, and refines UI component behavior for a cleaner and more maintainable code base.
2025-06-20 10:58:08 +00:00
width: 15px;
height: 15px;
margin-left: 8px;
padding: 0;
Refactor task update handling & cleanup inline widget styles • Introduce a new CodeMirror state effect for task updates in TaskLinkOverlay.ts: - Added the taskUpdateEffect to signal task updates. - Updated decoration rebuild logic to check for the new state effect instead of relying on a refreshController. - Modified the widget cache logic to clear active widgets when a task update effect is detected. - Removed the now-unused refreshController from the createTaskLinkField function. • Enhance global task update dispatching in main.ts: - Updated the import to include the new dispatchTaskUpdate helper. - Modified the task update listener to dispatch a proper state effect via dispatchTaskUpdate, passing along the task path received from the event. - This change ensures that the CodeMirror view correctly rebuilds decorations when a task update event occurs. • Clean up inline widget styles: - Removed outdated inline task preview and instant convert button styles from task-card-bem.css. - Created a new stylesheet (task-inline-widget.css) with BEM-named, scoped styles for inline task widgets. - The new stylesheet provides a clearer structure, improved responsiveness, and appropriate separation of concerns for inline widgets. This refactor modernizes the task link overlay update mechanism using CodeMirror’s state effects, simplifies the update flow in main.ts, and cleans up style management by migrating inline widget CSS to a dedicated file.
2025-06-10 11:01:07 +00:00
/* Visual styling */
Refactor and clean up modal/dialog and UI components • Introduced two new modal classes (ConfirmationModal and StorageLocationConfirmationModal) in the “src/modals” folder that use Obsidian’s Modal API. These generic confirmation dialogs replace previously inline-created DOM modals for actions such as deleting statuses and priorities, and for confirming storage location changes. • Updated the settings code (src/settings/settings.ts) to use the new modal utilities. The inline modal creation and event handling logic was removed and replaced with calls to showConfirmationModal and showStorageLocationConfirmationModal. This simplifies the confirmation workflow, improves consistency, and reduces duplicate code. • Removed the old native implementation of a confirmation dialog for switching storage locations and also cleaned up legacy modal code. • Deleted the NativeMetadataCacheManager file from “src/utils”, as its functionality is no longer needed or has been replaced by more up-to-date implementations. • Revised the AdvancedCalendarView context menu logic in “src/views/AdvancedCalendarView.ts” to leverage Obsidian’s Menu API instead of manually constructing and managing DOM elements. This change results in a cleaner, more reliable context menu for ICS events. • Removed the entire components.css stylesheet, simplifying the style assets and reducing unused styles. • Made minor tweaks to task inline widget CSS for better specificity and consistency in hover and interactive states. Overall, this commit refactors modal/dialog management, removes legacy code, and refines UI component behavior for a cleaner and more maintainable code base.
2025-06-20 10:58:08 +00:00
background: transparent;
color: var(--text-muted);
Clean up CSS lint issues
2026-05-14 11:06:30 +00:00
border: none;
fix: Remove borders and movement from UI buttons - Remove borders from saved view buttons in filter bar - Remove border from save button (floppy disk icon) in filter builder - Remove border from task instant convert icon - Remove hover scale animation from instant convert button - Add explicit border removal with \!important for better specificity
2025-07-20 09:02:01 +00:00
box-shadow: none;
Refactor and clean up modal/dialog and UI components • Introduced two new modal classes (ConfirmationModal and StorageLocationConfirmationModal) in the “src/modals” folder that use Obsidian’s Modal API. These generic confirmation dialogs replace previously inline-created DOM modals for actions such as deleting statuses and priorities, and for confirming storage location changes. • Updated the settings code (src/settings/settings.ts) to use the new modal utilities. The inline modal creation and event handling logic was removed and replaced with calls to showConfirmationModal and showStorageLocationConfirmationModal. This simplifies the confirmation workflow, improves consistency, and reduces duplicate code. • Removed the old native implementation of a confirmation dialog for switching storage locations and also cleaned up legacy modal code. • Deleted the NativeMetadataCacheManager file from “src/utils”, as its functionality is no longer needed or has been replaced by more up-to-date implementations. • Revised the AdvancedCalendarView context menu logic in “src/views/AdvancedCalendarView.ts” to leverage Obsidian’s Menu API instead of manually constructing and managing DOM elements. This change results in a cleaner, more reliable context menu for ICS events. • Removed the entire components.css stylesheet, simplifying the style assets and reducing unused styles. • Made minor tweaks to task inline widget CSS for better specificity and consistency in hover and interactive states. Overall, this commit refactors modal/dialog management, removes legacy code, and refines UI component behavior for a cleaner and more maintainable code base.
2025-06-20 10:58:08 +00:00
border-radius: 3px;
Refactor task update handling & cleanup inline widget styles • Introduce a new CodeMirror state effect for task updates in TaskLinkOverlay.ts: - Added the taskUpdateEffect to signal task updates. - Updated decoration rebuild logic to check for the new state effect instead of relying on a refreshController. - Modified the widget cache logic to clear active widgets when a task update effect is detected. - Removed the now-unused refreshController from the createTaskLinkField function. • Enhance global task update dispatching in main.ts: - Updated the import to include the new dispatchTaskUpdate helper. - Modified the task update listener to dispatch a proper state effect via dispatchTaskUpdate, passing along the task path received from the event. - This change ensures that the CodeMirror view correctly rebuilds decorations when a task update event occurs. • Clean up inline widget styles: - Removed outdated inline task preview and instant convert button styles from task-card-bem.css. - Created a new stylesheet (task-inline-widget.css) with BEM-named, scoped styles for inline task widgets. - The new stylesheet provides a clearer structure, improved responsiveness, and appropriate separation of concerns for inline widgets. This refactor modernizes the task link overlay update mechanism using CodeMirror’s state effects, simplifies the update flow in main.ts, and cleans up style management by migrating inline widget CSS to a dedicated file.
2025-06-10 11:01:07 +00:00
/* Interactivity */
fix: restore pointer cursor fallback on interactive elements (#1470)
2026-02-08 08:05:31 +00:00
cursor: var(--cursor, pointer);
Refactor and clean up modal/dialog and UI components • Introduced two new modal classes (ConfirmationModal and StorageLocationConfirmationModal) in the “src/modals” folder that use Obsidian’s Modal API. These generic confirmation dialogs replace previously inline-created DOM modals for actions such as deleting statuses and priorities, and for confirming storage location changes. • Updated the settings code (src/settings/settings.ts) to use the new modal utilities. The inline modal creation and event handling logic was removed and replaced with calls to showConfirmationModal and showStorageLocationConfirmationModal. This simplifies the confirmation workflow, improves consistency, and reduces duplicate code. • Removed the old native implementation of a confirmation dialog for switching storage locations and also cleaned up legacy modal code. • Deleted the NativeMetadataCacheManager file from “src/utils”, as its functionality is no longer needed or has been replaced by more up-to-date implementations. • Revised the AdvancedCalendarView context menu logic in “src/views/AdvancedCalendarView.ts” to leverage Obsidian’s Menu API instead of manually constructing and managing DOM elements. This change results in a cleaner, more reliable context menu for ICS events. • Removed the entire components.css stylesheet, simplifying the style assets and reducing unused styles. • Made minor tweaks to task inline widget CSS for better specificity and consistency in hover and interactive states. Overall, this commit refactors modal/dialog management, removes legacy code, and refines UI component behavior for a cleaner and more maintainable code base.
2025-06-20 10:58:08 +00:00
opacity: 0.6;
transition: all 0.15s ease;
Refactor task update handling & cleanup inline widget styles • Introduce a new CodeMirror state effect for task updates in TaskLinkOverlay.ts: - Added the taskUpdateEffect to signal task updates. - Updated decoration rebuild logic to check for the new state effect instead of relying on a refreshController. - Modified the widget cache logic to clear active widgets when a task update effect is detected. - Removed the now-unused refreshController from the createTaskLinkField function. • Enhance global task update dispatching in main.ts: - Updated the import to include the new dispatchTaskUpdate helper. - Modified the task update listener to dispatch a proper state effect via dispatchTaskUpdate, passing along the task path received from the event. - This change ensures that the CodeMirror view correctly rebuilds decorations when a task update event occurs. • Clean up inline widget styles: - Removed outdated inline task preview and instant convert button styles from task-card-bem.css. - Created a new stylesheet (task-inline-widget.css) with BEM-named, scoped styles for inline task widgets. - The new stylesheet provides a clearer structure, improved responsiveness, and appropriate separation of concerns for inline widgets. This refactor modernizes the task link overlay update mechanism using CodeMirror’s state effects, simplifies the update flow in main.ts, and cleans up style management by migrating inline widget CSS to a dedicated file.
2025-06-10 11:01:07 +00:00
/* Reset button styles */
Refactor and clean up modal/dialog and UI components • Introduced two new modal classes (ConfirmationModal and StorageLocationConfirmationModal) in the “src/modals” folder that use Obsidian’s Modal API. These generic confirmation dialogs replace previously inline-created DOM modals for actions such as deleting statuses and priorities, and for confirming storage location changes. • Updated the settings code (src/settings/settings.ts) to use the new modal utilities. The inline modal creation and event handling logic was removed and replaced with calls to showConfirmationModal and showStorageLocationConfirmationModal. This simplifies the confirmation workflow, improves consistency, and reduces duplicate code. • Removed the old native implementation of a confirmation dialog for switching storage locations and also cleaned up legacy modal code. • Deleted the NativeMetadataCacheManager file from “src/utils”, as its functionality is no longer needed or has been replaced by more up-to-date implementations. • Revised the AdvancedCalendarView context menu logic in “src/views/AdvancedCalendarView.ts” to leverage Obsidian’s Menu API instead of manually constructing and managing DOM elements. This change results in a cleaner, more reliable context menu for ICS events. • Removed the entire components.css stylesheet, simplifying the style assets and reducing unused styles. • Made minor tweaks to task inline widget CSS for better specificity and consistency in hover and interactive states. Overall, this commit refactors modal/dialog management, removes legacy code, and refines UI component behavior for a cleaner and more maintainable code base.
2025-06-20 10:58:08 +00:00
font-family: inherit;
font-size: inherit;
line-height: 1;
box-sizing: border-box;
outline: none;
text-decoration: none;
vertical-align: baseline;
Refactor task update handling & cleanup inline widget styles • Introduce a new CodeMirror state effect for task updates in TaskLinkOverlay.ts: - Added the taskUpdateEffect to signal task updates. - Updated decoration rebuild logic to check for the new state effect instead of relying on a refreshController. - Modified the widget cache logic to clear active widgets when a task update effect is detected. - Removed the now-unused refreshController from the createTaskLinkField function. • Enhance global task update dispatching in main.ts: - Updated the import to include the new dispatchTaskUpdate helper. - Modified the task update listener to dispatch a proper state effect via dispatchTaskUpdate, passing along the task path received from the event. - This change ensures that the CodeMirror view correctly rebuilds decorations when a task update event occurs. • Clean up inline widget styles: - Removed outdated inline task preview and instant convert button styles from task-card-bem.css. - Created a new stylesheet (task-inline-widget.css) with BEM-named, scoped styles for inline task widgets. - The new stylesheet provides a clearer structure, improved responsiveness, and appropriate separation of concerns for inline widgets. This refactor modernizes the task link overlay update mechanism using CodeMirror’s state effects, simplifies the update flow in main.ts, and cleans up style management by migrating inline widget CSS to a dedicated file.
2025-06-10 11:01:07 +00:00
}
Refactor event listeners, modals, and styles to improve consistency and maintainability • Remove workspace layout check in the EVENT_TASK_UPDATED handler (src/main.ts) so that editor decorations refresh regardless of app.workspace.layoutReady. • Introduce two new modal components:   – ICSEventInfoModal (src/modals/ICSEventInfoModal.ts): Displays detailed calendar event information including title, date/time, description, location, URL, and optional source.   – TimeblockInfoModal (src/modals/TimeblockInfoModal.ts): Displays detailed timeblock information with title, time range, description, and attachments. • Update TimeblockCreationModal (src/modals/TimeblockCreationModal.ts):   – Adjust UI labels and placeholders (e.g., “Create timeblock”, “Deep work session”, “Start time”, “End time”) for consistent casing. • Modify AdvancedCalendarView (src/views/AdvancedCalendarView.ts):   – Replace manual DOM construction for modals with instantiation of the new ICSEventInfoModal and TimeblockInfoModal classes. • Revise styling in base.css and task-inline-widget.css:   – Rename keyframes from “task-flash”, “task-pulse”, and “task-fade-in” to “tn-task-flash”, “tn-task-pulse”, and “tn-task-fade-in” to namespace animations under the plugin.   – Update CSS selectors to scope styles properly under .tasknotes-plugin. • Remove legacy BEM compatibility classes from modal-bem.css to phase out temporary support for old form-group and related classes. These changes enhance code readability, promote reuse of modal components, and align the UI styling with the plugin’s namespace for a cleaner, more maintainable codebase.
2025-06-20 11:35:41 +00:00
.tasknotes-plugin button.instant-convert-button:hover {
Refactor and clean up modal/dialog and UI components • Introduced two new modal classes (ConfirmationModal and StorageLocationConfirmationModal) in the “src/modals” folder that use Obsidian’s Modal API. These generic confirmation dialogs replace previously inline-created DOM modals for actions such as deleting statuses and priorities, and for confirming storage location changes. • Updated the settings code (src/settings/settings.ts) to use the new modal utilities. The inline modal creation and event handling logic was removed and replaced with calls to showConfirmationModal and showStorageLocationConfirmationModal. This simplifies the confirmation workflow, improves consistency, and reduces duplicate code. • Removed the old native implementation of a confirmation dialog for switching storage locations and also cleaned up legacy modal code. • Deleted the NativeMetadataCacheManager file from “src/utils”, as its functionality is no longer needed or has been replaced by more up-to-date implementations. • Revised the AdvancedCalendarView context menu logic in “src/views/AdvancedCalendarView.ts” to leverage Obsidian’s Menu API instead of manually constructing and managing DOM elements. This change results in a cleaner, more reliable context menu for ICS events. • Removed the entire components.css stylesheet, simplifying the style assets and reducing unused styles. • Made minor tweaks to task inline widget CSS for better specificity and consistency in hover and interactive states. Overall, this commit refactors modal/dialog management, removes legacy code, and refines UI component behavior for a cleaner and more maintainable code base.
2025-06-20 10:58:08 +00:00
background: var(--interactive-accent);
color: var(--text-on-accent);
opacity: 1;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
Refactor task update handling & cleanup inline widget styles • Introduce a new CodeMirror state effect for task updates in TaskLinkOverlay.ts: - Added the taskUpdateEffect to signal task updates. - Updated decoration rebuild logic to check for the new state effect instead of relying on a refreshController. - Modified the widget cache logic to clear active widgets when a task update effect is detected. - Removed the now-unused refreshController from the createTaskLinkField function. • Enhance global task update dispatching in main.ts: - Updated the import to include the new dispatchTaskUpdate helper. - Modified the task update listener to dispatch a proper state effect via dispatchTaskUpdate, passing along the task path received from the event. - This change ensures that the CodeMirror view correctly rebuilds decorations when a task update event occurs. • Clean up inline widget styles: - Removed outdated inline task preview and instant convert button styles from task-card-bem.css. - Created a new stylesheet (task-inline-widget.css) with BEM-named, scoped styles for inline task widgets. - The new stylesheet provides a clearer structure, improved responsiveness, and appropriate separation of concerns for inline widgets. This refactor modernizes the task link overlay update mechanism using CodeMirror’s state effects, simplifies the update flow in main.ts, and cleans up style management by migrating inline widget CSS to a dedicated file.
2025-06-10 11:01:07 +00:00
}
Refactor event listeners, modals, and styles to improve consistency and maintainability • Remove workspace layout check in the EVENT_TASK_UPDATED handler (src/main.ts) so that editor decorations refresh regardless of app.workspace.layoutReady. • Introduce two new modal components:   – ICSEventInfoModal (src/modals/ICSEventInfoModal.ts): Displays detailed calendar event information including title, date/time, description, location, URL, and optional source.   – TimeblockInfoModal (src/modals/TimeblockInfoModal.ts): Displays detailed timeblock information with title, time range, description, and attachments. • Update TimeblockCreationModal (src/modals/TimeblockCreationModal.ts):   – Adjust UI labels and placeholders (e.g., “Create timeblock”, “Deep work session”, “Start time”, “End time”) for consistent casing. • Modify AdvancedCalendarView (src/views/AdvancedCalendarView.ts):   – Replace manual DOM construction for modals with instantiation of the new ICSEventInfoModal and TimeblockInfoModal classes. • Revise styling in base.css and task-inline-widget.css:   – Rename keyframes from “task-flash”, “task-pulse”, and “task-fade-in” to “tn-task-flash”, “tn-task-pulse”, and “tn-task-fade-in” to namespace animations under the plugin.   – Update CSS selectors to scope styles properly under .tasknotes-plugin. • Remove legacy BEM compatibility classes from modal-bem.css to phase out temporary support for old form-group and related classes. These changes enhance code readability, promote reuse of modal components, and align the UI styling with the plugin’s namespace for a cleaner, more maintainable codebase.
2025-06-20 11:35:41 +00:00
.tasknotes-plugin button.instant-convert-button:active {
Refactor and clean up modal/dialog and UI components • Introduced two new modal classes (ConfirmationModal and StorageLocationConfirmationModal) in the “src/modals” folder that use Obsidian’s Modal API. These generic confirmation dialogs replace previously inline-created DOM modals for actions such as deleting statuses and priorities, and for confirming storage location changes. • Updated the settings code (src/settings/settings.ts) to use the new modal utilities. The inline modal creation and event handling logic was removed and replaced with calls to showConfirmationModal and showStorageLocationConfirmationModal. This simplifies the confirmation workflow, improves consistency, and reduces duplicate code. • Removed the old native implementation of a confirmation dialog for switching storage locations and also cleaned up legacy modal code. • Deleted the NativeMetadataCacheManager file from “src/utils”, as its functionality is no longer needed or has been replaced by more up-to-date implementations. • Revised the AdvancedCalendarView context menu logic in “src/views/AdvancedCalendarView.ts” to leverage Obsidian’s Menu API instead of manually constructing and managing DOM elements. This change results in a cleaner, more reliable context menu for ICS events. • Removed the entire components.css stylesheet, simplifying the style assets and reducing unused styles. • Made minor tweaks to task inline widget CSS for better specificity and consistency in hover and interactive states. Overall, this commit refactors modal/dialog management, removes legacy code, and refines UI component behavior for a cleaner and more maintainable code base.
2025-06-20 10:58:08 +00:00
transform: scale(0.95);
Refactor task update handling & cleanup inline widget styles • Introduce a new CodeMirror state effect for task updates in TaskLinkOverlay.ts: - Added the taskUpdateEffect to signal task updates. - Updated decoration rebuild logic to check for the new state effect instead of relying on a refreshController. - Modified the widget cache logic to clear active widgets when a task update effect is detected. - Removed the now-unused refreshController from the createTaskLinkField function. • Enhance global task update dispatching in main.ts: - Updated the import to include the new dispatchTaskUpdate helper. - Modified the task update listener to dispatch a proper state effect via dispatchTaskUpdate, passing along the task path received from the event. - This change ensures that the CodeMirror view correctly rebuilds decorations when a task update event occurs. • Clean up inline widget styles: - Removed outdated inline task preview and instant convert button styles from task-card-bem.css. - Created a new stylesheet (task-inline-widget.css) with BEM-named, scoped styles for inline task widgets. - The new stylesheet provides a clearer structure, improved responsiveness, and appropriate separation of concerns for inline widgets. This refactor modernizes the task link overlay update mechanism using CodeMirror’s state effects, simplifies the update flow in main.ts, and cleans up style management by migrating inline widget CSS to a dedicated file.
2025-06-10 11:01:07 +00:00
}
Refactor event listeners, modals, and styles to improve consistency and maintainability • Remove workspace layout check in the EVENT_TASK_UPDATED handler (src/main.ts) so that editor decorations refresh regardless of app.workspace.layoutReady. • Introduce two new modal components:   – ICSEventInfoModal (src/modals/ICSEventInfoModal.ts): Displays detailed calendar event information including title, date/time, description, location, URL, and optional source.   – TimeblockInfoModal (src/modals/TimeblockInfoModal.ts): Displays detailed timeblock information with title, time range, description, and attachments. • Update TimeblockCreationModal (src/modals/TimeblockCreationModal.ts):   – Adjust UI labels and placeholders (e.g., “Create timeblock”, “Deep work session”, “Start time”, “End time”) for consistent casing. • Modify AdvancedCalendarView (src/views/AdvancedCalendarView.ts):   – Replace manual DOM construction for modals with instantiation of the new ICSEventInfoModal and TimeblockInfoModal classes. • Revise styling in base.css and task-inline-widget.css:   – Rename keyframes from “task-flash”, “task-pulse”, and “task-fade-in” to “tn-task-flash”, “tn-task-pulse”, and “tn-task-fade-in” to namespace animations under the plugin.   – Update CSS selectors to scope styles properly under .tasknotes-plugin. • Remove legacy BEM compatibility classes from modal-bem.css to phase out temporary support for old form-group and related classes. These changes enhance code readability, promote reuse of modal components, and align the UI styling with the plugin’s namespace for a cleaner, more maintainable codebase.
2025-06-20 11:35:41 +00:00
.tasknotes-plugin button.instant-convert-button:focus {
Refactor and clean up modal/dialog and UI components • Introduced two new modal classes (ConfirmationModal and StorageLocationConfirmationModal) in the “src/modals” folder that use Obsidian’s Modal API. These generic confirmation dialogs replace previously inline-created DOM modals for actions such as deleting statuses and priorities, and for confirming storage location changes. • Updated the settings code (src/settings/settings.ts) to use the new modal utilities. The inline modal creation and event handling logic was removed and replaced with calls to showConfirmationModal and showStorageLocationConfirmationModal. This simplifies the confirmation workflow, improves consistency, and reduces duplicate code. • Removed the old native implementation of a confirmation dialog for switching storage locations and also cleaned up legacy modal code. • Deleted the NativeMetadataCacheManager file from “src/utils”, as its functionality is no longer needed or has been replaced by more up-to-date implementations. • Revised the AdvancedCalendarView context menu logic in “src/views/AdvancedCalendarView.ts” to leverage Obsidian’s Menu API instead of manually constructing and managing DOM elements. This change results in a cleaner, more reliable context menu for ICS events. • Removed the entire components.css stylesheet, simplifying the style assets and reducing unused styles. • Made minor tweaks to task inline widget CSS for better specificity and consistency in hover and interactive states. Overall, this commit refactors modal/dialog management, removes legacy code, and refines UI component behavior for a cleaner and more maintainable code base.
2025-06-20 10:58:08 +00:00
outline: 2px solid var(--interactive-accent);
outline-offset: 1px;
Refactor task update handling & cleanup inline widget styles • Introduce a new CodeMirror state effect for task updates in TaskLinkOverlay.ts: - Added the taskUpdateEffect to signal task updates. - Updated decoration rebuild logic to check for the new state effect instead of relying on a refreshController. - Modified the widget cache logic to clear active widgets when a task update effect is detected. - Removed the now-unused refreshController from the createTaskLinkField function. • Enhance global task update dispatching in main.ts: - Updated the import to include the new dispatchTaskUpdate helper. - Modified the task update listener to dispatch a proper state effect via dispatchTaskUpdate, passing along the task path received from the event. - This change ensures that the CodeMirror view correctly rebuilds decorations when a task update event occurs. • Clean up inline widget styles: - Removed outdated inline task preview and instant convert button styles from task-card-bem.css. - Created a new stylesheet (task-inline-widget.css) with BEM-named, scoped styles for inline task widgets. - The new stylesheet provides a clearer structure, improved responsiveness, and appropriate separation of concerns for inline widgets. This refactor modernizes the task link overlay update mechanism using CodeMirror’s state effects, simplifies the update flow in main.ts, and cleans up style management by migrating inline widget CSS to a dedicated file.
2025-06-10 11:01:07 +00:00
}
/* Icon inside the convert button */
.tasknotes-plugin .instant-convert-button__icon {
display: flex;
align-items: center;
justify-content: center;
width: 14px;
height: 14px;
}
.tasknotes-plugin .instant-convert-button__icon svg {
width: 12px;
height: 12px;
}
/* =================================================================
ADDITIONAL INLINE TASK PREVIEW ELEMENTS
================================================================= */
feat(ui): update inline and card task widgets with enhanced status cycling and Todoist-inspired styling • In TaskLinkWidget.ts: - Added an import for dispatchTaskUpdate from TaskLinkOverlay. - Moved the status indicator dot before the task title and updated its styling to use a border color instead of text color. - Introduced a click handler on the status dot to: • Retrieve the latest task information. • Cycle the task status using the plugin’s statusManager. • Update the UI immediately (status dot color and container’s completed state). • Dispatch a system-wide task update event after a short delay. - Reordered the priority indicator dot so it appears before the title. • In TaskCard.ts: - Updated the status and priority dot styling from using backgroundColor to setting borderColor to better match the new theme. - Added a click handler on the status dot to: • Distinguish between recurring tasks (toggle completion) and standard tasks (cycle status). • Refresh task data before updating status. • Provide error feedback via a Notice on failure. - Adjusted the logic for dynamically adding/removing/updating the priority dot on task cards. • In task-card-bem.css: - Revamped task card styling to reflect a Todoist minimal/compact design: • Adjusted padding, margins, background, and interactive states. • Styled focus states, drag-and-drop feedback (ghosts, drop zones, and dragging pulsing animation), and media queries for responsive/touch devices. • Updated status dots, priority indicators, and added improvements for accessibility and reduced motion. - Replaced older animations and shadows with simplified transitions and color mixes. • In task-inline-widget.css: - Revised inline widget styling to align status dot appearance with the task card (matching border, size, and hover effects). - Updated task title styling to improve spacing. - Amended the completed status styling to show a filled circle checkmark. This commit refines both the task inline widget and task card components for consistent interactions and modern visual design while improving accessibility and responsive behavior.
2025-06-22 08:12:10 +00:00
/* Completed status styling - filled circle with checkmark */
.tasknotes-plugin .task-inline-preview--completed .task-inline-preview__status-dot {
background-color: var(--current-status-color, var(--tn-color-success));
border-color: var(--current-status-color, var(--tn-color-success));
color: var(--tn-text-on-accent);
font-size: 9px;
font-weight: bold;
display: flex;
align-items: center;
justify-content: center;
Refactor task update handling & cleanup inline widget styles • Introduce a new CodeMirror state effect for task updates in TaskLinkOverlay.ts: - Added the taskUpdateEffect to signal task updates. - Updated decoration rebuild logic to check for the new state effect instead of relying on a refreshController. - Modified the widget cache logic to clear active widgets when a task update effect is detected. - Removed the now-unused refreshController from the createTaskLinkField function. • Enhance global task update dispatching in main.ts: - Updated the import to include the new dispatchTaskUpdate helper. - Modified the task update listener to dispatch a proper state effect via dispatchTaskUpdate, passing along the task path received from the event. - This change ensures that the CodeMirror view correctly rebuilds decorations when a task update event occurs. • Clean up inline widget styles: - Removed outdated inline task preview and instant convert button styles from task-card-bem.css. - Created a new stylesheet (task-inline-widget.css) with BEM-named, scoped styles for inline task widgets. - The new stylesheet provides a clearer structure, improved responsiveness, and appropriate separation of concerns for inline widgets. This refactor modernizes the task link overlay update mechanism using CodeMirror’s state effects, simplifies the update flow in main.ts, and cleans up style management by migrating inline widget CSS to a dedicated file.
2025-06-10 11:01:07 +00:00
}
/* Task title */
.tasknotes-plugin .task-inline-preview__title {
overflow: hidden;
text-overflow: ellipsis;
Fix: Increase max-width for inline task titles to prevent truncation (#1122) Inline task titles were being truncated too aggressively at 250-300px, cutting off normal-length task descriptions. This fix: - Increases max-width from 250-300px to responsive min(600px, 80vw) - Fixes white-space property from break-spaces to nowrap for proper ellipsis - Allows 2-3x more content to display before truncating - Maintains ellipsis as safety for extremely long titles - Works responsively on narrow screens (80vw) and wide screens (600px) Fixes #1122
2025-11-17 12:10:23 +00:00
white-space: nowrap;
Refactor task update handling & cleanup inline widget styles • Introduce a new CodeMirror state effect for task updates in TaskLinkOverlay.ts: - Added the taskUpdateEffect to signal task updates. - Updated decoration rebuild logic to check for the new state effect instead of relying on a refreshController. - Modified the widget cache logic to clear active widgets when a task update effect is detected. - Removed the now-unused refreshController from the createTaskLinkField function. • Enhance global task update dispatching in main.ts: - Updated the import to include the new dispatchTaskUpdate helper. - Modified the task update listener to dispatch a proper state effect via dispatchTaskUpdate, passing along the task path received from the event. - This change ensures that the CodeMirror view correctly rebuilds decorations when a task update event occurs. • Clean up inline widget styles: - Removed outdated inline task preview and instant convert button styles from task-card-bem.css. - Created a new stylesheet (task-inline-widget.css) with BEM-named, scoped styles for inline task widgets. - The new stylesheet provides a clearer structure, improved responsiveness, and appropriate separation of concerns for inline widgets. This refactor modernizes the task link overlay update mechanism using CodeMirror’s state effects, simplifies the update flow in main.ts, and cleans up style management by migrating inline widget CSS to a dedicated file.
2025-06-10 11:01:07 +00:00
color: var(--text-normal);
font-weight: 500;
min-width: 0; /* Allow flex shrinking */
Fix: Increase max-width for inline task titles to prevent truncation (#1122) Inline task titles were being truncated too aggressively at 250-300px, cutting off normal-length task descriptions. This fix: - Increases max-width from 250-300px to responsive min(600px, 80vw) - Fixes white-space property from break-spaces to nowrap for proper ellipsis - Allows 2-3x more content to display before truncating - Maintains ellipsis as safety for extremely long titles - Works responsively on narrow screens (80vw) and wide screens (600px) Fixes #1122
2025-11-17 12:10:23 +00:00
max-width: min(600px, 80vw); /* Responsive max-width for longer titles */
Improve inline task preview widget layout and spacing • Switch layout from "display: inline" to "inline-flex" for .task-inline-preview to ensure proper element alignment, adding align-items: center and a gap for consistent spacing. • Update padding and margin values across elements:   – Add padding (2px 4px) to .task-inline-preview for improved clickable area.   – Adjust spacing on status dot, date icon, and pencil icon by setting explicit margin and vertical-align values. • Remove redundant task title styles and consolidate text overflow rules:   – Reduce max-width from 300px to 250px and add flex-shrink/vertical-align settings for better cropping and responsiveness. • Tweak responsive design in media query and reading mode context:   – Modify padding and gap in media query for max-width adjustments.   – Ensure reading mode styling uses consistent gap and increased padding. These CSS updates enhance both the visual consistency and usability of the inline task preview widget.
2025-06-22 10:20:42 +00:00
flex-shrink: 1; /* Allow shrinking if needed */
Fix widget alignment
2025-06-29 02:25:52 +00:00
vertical-align: baseline;
fix: restore pointer cursor fallback on interactive elements (#1470)
2026-02-08 08:05:31 +00:00
cursor: var(--cursor, pointer);
Change task-related icons and update CSS styling for improved UI clarity and interactivity. • Update icon usage: - In TaskLinkWidget.ts and TaskCard.ts, replace the default "pencil" icon with Obsidian’s built-in "ellipsis-vertical" icon. (#80) - This change clarifies that the icon now represents a menu/options action rather than a direct edit. • Adjust task card styling: - In task-card-bem.css, modify the top position of the recurring-indicator from 6px to 8px for better vertical alignment. • Refine task inline widget styles: - In task-inline-widget.css, set the opacity of the pencil icon from 0.4 to 0, effectively hiding it since it’s no longer used for editing. - Add a hover effect for completed task titles, enhancing visual feedback by changing the text color and opacity. - Enhance the hover style for task titles by adding a pointer cursor, transition effect, slight padding, and a border-radius to improve the interactive appearance. These adjustments aim to streamline the UI elements and provide clearer interactive cues for users.
2025-06-29 00:52:37 +00:00
transition: color 0.15s ease;
border-radius: 2px;
padding: 1px 2px;
margin: -1px -2px;
}
/* Task title hover effect */
.tasknotes-plugin .task-inline-preview__title:hover {
color: var(--interactive-accent);
background-color: var(--background-modifier-hover);
Refactor task update handling & cleanup inline widget styles • Introduce a new CodeMirror state effect for task updates in TaskLinkOverlay.ts: - Added the taskUpdateEffect to signal task updates. - Updated decoration rebuild logic to check for the new state effect instead of relying on a refreshController. - Modified the widget cache logic to clear active widgets when a task update effect is detected. - Removed the now-unused refreshController from the createTaskLinkField function. • Enhance global task update dispatching in main.ts: - Updated the import to include the new dispatchTaskUpdate helper. - Modified the task update listener to dispatch a proper state effect via dispatchTaskUpdate, passing along the task path received from the event. - This change ensures that the CodeMirror view correctly rebuilds decorations when a task update event occurs. • Clean up inline widget styles: - Removed outdated inline task preview and instant convert button styles from task-card-bem.css. - Created a new stylesheet (task-inline-widget.css) with BEM-named, scoped styles for inline task widgets. - The new stylesheet provides a clearer structure, improved responsiveness, and appropriate separation of concerns for inline widgets. This refactor modernizes the task link overlay update mechanism using CodeMirror’s state effects, simplifies the update flow in main.ts, and cleans up style management by migrating inline widget CSS to a dedicated file.
2025-06-10 11:01:07 +00:00
}
/* Priority indicator */
.tasknotes-plugin .task-inline-preview__priority {
font-weight: bold;
font-size: 0.85em;
flex-shrink: 0;
margin-left: 3px;
margin-right: 1px;
}
Refactor Task Template Processing & Improve Link Generation & CSS Priority Styling (#37) • Removed body template processing from TaskCreationModal: - The applyBodyTemplate() call and its associated logic were removed from the modal. - The modal now simply pre-populates the textarea with any provided details, ensuring the user’s input is maintained without automatic template injection. • Moved template logic to TaskService: - Introduced a new private async method applyBodyTemplate() in TaskService. - This method now handles reading the template file (if enabled), processing it with task data (including the new “details” field), and returning the final content. - When creating a task file, the processed template content is appended to the file content instead of using raw user details. • Enhanced Template Variable Support: - Updated the helpers helper function processTaskTemplateVariables() to include a new replacement for {{details}}, allowing user-provided details to be inserted into templates. - Modified the settings help text to include an explanation for the new {{details}} variable and clarify that the template is applied using all final form values. • Improved Instant Task Link Generation: - Added checks in InstantTaskConvertService to detect if the sanitized title includes nested Obsidian links or problematic characters (|, #, ^). - If such characters are found, the generated link defaults to a simple link format (without an alias) to avoid nested link structures. • Updated CSS Styling for Task Cards & Inline Widgets: - In task-card-bem.css, updated comment to reflect that CSS variables for priority are now set dynamically by TaskCard.ts. - In task-inline-widget.css, adjusted status and priority dot styles: • Changed the status dot color variable fallback to a fixed color (#666). • Replaced the priority dot style with a priority border style using left border colors, using distinct widths for high (4px), medium (3px), and low priority tasks. Overall, these changes reposition the template functionality to be applied at task creation (rather than during modal pre-population), add better handling for nested links in instant task conversion, extend template variable support, and update styling for better visual cues.
2025-06-13 22:32:30 +00:00
/* Priority border colors */
.tasknotes-plugin .task-inline-preview.task-inline-preview--priority-high {
border-left-color: var(--color-red);
border-left-width: 4px;
Refactor task update handling & cleanup inline widget styles • Introduce a new CodeMirror state effect for task updates in TaskLinkOverlay.ts: - Added the taskUpdateEffect to signal task updates. - Updated decoration rebuild logic to check for the new state effect instead of relying on a refreshController. - Modified the widget cache logic to clear active widgets when a task update effect is detected. - Removed the now-unused refreshController from the createTaskLinkField function. • Enhance global task update dispatching in main.ts: - Updated the import to include the new dispatchTaskUpdate helper. - Modified the task update listener to dispatch a proper state effect via dispatchTaskUpdate, passing along the task path received from the event. - This change ensures that the CodeMirror view correctly rebuilds decorations when a task update event occurs. • Clean up inline widget styles: - Removed outdated inline task preview and instant convert button styles from task-card-bem.css. - Created a new stylesheet (task-inline-widget.css) with BEM-named, scoped styles for inline task widgets. - The new stylesheet provides a clearer structure, improved responsiveness, and appropriate separation of concerns for inline widgets. This refactor modernizes the task link overlay update mechanism using CodeMirror’s state effects, simplifies the update flow in main.ts, and cleans up style management by migrating inline widget CSS to a dedicated file.
2025-06-10 11:01:07 +00:00
}
Refactor Task Template Processing & Improve Link Generation & CSS Priority Styling (#37) • Removed body template processing from TaskCreationModal: - The applyBodyTemplate() call and its associated logic were removed from the modal. - The modal now simply pre-populates the textarea with any provided details, ensuring the user’s input is maintained without automatic template injection. • Moved template logic to TaskService: - Introduced a new private async method applyBodyTemplate() in TaskService. - This method now handles reading the template file (if enabled), processing it with task data (including the new “details” field), and returning the final content. - When creating a task file, the processed template content is appended to the file content instead of using raw user details. • Enhanced Template Variable Support: - Updated the helpers helper function processTaskTemplateVariables() to include a new replacement for {{details}}, allowing user-provided details to be inserted into templates. - Modified the settings help text to include an explanation for the new {{details}} variable and clarify that the template is applied using all final form values. • Improved Instant Task Link Generation: - Added checks in InstantTaskConvertService to detect if the sanitized title includes nested Obsidian links or problematic characters (|, #, ^). - If such characters are found, the generated link defaults to a simple link format (without an alias) to avoid nested link structures. • Updated CSS Styling for Task Cards & Inline Widgets: - In task-card-bem.css, updated comment to reflect that CSS variables for priority are now set dynamically by TaskCard.ts. - In task-inline-widget.css, adjusted status and priority dot styles: • Changed the status dot color variable fallback to a fixed color (#666). • Replaced the priority dot style with a priority border style using left border colors, using distinct widths for high (4px), medium (3px), and low priority tasks. Overall, these changes reposition the template functionality to be applied at task creation (rather than during modal pre-population), add better handling for nested links in instant task conversion, extend template variable support, and update styling for better visual cues.
2025-06-13 22:32:30 +00:00
.tasknotes-plugin .task-inline-preview.task-inline-preview--priority-medium {
border-left-color: var(--color-orange);
border-left-width: 3px;
Refactor task update handling & cleanup inline widget styles • Introduce a new CodeMirror state effect for task updates in TaskLinkOverlay.ts: - Added the taskUpdateEffect to signal task updates. - Updated decoration rebuild logic to check for the new state effect instead of relying on a refreshController. - Modified the widget cache logic to clear active widgets when a task update effect is detected. - Removed the now-unused refreshController from the createTaskLinkField function. • Enhance global task update dispatching in main.ts: - Updated the import to include the new dispatchTaskUpdate helper. - Modified the task update listener to dispatch a proper state effect via dispatchTaskUpdate, passing along the task path received from the event. - This change ensures that the CodeMirror view correctly rebuilds decorations when a task update event occurs. • Clean up inline widget styles: - Removed outdated inline task preview and instant convert button styles from task-card-bem.css. - Created a new stylesheet (task-inline-widget.css) with BEM-named, scoped styles for inline task widgets. - The new stylesheet provides a clearer structure, improved responsiveness, and appropriate separation of concerns for inline widgets. This refactor modernizes the task link overlay update mechanism using CodeMirror’s state effects, simplifies the update flow in main.ts, and cleans up style management by migrating inline widget CSS to a dedicated file.
2025-06-10 11:01:07 +00:00
}
Refactor Task Template Processing & Improve Link Generation & CSS Priority Styling (#37) • Removed body template processing from TaskCreationModal: - The applyBodyTemplate() call and its associated logic were removed from the modal. - The modal now simply pre-populates the textarea with any provided details, ensuring the user’s input is maintained without automatic template injection. • Moved template logic to TaskService: - Introduced a new private async method applyBodyTemplate() in TaskService. - This method now handles reading the template file (if enabled), processing it with task data (including the new “details” field), and returning the final content. - When creating a task file, the processed template content is appended to the file content instead of using raw user details. • Enhanced Template Variable Support: - Updated the helpers helper function processTaskTemplateVariables() to include a new replacement for {{details}}, allowing user-provided details to be inserted into templates. - Modified the settings help text to include an explanation for the new {{details}} variable and clarify that the template is applied using all final form values. • Improved Instant Task Link Generation: - Added checks in InstantTaskConvertService to detect if the sanitized title includes nested Obsidian links or problematic characters (|, #, ^). - If such characters are found, the generated link defaults to a simple link format (without an alias) to avoid nested link structures. • Updated CSS Styling for Task Cards & Inline Widgets: - In task-card-bem.css, updated comment to reflect that CSS variables for priority are now set dynamically by TaskCard.ts. - In task-inline-widget.css, adjusted status and priority dot styles: • Changed the status dot color variable fallback to a fixed color (#666). • Replaced the priority dot style with a priority border style using left border colors, using distinct widths for high (4px), medium (3px), and low priority tasks. Overall, these changes reposition the template functionality to be applied at task creation (rather than during modal pre-population), add better handling for nested links in instant task conversion, extend template variable support, and update styling for better visual cues.
2025-06-13 22:32:30 +00:00
.tasknotes-plugin .task-inline-preview.task-inline-preview--priority-low {
border-left-color: var(--color-blue);
Refactor task update handling & cleanup inline widget styles • Introduce a new CodeMirror state effect for task updates in TaskLinkOverlay.ts: - Added the taskUpdateEffect to signal task updates. - Updated decoration rebuild logic to check for the new state effect instead of relying on a refreshController. - Modified the widget cache logic to clear active widgets when a task update effect is detected. - Removed the now-unused refreshController from the createTaskLinkField function. • Enhance global task update dispatching in main.ts: - Updated the import to include the new dispatchTaskUpdate helper. - Modified the task update listener to dispatch a proper state effect via dispatchTaskUpdate, passing along the task path received from the event. - This change ensures that the CodeMirror view correctly rebuilds decorations when a task update event occurs. • Clean up inline widget styles: - Removed outdated inline task preview and instant convert button styles from task-card-bem.css. - Created a new stylesheet (task-inline-widget.css) with BEM-named, scoped styles for inline task widgets. - The new stylesheet provides a clearer structure, improved responsiveness, and appropriate separation of concerns for inline widgets. This refactor modernizes the task link overlay update mechanism using CodeMirror’s state effects, simplifies the update flow in main.ts, and cleans up style management by migrating inline widget CSS to a dedicated file.
2025-06-10 11:01:07 +00:00
}
/* Pencil menu icon */
.tasknotes-plugin .task-inline-preview__menu-icon {
width: 10px;
height: 10px;
flex-shrink: 0;
opacity: 0.4;
transition: opacity 0.15s ease;
fix: restore pointer cursor fallback on interactive elements (#1470)
2026-02-08 08:05:31 +00:00
cursor: var(--cursor, pointer);
Refactor task update handling & cleanup inline widget styles • Introduce a new CodeMirror state effect for task updates in TaskLinkOverlay.ts: - Added the taskUpdateEffect to signal task updates. - Updated decoration rebuild logic to check for the new state effect instead of relying on a refreshController. - Modified the widget cache logic to clear active widgets when a task update effect is detected. - Removed the now-unused refreshController from the createTaskLinkField function. • Enhance global task update dispatching in main.ts: - Updated the import to include the new dispatchTaskUpdate helper. - Modified the task update listener to dispatch a proper state effect via dispatchTaskUpdate, passing along the task path received from the event. - This change ensures that the CodeMirror view correctly rebuilds decorations when a task update event occurs. • Clean up inline widget styles: - Removed outdated inline task preview and instant convert button styles from task-card-bem.css. - Created a new stylesheet (task-inline-widget.css) with BEM-named, scoped styles for inline task widgets. - The new stylesheet provides a clearer structure, improved responsiveness, and appropriate separation of concerns for inline widgets. This refactor modernizes the task link overlay update mechanism using CodeMirror’s state effects, simplifies the update flow in main.ts, and cleans up style management by migrating inline widget CSS to a dedicated file.
2025-06-10 11:01:07 +00:00
display: flex;
align-items: center;
justify-content: center;
border-radius: 1px;
padding: 0;
margin-left: 1px;
}
.tasknotes-plugin .task-inline-preview__menu-icon:hover {
opacity: 1;
background-color: var(--background-modifier-hover);
}
.tasknotes-plugin .task-inline-preview:hover .task-inline-preview__menu-icon {
opacity: 0.8;
}
/* =================================================================
THEME-SPECIFIC ADJUSTMENTS
================================================================= */
/* Theme-specific adjustments */
.theme-dark .tasknotes-plugin .task-inline-preview {
background-color: var(--background-secondary);
border-color: var(--background-modifier-border);
}
.theme-light .tasknotes-plugin .task-inline-preview {
background-color: var(--background-secondary);
border-color: var(--background-modifier-border);
}
/* =================================================================
ANIMATIONS
================================================================= */
@keyframes tn-fadeInTaskPreview {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
/* =================================================================
RESPONSIVE DESIGN
================================================================= */
/* Responsive adjustments */
@media (max-width: 768px) {
.tasknotes-plugin .task-inline-preview {
max-width: 200px;
Improve inline task preview widget layout and spacing • Switch layout from "display: inline" to "inline-flex" for .task-inline-preview to ensure proper element alignment, adding align-items: center and a gap for consistent spacing. • Update padding and margin values across elements:   – Add padding (2px 4px) to .task-inline-preview for improved clickable area.   – Adjust spacing on status dot, date icon, and pencil icon by setting explicit margin and vertical-align values. • Remove redundant task title styles and consolidate text overflow rules:   – Reduce max-width from 300px to 250px and add flex-shrink/vertical-align settings for better cropping and responsiveness. • Tweak responsive design in media query and reading mode context:   – Modify padding and gap in media query for max-width adjustments.   – Ensure reading mode styling uses consistent gap and increased padding. These CSS updates enhance both the visual consistency and usability of the inline task preview widget.
2025-06-22 10:20:42 +00:00
padding: 2px 4px;
gap: 6px;
Refactor task update handling & cleanup inline widget styles • Introduce a new CodeMirror state effect for task updates in TaskLinkOverlay.ts: - Added the taskUpdateEffect to signal task updates. - Updated decoration rebuild logic to check for the new state effect instead of relying on a refreshController. - Modified the widget cache logic to clear active widgets when a task update effect is detected. - Removed the now-unused refreshController from the createTaskLinkField function. • Enhance global task update dispatching in main.ts: - Updated the import to include the new dispatchTaskUpdate helper. - Modified the task update listener to dispatch a proper state effect via dispatchTaskUpdate, passing along the task path received from the event. - This change ensures that the CodeMirror view correctly rebuilds decorations when a task update event occurs. • Clean up inline widget styles: - Removed outdated inline task preview and instant convert button styles from task-card-bem.css. - Created a new stylesheet (task-inline-widget.css) with BEM-named, scoped styles for inline task widgets. - The new stylesheet provides a clearer structure, improved responsiveness, and appropriate separation of concerns for inline widgets. This refactor modernizes the task link overlay update mechanism using CodeMirror’s state effects, simplifies the update flow in main.ts, and cleans up style management by migrating inline widget CSS to a dedicated file.
2025-06-10 11:01:07 +00:00
font-size: calc(var(--editor-font-size, 16px) * 0.9);
}
.tasknotes-plugin .task-inline-preview__status-dot {
feat(ui): update inline and card task widgets with enhanced status cycling and Todoist-inspired styling • In TaskLinkWidget.ts: - Added an import for dispatchTaskUpdate from TaskLinkOverlay. - Moved the status indicator dot before the task title and updated its styling to use a border color instead of text color. - Introduced a click handler on the status dot to: • Retrieve the latest task information. • Cycle the task status using the plugin’s statusManager. • Update the UI immediately (status dot color and container’s completed state). • Dispatch a system-wide task update event after a short delay. - Reordered the priority indicator dot so it appears before the title. • In TaskCard.ts: - Updated the status and priority dot styling from using backgroundColor to setting borderColor to better match the new theme. - Added a click handler on the status dot to: • Distinguish between recurring tasks (toggle completion) and standard tasks (cycle status). • Refresh task data before updating status. • Provide error feedback via a Notice on failure. - Adjusted the logic for dynamically adding/removing/updating the priority dot on task cards. • In task-card-bem.css: - Revamped task card styling to reflect a Todoist minimal/compact design: • Adjusted padding, margins, background, and interactive states. • Styled focus states, drag-and-drop feedback (ghosts, drop zones, and dragging pulsing animation), and media queries for responsive/touch devices. • Updated status dots, priority indicators, and added improvements for accessibility and reduced motion. - Replaced older animations and shadows with simplified transitions and color mixes. • In task-inline-widget.css: - Revised inline widget styling to align status dot appearance with the task card (matching border, size, and hover effects). - Updated task title styling to improve spacing. - Amended the completed status styling to show a filled circle checkmark. This commit refines both the task inline widget and task card components for consistent interactions and modern visual design while improving accessibility and responsive behavior.
2025-06-22 08:12:10 +00:00
width: 16px;
height: 16px;
Refactor task update handling & cleanup inline widget styles • Introduce a new CodeMirror state effect for task updates in TaskLinkOverlay.ts: - Added the taskUpdateEffect to signal task updates. - Updated decoration rebuild logic to check for the new state effect instead of relying on a refreshController. - Modified the widget cache logic to clear active widgets when a task update effect is detected. - Removed the now-unused refreshController from the createTaskLinkField function. • Enhance global task update dispatching in main.ts: - Updated the import to include the new dispatchTaskUpdate helper. - Modified the task update listener to dispatch a proper state effect via dispatchTaskUpdate, passing along the task path received from the event. - This change ensures that the CodeMirror view correctly rebuilds decorations when a task update event occurs. • Clean up inline widget styles: - Removed outdated inline task preview and instant convert button styles from task-card-bem.css. - Created a new stylesheet (task-inline-widget.css) with BEM-named, scoped styles for inline task widgets. - The new stylesheet provides a clearer structure, improved responsiveness, and appropriate separation of concerns for inline widgets. This refactor modernizes the task link overlay update mechanism using CodeMirror’s state effects, simplifies the update flow in main.ts, and cleans up style management by migrating inline widget CSS to a dedicated file.
2025-06-10 11:01:07 +00:00
}
.tasknotes-plugin .task-inline-preview__menu-icon {
width: 14px;
height: 14px;
}
Enhance Drag & Drop Functionality Drag and Drop Enhancements: • New CodeMirror Extension for Task Drops: - Added src/editor/TaskDropExtension.ts to capture dragover/drop events in the editor. - Implements logic to intercept dropped task data, retrieve task info via cacheManager, insert a formatted task link into the editor, and provide user feedback (using Obsidian’s Notice API). • Centralized Drag & Drop Manager: - Introduced src/utils/DragDropManager.ts to encapsulate the logic for making task cards draggable. - Exposes methods to attach and remove draggable behavior using FullCalendar’s Draggable interface. - Registers proper HTML5 drag data transfer for compatibility between the Obsidian editor and calendar views. • Main Plugin Updates: - In src/main.ts: Initialized DragDropManager and registered the TaskDropExtension, ensuring the drag & drop infrastructure is integrated in the plugin lifecycle (creation and cleanup). • View Updates: - Updated src/views/AdvancedCalendarView.ts to handle external drops and eventReceive events, scheduling tasks accordingly. - Enhanced src/views/AgendaView.ts and src/views/TaskListView.ts to add drag handlers to task cards using the centralized DragDropManager. - Modified src/views/MiniCalendarView.ts to add drop handlers on calendar day elements, allowing users to set task due dates via drop interactions. • Style Improvements: - Updated styles in styles/calendar-view.css, styles/task-card-bem.css, and styles/task-inline-widget.css to visually support new drag-and-drop states (e.g., drag-over highlights, dragging state opacity, cursor changes). This commit lays the groundwork not only for a robust testing strategy that will help safeguard future refactors and feature additions, but also for a more integrated and intuitive drag and drop user experience across the calendar and task views. ----------------- Reviewed-by: [Your Name] Issue: [Link to Issue or Task]
2025-06-13 09:31:40 +00:00
}
Add task previews to reading mode
2025-06-21 12:16:21 +00:00
/* =================================================================
READING MODE SPECIFIC STYLES
================================================================= */
/* Reading mode task preview adjustments */
.tasknotes-plugin .task-inline-preview--reading-mode {
/* Ensure proper display in reading mode context */
display: inline-flex;
align-items: center;
Improve inline task preview widget layout and spacing • Switch layout from "display: inline" to "inline-flex" for .task-inline-preview to ensure proper element alignment, adding align-items: center and a gap for consistent spacing. • Update padding and margin values across elements:   – Add padding (2px 4px) to .task-inline-preview for improved clickable area.   – Adjust spacing on status dot, date icon, and pencil icon by setting explicit margin and vertical-align values. • Remove redundant task title styles and consolidate text overflow rules:   – Reduce max-width from 300px to 250px and add flex-shrink/vertical-align settings for better cropping and responsiveness. • Tweak responsive design in media query and reading mode context:   – Modify padding and gap in media query for max-width adjustments.   – Ensure reading mode styling uses consistent gap and increased padding. These CSS updates enhance both the visual consistency and usability of the inline task preview widget.
2025-06-22 10:20:42 +00:00
gap: 8px;
Add task previews to reading mode
2025-06-21 12:16:21 +00:00
/* Better visual integration with reading mode */
Improve inline task preview widget layout and spacing • Switch layout from "display: inline" to "inline-flex" for .task-inline-preview to ensure proper element alignment, adding align-items: center and a gap for consistent spacing. • Update padding and margin values across elements:   – Add padding (2px 4px) to .task-inline-preview for improved clickable area.   – Adjust spacing on status dot, date icon, and pencil icon by setting explicit margin and vertical-align values. • Remove redundant task title styles and consolidate text overflow rules:   – Reduce max-width from 300px to 250px and add flex-shrink/vertical-align settings for better cropping and responsiveness. • Tweak responsive design in media query and reading mode context:   – Modify padding and gap in media query for max-width adjustments.   – Ensure reading mode styling uses consistent gap and increased padding. These CSS updates enhance both the visual consistency and usability of the inline task preview widget.
2025-06-22 10:20:42 +00:00
padding: 3px 8px;
Add task previews to reading mode
2025-06-21 12:16:21 +00:00
border-radius: 4px;
background-color: var(--background-modifier-hover);
border: 1px solid var(--background-modifier-border);
/* Smooth transitions */
transition: all 0.15s ease;
}
.tasknotes-plugin .task-inline-preview--reading-mode:hover {
background-color: var(--background-modifier-hover-active);
border-color: var(--interactive-accent);
transform: translateY(-1px);
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}
/* Reading mode title styling */
.tasknotes-plugin .task-inline-preview--reading-mode .task-inline-preview__title {
font-weight: 500;
color: var(--text-normal);
}
/* Reading mode date styling */
.tasknotes-plugin .task-inline-preview--reading-mode .task-inline-preview__date {
font-size: 0.85em;
opacity: 0.8;
}
/* Reading mode icon adjustments */
.tasknotes-plugin .task-inline-preview--reading-mode .task-inline-preview__date-icon {
width: 11px;
height: 11px;
margin-right: 3px;
}
.tasknotes-plugin .task-inline-preview--reading-mode .task-inline-preview__pencil {
width: 11px;
height: 11px;
opacity: 0.5;
}
.tasknotes-plugin .task-inline-preview--reading-mode:hover .task-inline-preview__pencil {
opacity: 0.9;
}
Enhance Drag & Drop Functionality Drag and Drop Enhancements: • New CodeMirror Extension for Task Drops: - Added src/editor/TaskDropExtension.ts to capture dragover/drop events in the editor. - Implements logic to intercept dropped task data, retrieve task info via cacheManager, insert a formatted task link into the editor, and provide user feedback (using Obsidian’s Notice API). • Centralized Drag & Drop Manager: - Introduced src/utils/DragDropManager.ts to encapsulate the logic for making task cards draggable. - Exposes methods to attach and remove draggable behavior using FullCalendar’s Draggable interface. - Registers proper HTML5 drag data transfer for compatibility between the Obsidian editor and calendar views. • Main Plugin Updates: - In src/main.ts: Initialized DragDropManager and registered the TaskDropExtension, ensuring the drag & drop infrastructure is integrated in the plugin lifecycle (creation and cleanup). • View Updates: - Updated src/views/AdvancedCalendarView.ts to handle external drops and eventReceive events, scheduling tasks accordingly. - Enhanced src/views/AgendaView.ts and src/views/TaskListView.ts to add drag handlers to task cards using the centralized DragDropManager. - Modified src/views/MiniCalendarView.ts to add drop handlers on calendar day elements, allowing users to set task due dates via drop interactions. • Style Improvements: - Updated styles in styles/calendar-view.css, styles/task-card-bem.css, and styles/task-inline-widget.css to visually support new drag-and-drop states (e.g., drag-over highlights, dragging state opacity, cursor changes). This commit lays the groundwork not only for a robust testing strategy that will help safeguard future refactors and feature additions, but also for a more integrated and intuitive drag and drop user experience across the calendar and task views. ----------------- Reviewed-by: [Your Name] Issue: [Link to Issue or Task]
2025-06-13 09:31:40 +00:00
/* =================================================================
TASK INLINE PREVIEW DRAG AND DROP STATES
================================================================= */
/* Dragging state for task inline preview widgets */
.tasknotes-plugin .task-inline-preview--dragging {
opacity: 0.6;
transform: scale(0.95);
cursor: grabbing;
z-index: 1000;
pointer-events: none;
}
/* Drag cursor for draggable task inline preview widgets */
.tasknotes-plugin .task-inline-preview[draggable="true"] {
cursor: grab;
}
.tasknotes-plugin .task-inline-preview[draggable="true"]:active {
cursor: grabbing;
Add task previews to reading mode
2025-06-21 12:16:21 +00:00
}
Reference in a new issue Copy permalink