fix: Improve right panel interaction

- Remove Collapsible wrapper for direct access
- Show config inputs directly without clicking
- Add clear visual hierarchy
- Improve input field styling
- Add config hint text
- Better focus states
This commit is contained in:
JianFeeeee
2026-04-10 15:59:30 +08:00
parent e9df29a988
commit aad0b71c33
2 changed files with 60 additions and 20 deletions

View File

@ -1,5 +1,42 @@
/* Component Styles for Graph Memory TUI */
/* Config Section */
ConfigSection {
background: $surface;
padding: 1;
margin: 1;
}
ConfigSection .config-title {
color: $primary;
text-style: bold;
margin: 1;
}
ConfigSection .config-label {
color: $text;
margin: 1 0 0 0;
}
ConfigSection .config-hint {
color: $text-muted;
text-style: italic;
margin: 1 0 0 0;
}
ConfigSection Input {
width: 1fr;
margin: 0 0 1 0;
background: $surface-lighten-1;
border: solid $primary;
}
ConfigSection Input:focus {
border: double $primary;
background: $surface-lighten-2;
}
/* Input Box */
InputBox {
border: solid orange;
height: 3;
@ -24,6 +61,7 @@ InputBox Input:focus {
background: $surface-lighten-1;
}
/* Other Components */
ConfigSection {
background: $panel;
margin: 1;

View File

@ -22,26 +22,28 @@ class ConfigSection(Vertical):
def compose(self) -> ComposeResult:
"""构建配置区"""
with Collapsible(title="配置", collapsed=True):
yield Static("API Key (sk-开头):", classes="config-label")
yield Input(
value=self._config.api_key,
placeholder="sk-xxxxxxxxxxxxx",
id="api-key-input",
password=False # 改为明文显示,方便编辑
)
yield Static("模型:", classes="config-label")
yield Input(
value=self._config.model,
placeholder="deepseek-chat",
id="model-input"
)
yield Static("Base URL:", classes="config-label")
yield Input(
value=self._config.base_url,
placeholder="https://api.deepseek.com",
id="base-url-input"
)
# 直接显示配置不使用Collapsible
yield Static("━━ 配置 ━━", classes="config-title")
yield Static("API Key:", classes="config-label")
yield Input(
value=self._config.api_key,
placeholder="sk-xxxxxxxxxxxxx",
id="api-key-input",
password=False
)
yield Static("模型:", classes="config-label")
yield Input(
value=self._config.model,
placeholder="deepseek-chat",
id="model-input"
)
yield Static("Base URL:", classes="config-label")
yield Input(
value=self._config.base_url,
placeholder="https://api.deepseek.com",
id="base-url-input"
)
yield Static("按Enter保存配置", classes="config-hint")
def on_input_changed(self, event: Input.Changed) -> None:
"""处理输入变更事件"""