Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
25 commits
Select commit Hold shift + click to select a range
12365b0
Add Copy to Calendar integration with Full Calendar plugin
geetduggal Jun 29, 2025
e5eafe2
Add option to place board settings at beginning of file
geetduggal Jul 1, 2025
4e33734
Add calendar color visual feedback feature
geetduggal Jul 7, 2025
f16ede3
Update PR description with calendar color feature documentation
geetduggal Jul 7, 2025
d919c77
Fix card color persistence across file reopens and devices
geetduggal Jul 7, 2025
5980d69
Add colored circle indicators to calendar picker
geetduggal Jul 7, 2025
40ec8e4
Add emoji color indicators to calendar picker submenu
geetduggal Jul 7, 2025
6e52f55
Improve text contrast algorithm to match Full Calendar
geetduggal Jul 7, 2025
97c7418
Transform to Kanban Plus: Add cross-file card movement
geetduggal Aug 16, 2025
2569f1b
Add comprehensive features documentation
geetduggal Aug 16, 2025
5e05801
Fix broken 'Move to list' menu with proper sync/async handling
geetduggal Aug 16, 2025
e40a612
Fix cross-file card movement with direct markdown manipulation
geetduggal Aug 16, 2025
ed58c99
Implement proper nested submenu structure for cross-file movement
geetduggal Aug 16, 2025
25e1b6d
Fix submenu population using cachedRead for immediate display
geetduggal Aug 16, 2025
55d593d
Implement separate menu items for associated files as requested
geetduggal Aug 16, 2025
00d4e8e
Fix empty submenu issue by pre-loading file content
geetduggal Aug 16, 2025
53b6ab7
Fix menu timing issue - make callback async to wait for associated files
geetduggal Aug 16, 2025
c424a82
Update FEATURES.md - fix Move to file menu description
geetduggal Aug 16, 2025
df75541
Remove outdated PR_DESCRIPTION.md
geetduggal Aug 16, 2025
90fd647
🎨 Convert calendar colors from stored data to hashtag-based approach
geetduggal Aug 26, 2025
a9100f9
Remove hashtags from calendar event filenames
geetduggal Aug 26, 2025
e7316ee
📖 Update README to clarify Kanban Plus as enhanced fork
geetduggal Aug 26, 2025
119b920
📝 Clean up README - remove marketing fluff and add AI development info
geetduggal Aug 26, 2025
76e405f
📖 Add philosophical rationale and Medium post links to README
geetduggal Aug 26, 2025
9aadb23
🔧 Fix inaccurate wording about Bases current Kanban capabilities
geetduggal Aug 26, 2025
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
123 changes: 123 additions & 0 deletions CALENDAR_COLOR_FEATURE.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,123 @@
# Calendar Color Feature - Hashtag-Based Visual Feedback

## Overview

This enhancement adds visual feedback to cards based on hashtags that match calendar names from the Full Calendar plugin. Cards automatically display calendar colors when they contain hashtags that correspond to configured calendar names, creating a seamless visual connection between task planning and calendar scheduling.

## How It Works

### Hashtag-Based Color Association

1. **Hashtag Detection**: System scans card content for hashtags (e.g., `#Work`, `#Personal`)
2. **Calendar Matching**: First hashtag that matches a calendar name determines the card color
3. **Color Application**: Card background and text colors automatically update to match the associated calendar
4. **Smart Contrast**: Text color (black/white) is automatically calculated for optimal readability

### Copy to Calendar Enhancement

When copying a card to a calendar:

1. **Event Creation**: Calendar event is created in the specified directory
2. **Hashtag Addition**: If the card doesn't already have a hashtag matching the calendar name, it's automatically added
3. **Instant Visual Feedback**: Card immediately displays the calendar's color scheme
4. **Persistent Association**: The hashtag creates a permanent visual connection between the card and calendar

### Smart Text Color Calculation

The system automatically calculates the best text color (black or white) based on the background color brightness, ensuring optimal readability regardless of the calendar color.

## Technical Implementation

### Hashtag-Based Color Resolution

Colors are determined dynamically by parsing hashtags and matching them to Full Calendar configuration:

```typescript
// Example card content
"Complete project deliverables #Work #HighPriority"

// System finds #Work matches "Work" calendar (case-insensitive)
// Applies calendar color: #ff6b6b with contrasting text color
```

### Real-Time Color Lookup Process

1. **Content Parsing**: Extract all hashtags from card content using regex: `/#([^\s#]+)/g`
2. **Calendar Matching**: Compare hashtags to calendar names from Full Calendar `data.json`
3. **Color Resolution**: First matching hashtag determines the color scheme
4. **Style Application**: Colors applied via CSS custom properties for theme integration

### Dynamic Integration with Full Calendar

- **Configuration Source**: Reads directly from `.obsidian/plugins/obsidian-full-calendar/data.json`
- **Live Updates**: Changes to Full Calendar settings are reflected immediately
- **No Storage Overhead**: No persistent color data stored in board settings
- **Calendar Synchronization**: Visual state always matches current calendar configuration

### CSS Variables

The system uses CSS custom properties for dynamic color application:

```css
.kanban-plugin__item.has-calendar-color {
--card-background-color: var(--calendar-color);
--card-color: var(--calendar-text-color);
}
```

### Automatic Hashtag Addition

When a card is copied to a calendar:
1. Check if card already has a hashtag matching the calendar name
2. If not, append the calendar name as a hashtag (e.g., `#Work`)
3. Text contrast is calculated for optimal readability
4. UI immediately reflects the new color based on the hashtag

## User Experience Benefits

1. **Automatic Color Association**: Cards display calendar colors based on their hashtags
2. **Zero Configuration**: No setup required - colors are determined by existing Full Calendar settings
3. **Persistent Visual Cues**: Hashtags provide permanent visual connection between cards and calendars
4. **Dynamic Updates**: Colors automatically update when Full Calendar settings change
5. **Intuitive Tagging**: Natural hashtag workflow integrates seamlessly with calendar organization
6. **Accessibility**: Automatic contrast calculation ensures text remains readable

## Backward Compatibility

- Cards without hashtags remain unchanged
- Existing color systems (tag colors, date colors) continue to work normally
- Feature is purely additive - no existing functionality is modified
- No changes to board settings format - hashtags are stored in card content only

## Usage Examples

### Automatic Color Display
```markdown
- [ ] Meeting with client #Work
- [ ] Doctor appointment #Personal
- [ ] Team review #Work
```
Cards automatically display colors based on `#Work` and `#Personal` hashtags matching calendar names.

### Copy to Calendar Workflow
1. Create a card: `"Complete project proposal"`
2. Right-click → "Copy to Calendar"
3. Select "Work Calendar"
4. Card content becomes: `"Complete project proposal #Work"`
5. Card immediately displays Work calendar's color scheme

### Manual Hashtag Assignment
Add hashtags to any card to instantly apply calendar colors without copying to calendar:
- Add `#Personal` → card shows Personal calendar colors
- Add `#Work` → card shows Work calendar colors
- Change `#Work` to `#Personal` → colors update automatically

## Integration with Full Calendar Plugin

The feature leverages the Full Calendar plugin's color configuration:
- Reads calendar colors from Full Calendar plugin settings
- Respects calendar directory configurations
- Maintains compatibility with Full Calendar's "Full note" mode
- Supports both wildcard patterns and literal directory names

This creates a seamless workflow between task planning (Kanban) and time scheduling (Full Calendar), with visual feedback bridging the gap between the two productivity systems.
Loading