refactor(webview): Refactoring Input Form and Timeline Components

This commit is contained in:
yiliang114
2025-12-02 01:29:33 +08:00
parent ed0d5f67db
commit 90fc53a9df
11 changed files with 380 additions and 463 deletions

View File

@@ -4,7 +4,7 @@
* SPDX-License-Identifier: Apache-2.0
*
* AssistantMessage Component Styles
* Only pseudo-elements (::before) for bullet points
* Pseudo-elements (::before) for bullet points and (::after) for timeline connectors
*/
/* Bullet point indicator using ::before pseudo-element */
@@ -58,3 +58,32 @@
opacity: 0.5;
}
}
/* Timeline connector line using ::after pseudo-element */
/* Default: full height connector for middle items */
.assistant-message-container::after {
content: "";
position: absolute;
left: 12px;
top: 0;
bottom: 0;
width: 1px;
background-color: var(--app-primary-border-color);
opacity: 0.4;
z-index: 0;
}
/* First item: connector starts from bullet point position */
.assistant-message-container:first-child::after {
top: 12px; /* Start from around the bullet point position (8px padding + 4px offset) */
}
/* Last item: connector ends at bullet point position */
.assistant-message-container:last-child::after {
bottom: 12px; /* End at around the bullet point position */
}
/* First and last are the same item (single item): no connector */
.assistant-message-container:first-child:last-child::after {
content: none;
}