andy-stack_vaultkeeper-ai/Styles/diff2html_styles.css
Andrew Beal 28772e7d0e feat: implement centralized abort controller with enhanced cancellation UX
Introduce a new AbortService to centralize cancellation logic across all async operations, replacing scattered AbortSignal parameters with a unified singleton service. This improves maintainability and provides consistent cancellation behavior throughout the application.

Key changes:
- Add AbortService for centralized abort signal management with automatic cleanup
- Refactor all AI providers (Claude, Gemini, OpenAI) to use AbortService instead of passing AbortSignal parameters
- Update streaming operations to use centralized abort handling
- Add CancellationIndicator component to show visual feedback during operation cancellation
- Rename ChatAreaThought to ThoughtIndicator for better semantic clarity
- Add Environment enum for consistent environment detection
- Enhance ChatService lifecycle with proper cancellation state management
- Remove scattered abort-related UI selectors and error messages in favor of dedicated indicator
- Add safeContinue() factory method to ConversationContent for internal continuations
- Update all tests to reflect new abort handling architecture

This change simplifies the API surface by removing AbortSignal parameters from method signatures while improving the user experience with clearer cancellation feedback.
2025-12-04 23:04:20 +00:00

250 lines
6.5 KiB
CSS

/* Override diff2html blue tones with Obsidian's CSS variables */
/* Main diff container background */
.d2h-wrapper {
transform: translateZ(0);
background-color: var(--background-primary) !important;
box-shadow: 0px 0px 4px 1px var(--color-accent) !important;
}
/* File header background */
.d2h-file-header {
background-color: var(--background-primary) !important;
border-color: var(--background-modifier-border) !important;
}
/* File name container */
.d2h-file-name-wrapper {
background-color: var(--background-primary-alt) !important;
}
.d2h-code-linenumber {
cursor: default;
}
/* Line number backgrounds - only override context lines */
.d2h-code-linenumber.d2h-cntx {
background-color: var(--background-primary-alt) !important;
border-color: var(--background-modifier-border) !important;
}
/* Code line backgrounds - only override context lines */
.d2h-code-line.d2h-cntx {
background-color: var(--background-primary) !important;
}
/* Info section background */
.d2h-info {
background-color: var(--background-secondary) !important;
border-color: var(--background-modifier-border) !important;
}
/* File diff background */
.d2h-file-diff {
overflow: auto;
background-color: var(--background-primary) !important;
border-color: var(--background-modifier-border) !important;
}
/* File diff size */
@container diff-container (max-height: 199px) {
.d2h-file-diff { max-height: 90cqh; }
}
@container diff-container (min-height: 200px) {
.d2h-file-diff { max-height: 95cqh; }
}
@container diff-container (min-height: 400px) {
.d2h-file-diff { max-height: 97cqh; }
}
@container diff-container (min-height: 550px) {
.d2h-file-diff { max-height: 98cqh; }
}
@container diff-container (min-height: 1000px) {
.d2h-file-diff { max-height: 99cqh; }
}
/* Empty placeholder */
.d2h-emptyplaceholder {
background-color: var(--background-secondary-alt) !important;
}
.d2h-code-side-linenumber {
position: relative;
display: table-cell;
}
/* Code side backgrounds for side-by-side view - only override context lines */
.d2h-code-side-linenumber.d2h-cntx,
.d2h-code-side-line.d2h-cntx {
background-color: var(--background-primary) !important;
}
/* Fix transparent backgrounds on insertion/deletion line numbers */
/* Dark mode styles - side-by-side view */
.theme-dark .d2h-code-side-linenumber.d2h-ins {
background-color: #1e3a1e !important; /* Dark green - solid color */
}
.theme-dark .d2h-code-side-linenumber.d2h-del {
background-color: #3a1e1e !important; /* Dark red - solid color */
}
/* Dark mode styles - inline view */
.theme-dark .d2h-code-linenumber.d2h-ins {
background-color: #1e3a1e !important; /* Dark green - solid color */
}
.theme-dark .d2h-code-linenumber.d2h-del {
background-color: #3a1e1e !important; /* Dark red - solid color */
}
/* Light mode styles - side-by-side view */
.theme-light .d2h-code-side-linenumber.d2h-ins {
background-color: #c8e6c9 !important; /* Light green with better contrast */
}
.theme-light .d2h-code-side-linenumber.d2h-del {
background-color: #ffcdd2 !important; /* Light red with better contrast */
}
/* Light mode styles - inline view */
.theme-light .d2h-code-linenumber.d2h-ins {
background-color: #c8e6c9 !important; /* Light green with better contrast */
}
.theme-light .d2h-code-linenumber.d2h-del {
background-color: #ffcdd2 !important; /* Light red with better contrast */
}
/* Tags and labels */
.d2h-tag {
background-color: var(--background-secondary) !important;
border-color: var(--background-modifier-border) !important;
}
/* File list wrapper */
.d2h-file-list-wrapper {
background-color: var(--background-primary) !important;
}
/* File list header */
.d2h-file-list-header {
background-color: var(--background-primary-alt) !important;
border-color: var(--background-modifier-border) !important;
}
/* File list line */
.d2h-file-list-line {
background-color: var(--background-primary) !important;
border-color: var(--background-modifier-border) !important;
}
/* File switch container */
.d2h-file-switch {
background-color: var(--background-primary-alt) !important;
}
/* Toolbar */
.d2h-file-diff-toolbar {
background-color: var(--background-secondary) !important;
}
.d2h-file-header {
padding: 0 !important;
}
.d2h-file-name-wrapper {
padding-left: 8px !important;
}
/* Text colors */
.d2h-file-header,
.d2h-file-name,
.d2h-file-stats,
.d2h-code-linenumber,
.d2h-info {
color: var(--text-normal) !important;
}
.d2h-diff-table {
position: relative;
}
/* Light mode syntax highlighting overrides for better visibility */
.theme-light .d2h-code-side-line {
color: var(--text-normal) !important;
}
/* Force base text color for all code content in light mode */
.theme-light .d2h-code-line-ctn,
.theme-light .d2h-code-line-ctn * {
color: var(--text-normal) !important;
}
/* Override Monokai theme colors in light mode for better contrast */
.theme-light .hljs-comment,
.theme-light .hljs-quote {
color: #5c6370 !important; /* Medium gray for comments */
}
.theme-light .hljs-keyword,
.theme-light .hljs-selector-tag,
.theme-light .hljs-literal,
.theme-light .hljs-type {
color: #a626a4 !important; /* Purple for keywords */
}
.theme-light .hljs-string,
.theme-light .hljs-doctag {
color: #50a14f !important; /* Green for strings */
}
.theme-light .hljs-title,
.theme-light .hljs-section,
.theme-light .hljs-selector-id {
color: #4078f2 !important; /* Blue for titles/functions */
}
.theme-light .hljs-subst,
.theme-light .hljs-tag,
.theme-light .hljs-name,
.theme-light .hljs-attr,
.theme-light .hljs-attribute {
color: #e45649 !important; /* Red for tags/attributes */
}
.theme-light .hljs-variable,
.theme-light .hljs-template-variable {
color: #986801 !important; /* Orange for variables */
}
.theme-light .hljs-number,
.theme-light .hljs-built_in,
.theme-light .hljs-builtin-name,
.theme-light .hljs-class .hljs-title {
color: #c18401 !important; /* Gold for numbers/built-ins */
}
.theme-light .hljs-meta,
.theme-light .hljs-meta-keyword {
color: #a626a4 !important; /* Purple for meta */
}
.theme-light .hljs-symbol,
.theme-light .hljs-bullet,
.theme-light .hljs-link {
color: #0184bc !important; /* Cyan for symbols */
}
/* Ensure deletion and insertion text is visible */
.theme-light .d2h-code-line.d2h-del .hljs {
color: #24292e !important; /* Dark text on light red background */
}
.theme-light .d2h-code-line.d2h-ins .hljs {
color: #24292e !important; /* Dark text on light green background */
}