Skip to content

Conversation

@rysweet
Copy link
Owner

@rysweet rysweet commented Aug 5, 2025

Fixes #75

Summary

This PR adds a comprehensive Mermaid architecture diagram to the README with improved text visibility and readability. The diagram replaces the need for ASCII art and provides an interactive, maintainable visualization of Cue's architecture.

Changes

  • Added comprehensive Mermaid architecture diagram showing all Cue components and their relationships
  • Improved text visibility with darker background colors for better contrast
  • Explicit black text styling (color:#000) on all diagram components
  • Enhanced visual definition with darker borders and stroke styling
  • Detailed component documentation explaining each architectural layer

Text Visibility Improvements

Before (Original PR #74 colors)

  • Used very light colors like #e1f5fe, #e8f5e9, #fff3e0 causing poor text contrast
  • No explicit text color declarations
  • Faint text difficult to read

After (This PR)

  • Medium-toned background colors: #b3d9ff, #c8e6c9, #ffcc80, #ce93d8, #f8bbd9
  • Explicit black text: color:#000 on all components
  • Enhanced borders: stroke-width:2px with darker stroke colors
  • Clear, readable text with proper contrast ratios

Architecture Overview

The diagram shows three main architectural layers:

User Interfaces:

  • VS Code Extension (3D visualization)
  • MCP Server (AI agents)
  • Neo4j Database (graph storage)

Graph Layers:

  • Filesystem Layer
  • Code Hierarchy Layer
  • Documentation Layer

Processing Components:

  • LSP Integration
  • Tree-Sitter Parsing
  • LLM Integration

Testing

  • Verified Mermaid syntax is correct
  • Confirmed text contrast meets accessibility standards
  • Tested in GitHub's Mermaid renderer

Benefits

  • Improved accessibility with better text contrast
  • Professional documentation with interactive diagram
  • Maintainable compared to ASCII art
  • Educational value showing clear component relationships
  • Future-proof for documentation updates

🤖 Generated with Claude Code

Co-Authored-By: Claude noreply@anthropic.com

rysweet and others added 2 commits August 4, 2025 21:37
- Add comprehensive architecture diagram showing Cue's component structure
- Use darker background colors for better text contrast and readability
- Include explicit black text color (color:#000) on all components
- Add enhanced borders with darker strokes for better definition
- Provide detailed component descriptions below the diagram

Fixes #75
…gitignore

- Use darker background colors for better text contrast
- Add explicit black text color (color:#000) to all components
- Enhance borders with stroke-width:2px for clearer definition
- Add .vscode-test/ to .gitignore to exclude VS Code test directories

Fixes #75

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>
@rysweet rysweet merged commit 16f7771 into cue-migration-v2 Aug 5, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants