abbyswag/qwen-code
1
0
Fork 0
mirror of https://github.com/QwenLM/qwen-code.git synced 2025-12-21 09:17:53 +00:00
Code Issues Packages Projects Releases Wiki Activity

style(vscode-ide-companion): update UI components and styling

Browse Source 
- Updated chat message container spacing and styling
- Adjusted AssistantMessage text color handling
- Enhanced QwenMessageTimeline CSS rules for better visual flow
- Moved InfoBanner to ui directory for better organization
- Updated InputForm styling
- Added new CSS classes and updated tailwind configuration
- Improved timeline connection lines and message item spacing

These changes enhance the visual appearance and user experience of the chat interface.
This commit is contained in:
yiliang114
2025-12-04 08:28:54 +08:00
parent 86cd06ef43
commit 3053e6c41f
10 changed files with 185 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files

59
packages/vscode-ide-companion/src/webview/components/toolcalls/shared/SimpleTimeline.css
View File

@@ -4,21 +4,19 @@
* SPDX-License-Identifier: Apache-2.0
*
* Simplified timeline styles for tool calls and messages
* Merged version of both SimpleTimeline.css files
* Only keeping actually used styles
*/
/* Basic timeline container */
.simple-toolcall-container,
.simple-timeline-container {
/* ToolCallContainer timeline styles (from LayoutComponents.css) */
.toolcall-container {
position: relative;
padding-left: 30px;
padding-top: 8px;
padding-bottom: 8px;
}
/* Timeline connector - simple version */
.simple-toolcall-container::after,
.simple-timeline-container::after {
/* ToolCallContainer timeline connector */
.toolcall-container::after {
content: '';
position: absolute;
left: 12px;
@@ -28,28 +26,45 @@
background-color: var(--app-primary-border-color);
}
/* First item connector starts lower */
.simple-toolcall-container:first-child::after,
.simple-timeline-container:first-child::after {
/* First item: connector starts from status point position */
.toolcall-container:first-child::after {
top: 24px;
}
/* Last item connector ends higher */
.simple-toolcall-container:last-child::after,
.simple-timeline-container:last-child::after {
/* Last item: connector shows only upper part */
.toolcall-container:last-child::after {
height: calc(100% - 24px);
top: 0;
bottom: auto;
}
/* Bullet point */
.simple-toolcall-container::before,
.simple-timeline-container::before {
content: '\25cf';
/* AssistantMessage timeline styles */
.assistant-message-container {
position: relative;
padding-left: 30px;
padding-top: 8px;
padding-bottom: 8px;
}
/* AssistantMessage timeline connector */
.assistant-message-container::after {
content: '';
position: absolute;
left: 8px;
padding-top: 2px;
font-size: 10px;
color: var(--app-secondary-foreground);
z-index: 2;
left: 12px;
top: 0;
bottom: 0;
width: 1px;
background-color: var(--app-primary-border-color);
}
/* First item: connector starts from status point position */
.assistant-message-container:first-child::after {
top: 24px;
}
/* Last item: connector shows only upper part */
.assistant-message-container:last-child::after {
height: calc(100% - 24px);
top: 0;
bottom: auto;
}