470 lines
8.7 KiB
CSS
470 lines
8.7 KiB
CSS
html,
|
|
body {
|
|
margin: 0;
|
|
}
|
|
|
|
.app-layout {
|
|
height: 100vh;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.app-header {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
padding: 0 var(--ant-padding-lg);
|
|
background: var(--ant-color-bg-container);
|
|
border-bottom: 1px solid var(--ant-color-border-secondary);
|
|
}
|
|
|
|
.app-header-left {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: var(--ant-margin-lg);
|
|
}
|
|
|
|
.app-header-right {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: var(--ant-margin-sm);
|
|
}
|
|
|
|
.app-brand-group {
|
|
display: inline-flex;
|
|
align-items: baseline;
|
|
gap: var(--ant-margin-sm);
|
|
}
|
|
|
|
.app-brand {
|
|
margin: 0;
|
|
color: var(--ant-color-text);
|
|
font-size: calc(var(--ant-font-size-heading-1) - 6px);
|
|
font-weight: 700;
|
|
line-height: 1;
|
|
}
|
|
|
|
.app-version {
|
|
color: var(--ant-color-text-quaternary);
|
|
font-size: var(--ant-font-size-sm);
|
|
font-weight: 400;
|
|
line-height: 1;
|
|
}
|
|
|
|
.app-content {
|
|
overflow: auto;
|
|
padding: var(--ant-padding) var(--ant-padding-lg);
|
|
}
|
|
|
|
.app-chat-page {
|
|
display: flex;
|
|
height: 100%;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.app-console-title {
|
|
color: var(--ant-color-text-secondary);
|
|
font-size: var(--ant-font-size);
|
|
font-weight: 400;
|
|
line-height: 1;
|
|
}
|
|
|
|
.app-unavailable {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
min-height: 60vh;
|
|
}
|
|
|
|
.app-loading {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
min-height: 60vh;
|
|
}
|
|
|
|
.ant-layout-sider {
|
|
border-right: 1px solid var(--ant-color-border-secondary);
|
|
}
|
|
|
|
.ant-layout-sider-trigger {
|
|
border-right: 1px solid var(--ant-color-border-secondary);
|
|
}
|
|
|
|
.ant-layout-sider .ant-menu.ant-menu-root {
|
|
border-inline-end: none;
|
|
}
|
|
|
|
.app-sidebar-list {
|
|
display: flex;
|
|
flex-direction: column;
|
|
border: 1px solid var(--ant-color-border-secondary);
|
|
border-radius: var(--ant-border-radius-lg);
|
|
background: var(--ant-color-bg-container);
|
|
}
|
|
|
|
.app-sidebar-list-header {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: var(--ant-margin-sm);
|
|
padding: var(--ant-padding-sm);
|
|
border-bottom: 1px solid var(--ant-color-border-secondary);
|
|
}
|
|
|
|
.app-sidebar-list-body {
|
|
display: flex;
|
|
flex: 1;
|
|
flex-direction: column;
|
|
min-height: 0;
|
|
}
|
|
|
|
.app-sidebar-list-item {
|
|
border: none;
|
|
margin: var(--ant-margin-xxs) var(--ant-margin-xxs);
|
|
padding: var(--ant-padding-xs) var(--ant-padding-sm);
|
|
border-radius: var(--ant-border-radius-lg);
|
|
cursor: pointer;
|
|
transition: background 0.15s ease;
|
|
}
|
|
|
|
.app-sidebar-list-item:hover {
|
|
background: var(--ant-color-bg-text-hover);
|
|
}
|
|
|
|
.app-sidebar-list-item--selected {
|
|
background: var(--ant-color-primary);
|
|
color: var(--ant-color-text-light-solid);
|
|
}
|
|
|
|
.app-sidebar-list-item--selected .ant-typography {
|
|
color: var(--ant-color-text-light-solid);
|
|
}
|
|
|
|
.app-sidebar-list-item--selected:hover {
|
|
background: var(--ant-color-primary);
|
|
}
|
|
|
|
.app-sidebar-item-actions {
|
|
opacity: 0;
|
|
transition: opacity 0.15s ease;
|
|
}
|
|
|
|
.app-sidebar-list-item:hover .app-sidebar-item-actions {
|
|
opacity: 1;
|
|
}
|
|
|
|
.app-sidebar-group {
|
|
margin-top: var(--ant-margin-xs);
|
|
}
|
|
|
|
.app-sidebar-group-header {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: var(--ant-margin-xxs);
|
|
padding: var(--ant-padding-xs) var(--ant-padding-xs);
|
|
cursor: pointer;
|
|
user-select: none;
|
|
border-radius: var(--ant-border-radius-sm);
|
|
transition: background 0.15s ease;
|
|
}
|
|
|
|
.app-sidebar-group-header:hover {
|
|
background: var(--ant-color-fill-tertiary);
|
|
}
|
|
|
|
.app-sidebar-group-arrow {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
font-size: var(--ant-font-size-sm);
|
|
color: var(--ant-color-text-quaternary);
|
|
width: 14px;
|
|
}
|
|
|
|
.app-sidebar-group-label {
|
|
font-size: var(--ant-font-size-sm);
|
|
font-weight: 500;
|
|
}
|
|
|
|
.app-sidebar-group-count {
|
|
font-size: var(--ant-font-size-sm);
|
|
}
|
|
|
|
.app-chat-panel {
|
|
display: flex;
|
|
flex: 1;
|
|
flex-direction: column;
|
|
min-height: 0;
|
|
min-width: 0;
|
|
position: relative;
|
|
}
|
|
|
|
.chat-welcome-area {
|
|
display: flex;
|
|
flex: 1;
|
|
align-items: center;
|
|
justify-content: center;
|
|
padding: var(--ant-padding-xl);
|
|
}
|
|
|
|
.app-chat-panel-loading {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
flex: 1;
|
|
}
|
|
|
|
.chat-sender-area {
|
|
flex-shrink: 0;
|
|
margin-left: var(--ant-padding-sm);
|
|
margin-top: var(--ant-padding-sm);
|
|
}
|
|
|
|
.message-body {
|
|
margin-top: 8px;
|
|
}
|
|
|
|
.chat-scroll-area {
|
|
flex: 1;
|
|
min-height: 0;
|
|
overflow-anchor: auto;
|
|
margin-left: var(--ant-padding-sm);
|
|
border-radius: var(--ant-border-radius-lg);
|
|
height: 100%;
|
|
}
|
|
|
|
.chat-loading-indicator {
|
|
padding: 8px;
|
|
}
|
|
|
|
.message-body-text {
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
.step-divider {
|
|
margin: 4px 0;
|
|
}
|
|
|
|
/* 工具调用参数 section */
|
|
.tool-call-section {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: var(--ant-margin-xxs);
|
|
}
|
|
|
|
.msg-title-ai {
|
|
color: var(--ant-color-primary);
|
|
}
|
|
|
|
.part-body {
|
|
padding: 0 var(--ant-padding-sm);
|
|
}
|
|
|
|
.reasoning-content {
|
|
font-size: var(--ant-font-size-sm);
|
|
color: var(--ant-color-text-secondary);
|
|
}
|
|
|
|
.icon-primary {
|
|
color: var(--ant-color-primary);
|
|
}
|
|
|
|
.icon-success {
|
|
color: var(--ant-color-success);
|
|
}
|
|
|
|
.icon-error {
|
|
color: var(--ant-color-error);
|
|
}
|
|
|
|
.welcome-icon {
|
|
color: var(--ant-color-primary);
|
|
font-size: 48px;
|
|
}
|
|
|
|
.welcome-title {
|
|
margin: 0;
|
|
}
|
|
|
|
.chat-model-select {
|
|
width: 180px;
|
|
}
|
|
|
|
.chat-sender-box {
|
|
background: var(--ant-color-bg-container);
|
|
}
|
|
|
|
.card-extra-actions .btn-dimmed,
|
|
.code-block-header .ant-btn.btn-dimmed {
|
|
color: var(--ant-color-text-quaternary);
|
|
}
|
|
|
|
.card-extra-actions .btn-dimmed:hover,
|
|
.code-block-header .ant-btn.btn-dimmed:hover {
|
|
color: var(--ant-color-text-secondary);
|
|
}
|
|
|
|
.chat-scroll-bottom-btn {
|
|
position: absolute;
|
|
bottom: 140px;
|
|
left: 50%;
|
|
transform: translateX(-50%);
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
z-index: 10;
|
|
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
|
|
}
|
|
|
|
.app-page-flex {
|
|
flex: 1;
|
|
}
|
|
|
|
.os-theme-custom {
|
|
--os-size: 8px;
|
|
--os-padding-perpendicular: 2px;
|
|
--os-padding-axis: 2px;
|
|
--os-track-border-radius: 10px;
|
|
--os-handle-border-radius: 10px;
|
|
--os-handle-bg: var(--ant-color-border-secondary);
|
|
--os-handle-bg-hover: var(--ant-color-text-quaternary);
|
|
--os-handle-bg-active: var(--ant-color-text-tertiary);
|
|
--os-handle-min-size: 33px;
|
|
--os-handle-max-size: none;
|
|
--os-handle-interactive-area-offset: 4px;
|
|
}
|
|
|
|
.app-inbox-page {
|
|
display: flex;
|
|
height: 100%;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.app-inbox-content {
|
|
display: flex;
|
|
flex: 1;
|
|
flex-direction: column;
|
|
min-height: 0;
|
|
min-width: 0;
|
|
padding: var(--ant-padding-xl);
|
|
overflow-y: auto;
|
|
}
|
|
|
|
.app-inbox-datepicker {
|
|
width: 100%;
|
|
}
|
|
|
|
.material-item-right {
|
|
position: relative;
|
|
display: inline-flex;
|
|
align-items: center;
|
|
flex-shrink: 0;
|
|
}
|
|
|
|
.material-item-tag,
|
|
.material-item-actions {
|
|
transition: opacity 0.15s ease;
|
|
}
|
|
|
|
.material-item-tag {
|
|
opacity: 1;
|
|
}
|
|
|
|
.material-item-actions {
|
|
position: absolute;
|
|
top: 50%;
|
|
right: 0;
|
|
transform: translateY(-50%);
|
|
opacity: 0;
|
|
}
|
|
|
|
.app-sidebar-list-item:hover .material-item-tag {
|
|
opacity: 0;
|
|
}
|
|
|
|
.app-sidebar-list-item:hover .material-item-actions {
|
|
opacity: 1;
|
|
}
|
|
|
|
.app-inbox-filter-count {
|
|
margin-left: 4px;
|
|
font-size: var(--ant-font-size-sm);
|
|
}
|
|
|
|
/* Markdown 代码块 */
|
|
.code-block {
|
|
margin: var(--ant-margin-sm) 0;
|
|
border: 1px solid var(--ant-color-border-secondary);
|
|
border-radius: var(--ant-border-radius-lg);
|
|
overflow: hidden;
|
|
font-family: var(--ant-font-family-code, monospace);
|
|
font-size: var(--ant-font-size-sm);
|
|
}
|
|
|
|
.code-block-header {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
padding: var(--ant-padding-xxs) var(--ant-padding-sm);
|
|
background: var(--ant-color-bg-container);
|
|
border-bottom: 1px solid var(--ant-color-border-secondary);
|
|
}
|
|
|
|
.code-block-lang {
|
|
color: var(--ant-color-text-quaternary);
|
|
font-size: var(--ant-font-size-xs);
|
|
text-transform: lowercase;
|
|
}
|
|
|
|
.code-block-body {
|
|
margin: 0;
|
|
}
|
|
|
|
.code-block-body > pre {
|
|
padding: var(--ant-padding-sm);
|
|
margin: 0;
|
|
overflow-x: auto;
|
|
}
|
|
|
|
.code-block-body code {
|
|
font-family: inherit;
|
|
font-size: inherit;
|
|
}
|
|
|
|
/* Markdown 表格 */
|
|
.markdown-table {
|
|
width: 100%;
|
|
margin: var(--ant-margin-sm) 0;
|
|
border-collapse: separate;
|
|
border-spacing: 0;
|
|
border: 1px solid var(--ant-color-border-secondary);
|
|
border-radius: var(--ant-border-radius-lg);
|
|
overflow: hidden;
|
|
font-size: var(--ant-font-size);
|
|
}
|
|
|
|
.markdown-table th,
|
|
.markdown-table td {
|
|
padding: var(--ant-padding-xs) var(--ant-padding-sm);
|
|
border-bottom: 1px solid var(--ant-color-border-secondary);
|
|
text-align: left;
|
|
}
|
|
|
|
.markdown-table thead th {
|
|
background: var(--ant-color-bg-container);
|
|
color: var(--ant-color-text);
|
|
font-weight: 600;
|
|
border-bottom: 1px solid var(--ant-color-border-secondary);
|
|
}
|
|
|
|
.markdown-table tbody tr:last-child td {
|
|
border-bottom: none;
|
|
}
|
|
|
|
.markdown-table tbody tr:hover td {
|
|
background: var(--ant-color-fill-quaternary);
|
|
}
|
|
|
|
/* 设置页表单:最后一项无底边距 */
|
|
.settings-form .ant-form-item:last-child {
|
|
margin-bottom: 0;
|
|
}
|