mirror of
https://github.com/samsonjs/vibetunnel.git
synced 2026-04-27 15:17:38 +00:00
fix: add terminal styles to vibe-terminal-buffer component
- Add explicit terminal character styles to ensure proper rendering - Include style definitions for bold, italic, underline, dim, strikethrough - Ensure CSS variables are properly inherited from parent scope - Fix text rendering issues where colors appeared gray 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
parent
c738ec0f57
commit
01df54c63b
1 changed files with 45 additions and 0 deletions
|
|
@ -183,6 +183,51 @@ export class VibeTerminalBuffer extends LitElement {
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
return html`
|
return html`
|
||||||
|
<style>
|
||||||
|
/* Import terminal color variables from parent scope */
|
||||||
|
.terminal-container {
|
||||||
|
/* Ensure CSS variables are inherited */
|
||||||
|
color: #d4d4d4;
|
||||||
|
background-color: transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Terminal character styling */
|
||||||
|
.terminal-char {
|
||||||
|
font-variant-ligatures: none;
|
||||||
|
font-feature-settings: 'liga' 0;
|
||||||
|
white-space: pre;
|
||||||
|
}
|
||||||
|
|
||||||
|
.terminal-char.bold {
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
.terminal-char.italic {
|
||||||
|
font-style: italic;
|
||||||
|
}
|
||||||
|
|
||||||
|
.terminal-char.underline {
|
||||||
|
text-decoration: underline;
|
||||||
|
}
|
||||||
|
|
||||||
|
.terminal-char.dim {
|
||||||
|
opacity: 0.5;
|
||||||
|
}
|
||||||
|
|
||||||
|
.terminal-char.strikethrough {
|
||||||
|
text-decoration: line-through;
|
||||||
|
}
|
||||||
|
|
||||||
|
.terminal-char.cursor {
|
||||||
|
background-color: #23d18b !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Terminal line styling */
|
||||||
|
.terminal-line {
|
||||||
|
white-space: pre;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
<div class="relative w-full h-full overflow-hidden bg-[#1e1e1e]">
|
<div class="relative w-full h-full overflow-hidden bg-[#1e1e1e]">
|
||||||
${this.error
|
${this.error
|
||||||
? html`
|
? html`
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue