style(web): update travel request styles
- travel-reimbursement-create-view.css: update travel form styles - travel-request-detail-view.css: update travel detail styles
This commit is contained in:
caoxiaozhu
@@ -115,24 +115,54 @@
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.source-pill {
|
||||
min-height: 38px;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
padding: 0 14px;
|
||||
.assistant-toggle-btn,
|
||||
.session-trash-btn {
|
||||
width: 38px;
|
||||
height: 38px;
|
||||
display: grid;
|
||||
place-items: center;
|
||||
padding: 0;
|
||||
border: 1px solid rgba(248, 113, 113, 0.28);
|
||||
border-radius: 14px;
|
||||
background: rgba(245, 252, 249, 0.95);
|
||||
color: #166534;
|
||||
font-size: 12px;
|
||||
font-weight: 800;
|
||||
border: 1px solid rgba(16, 185, 129, 0.16);
|
||||
box-shadow: 0 8px 16px rgba(148, 163, 184, 0.1);
|
||||
white-space: nowrap;
|
||||
flex: none;
|
||||
}
|
||||
|
||||
.source-pill i {
|
||||
font-size: 14px;
|
||||
.assistant-toggle-btn {
|
||||
border-color: rgba(16, 185, 129, 0.18);
|
||||
background: rgba(245, 252, 249, 0.96);
|
||||
color: #166534;
|
||||
font-size: 16px;
|
||||
box-shadow: 0 8px 18px rgba(16, 185, 129, 0.1);
|
||||
}
|
||||
|
||||
.assistant-toggle-btn:hover:not(:disabled) {
|
||||
background: rgba(236, 253, 245, 0.98);
|
||||
border-color: rgba(16, 185, 129, 0.28);
|
||||
}
|
||||
|
||||
.assistant-toggle-btn:disabled,
|
||||
.assistant-toggle-btn.disabled {
|
||||
opacity: 0.48;
|
||||
cursor: not-allowed;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.session-trash-btn {
|
||||
background: rgba(254, 242, 242, 0.96);
|
||||
color: #dc2626;
|
||||
font-size: 16px;
|
||||
box-shadow: 0 8px 18px rgba(239, 68, 68, 0.12);
|
||||
}
|
||||
|
||||
.session-trash-btn:hover:not(:disabled) {
|
||||
background: rgba(254, 226, 226, 0.98);
|
||||
border-color: rgba(239, 68, 68, 0.34);
|
||||
}
|
||||
|
||||
.session-trash-btn:disabled {
|
||||
opacity: 0.42;
|
||||
cursor: not-allowed;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.close-btn {
|
||||
@@ -150,14 +180,9 @@
|
||||
|
||||
.assistant-layout {
|
||||
min-height: 0;
|
||||
display: grid;
|
||||
grid-template-columns: minmax(0, 1fr);
|
||||
gap: 16px;
|
||||
display: flex;
|
||||
padding: 16px;
|
||||
}
|
||||
|
||||
.assistant-layout.has-insight {
|
||||
grid-template-columns: minmax(0, 1.24fr) clamp(360px, 31vw, 440px);
|
||||
align-items: stretch;
|
||||
}
|
||||
|
||||
.dialog-panel,
|
||||
@@ -175,12 +200,33 @@
|
||||
}
|
||||
|
||||
.dialog-panel {
|
||||
flex: 1 1 auto;
|
||||
display: grid;
|
||||
grid-template-rows: auto minmax(0, 1fr) auto;
|
||||
overflow: hidden;
|
||||
background:
|
||||
radial-gradient(circle at top right, rgba(59, 130, 246, 0.07), transparent 22%),
|
||||
linear-gradient(180deg, rgba(252, 253, 253, 0.88) 0%, rgba(243, 247, 248, 0.84) 100%);
|
||||
transition:
|
||||
transform 320ms cubic-bezier(0.22, 1, 0.36, 1),
|
||||
box-shadow 320ms cubic-bezier(0.22, 1, 0.36, 1);
|
||||
will-change: transform;
|
||||
}
|
||||
|
||||
.insight-panel-shell {
|
||||
flex: none;
|
||||
width: clamp(360px, 31vw, 440px);
|
||||
min-width: 0;
|
||||
margin-left: 16px;
|
||||
overflow: hidden;
|
||||
transition:
|
||||
width 360ms cubic-bezier(0.22, 1, 0.36, 1),
|
||||
margin-left 360ms cubic-bezier(0.22, 1, 0.36, 1);
|
||||
}
|
||||
|
||||
.insight-panel-shell.collapsed {
|
||||
width: 0;
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.dialog-toolbar {
|
||||
@@ -211,6 +257,12 @@
|
||||
color: #059669;
|
||||
}
|
||||
|
||||
.shortcut-chip:disabled {
|
||||
opacity: 0.48;
|
||||
cursor: not-allowed;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.message-list {
|
||||
min-height: 0;
|
||||
display: grid;
|
||||
@@ -438,8 +490,7 @@
|
||||
font-family: inherit;
|
||||
}
|
||||
|
||||
.message-files,
|
||||
.composer-files {
|
||||
.message-files {
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
flex-wrap: wrap;
|
||||
@@ -452,11 +503,13 @@
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
padding: 0 10px;
|
||||
border: 0;
|
||||
border-radius: 999px;
|
||||
background: #f1f5f9;
|
||||
color: #475569;
|
||||
font-size: 12px;
|
||||
font-weight: 700;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.file-chip.active {
|
||||
@@ -466,6 +519,8 @@
|
||||
|
||||
.composer {
|
||||
padding: 0 18px 18px;
|
||||
display: grid;
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
.hidden-file-input {
|
||||
@@ -473,25 +528,165 @@
|
||||
}
|
||||
|
||||
.composer-shell {
|
||||
min-width: 0;
|
||||
border: 1px solid rgba(214, 225, 234, 0.95);
|
||||
border-radius: 22px;
|
||||
border-radius: 20px;
|
||||
background: rgba(255, 255, 255, 0.98);
|
||||
box-shadow:
|
||||
0 14px 28px rgba(226, 232, 240, 0.28),
|
||||
0 10px 22px rgba(226, 232, 240, 0.24),
|
||||
0 1px 4px rgba(15, 23, 42, 0.03);
|
||||
}
|
||||
|
||||
.composer-files-panel {
|
||||
display: grid;
|
||||
gap: 10px;
|
||||
padding: 14px;
|
||||
border: 1px solid rgba(226, 232, 240, 0.9);
|
||||
border-radius: 18px;
|
||||
background: linear-gradient(180deg, rgba(248, 251, 255, 0.92) 0%, rgba(242, 247, 251, 0.78) 100%);
|
||||
}
|
||||
|
||||
.composer-files-head {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.composer-files-head strong {
|
||||
color: #0f172a;
|
||||
font-size: 12px;
|
||||
font-weight: 850;
|
||||
}
|
||||
|
||||
.composer-files-actions {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
flex-wrap: wrap;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.composer-file-link {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 4px;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
background: transparent;
|
||||
color: #2563eb;
|
||||
font-size: 11px;
|
||||
font-weight: 800;
|
||||
}
|
||||
|
||||
.composer-file-link.danger {
|
||||
color: #dc2626;
|
||||
}
|
||||
|
||||
.composer-file-link:disabled {
|
||||
opacity: 0.48;
|
||||
}
|
||||
|
||||
.composer-file-chip-row {
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.composer-file-chip {
|
||||
max-width: min(100%, 280px);
|
||||
}
|
||||
|
||||
.file-chip.summary {
|
||||
border: 1px dashed rgba(96, 165, 250, 0.34);
|
||||
background: rgba(239, 246, 255, 0.92);
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.file-chip-label {
|
||||
min-width: 0;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.file-chip-remove {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
display: grid;
|
||||
place-items: center;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
border-radius: 999px;
|
||||
background: rgba(255, 255, 255, 0.82);
|
||||
color: inherit;
|
||||
flex: none;
|
||||
}
|
||||
|
||||
.file-chip-remove:disabled {
|
||||
opacity: 0.48;
|
||||
}
|
||||
|
||||
.composer-files-expanded {
|
||||
display: grid;
|
||||
gap: 8px;
|
||||
max-height: 176px;
|
||||
overflow-y: auto;
|
||||
padding-right: 2px;
|
||||
}
|
||||
|
||||
.composer-expanded-file {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 10px;
|
||||
padding: 10px 12px;
|
||||
border-radius: 14px;
|
||||
border: 1px solid rgba(219, 230, 240, 0.92);
|
||||
background: rgba(255, 255, 255, 0.88);
|
||||
}
|
||||
|
||||
.composer-expanded-file-copy {
|
||||
min-width: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
color: #334155;
|
||||
}
|
||||
|
||||
.composer-expanded-file-copy span {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
font-size: 12px;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.composer-expanded-file-remove {
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
display: grid;
|
||||
place-items: center;
|
||||
border: 0;
|
||||
border-radius: 10px;
|
||||
background: rgba(248, 250, 252, 0.92);
|
||||
color: #64748b;
|
||||
}
|
||||
|
||||
.composer-expanded-file-remove:disabled {
|
||||
opacity: 0.48;
|
||||
}
|
||||
|
||||
.composer-shell textarea {
|
||||
width: 100%;
|
||||
min-height: 84px;
|
||||
min-height: 20px;
|
||||
resize: none;
|
||||
border: 0;
|
||||
padding: 16px 16px 8px;
|
||||
padding: 11px 14px;
|
||||
background: transparent;
|
||||
color: #0f172a;
|
||||
font-size: 14px;
|
||||
line-height: 1.6;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.composer-shell textarea::placeholder {
|
||||
@@ -506,28 +701,26 @@
|
||||
color: #94a3b8;
|
||||
}
|
||||
|
||||
.composer-foot {
|
||||
.composer-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 12px;
|
||||
padding: 0 14px 14px;
|
||||
}
|
||||
|
||||
.composer-tools {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
align-items: flex-end;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.composer-row .composer-shell {
|
||||
flex: 1 1 auto;
|
||||
}
|
||||
|
||||
.composer-side-btn,
|
||||
.tool-btn,
|
||||
.send-btn {
|
||||
width: 42px;
|
||||
height: 42px;
|
||||
width: 44px;
|
||||
height: 44px;
|
||||
display: grid;
|
||||
place-items: center;
|
||||
border: 0;
|
||||
border-radius: 14px;
|
||||
border-radius: 999px;
|
||||
flex: none;
|
||||
}
|
||||
|
||||
.tool-btn {
|
||||
@@ -543,12 +736,6 @@
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
.composer-tip {
|
||||
color: #94a3b8;
|
||||
font-size: 12px;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.send-btn {
|
||||
background: linear-gradient(135deg, #22c55e, #10b981);
|
||||
color: #fff;
|
||||
@@ -566,9 +753,25 @@
|
||||
position: relative;
|
||||
display: grid;
|
||||
grid-template-rows: auto minmax(0, 1fr);
|
||||
width: clamp(360px, 31vw, 440px);
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
background:
|
||||
linear-gradient(180deg, rgba(239, 245, 243, 0.9) 0%, rgba(231, 238, 236, 0.84) 100%);
|
||||
opacity: 1;
|
||||
transform: translateX(0) scale(1);
|
||||
transform-origin: right center;
|
||||
transition:
|
||||
opacity 260ms cubic-bezier(0.22, 1, 0.36, 1),
|
||||
transform 320ms cubic-bezier(0.22, 1, 0.36, 1),
|
||||
box-shadow 320ms cubic-bezier(0.22, 1, 0.36, 1);
|
||||
will-change: transform, opacity;
|
||||
}
|
||||
|
||||
.insight-panel-shell.collapsed .insight-panel {
|
||||
opacity: 0;
|
||||
transform: translateX(44px) scale(0.985);
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.insight-panel::before {
|
||||
@@ -912,6 +1115,19 @@
|
||||
font-weight: 900;
|
||||
}
|
||||
|
||||
.review-side-head-copy {
|
||||
display: grid;
|
||||
gap: 4px;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.review-side-head-copy p {
|
||||
margin: 0;
|
||||
color: #64748b;
|
||||
font-size: 11px;
|
||||
line-height: 1.55;
|
||||
}
|
||||
|
||||
.review-side-confidence {
|
||||
color: #10b981;
|
||||
font-size: 12px;
|
||||
@@ -1102,6 +1318,225 @@
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.review-document-switch-card {
|
||||
gap: 14px;
|
||||
}
|
||||
|
||||
.review-document-switch-head {
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.review-document-nav {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
padding: 4px;
|
||||
border-radius: 999px;
|
||||
background: rgba(255, 255, 255, 0.92);
|
||||
border: 1px solid rgba(226, 232, 240, 0.92);
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.review-document-nav span {
|
||||
color: #334155;
|
||||
font-size: 11px;
|
||||
font-weight: 850;
|
||||
}
|
||||
|
||||
.review-document-nav-btn {
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
display: grid;
|
||||
place-items: center;
|
||||
border: 0;
|
||||
border-radius: 999px;
|
||||
background: rgba(241, 245, 249, 0.96);
|
||||
color: #334155;
|
||||
}
|
||||
|
||||
.review-document-nav-btn:disabled {
|
||||
opacity: 0.4;
|
||||
}
|
||||
|
||||
.review-document-stage {
|
||||
display: grid;
|
||||
gap: 12px;
|
||||
min-height: 0;
|
||||
}
|
||||
|
||||
.review-document-stage-head {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
justify-content: space-between;
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
.review-document-stage-copy {
|
||||
min-width: 0;
|
||||
display: grid;
|
||||
gap: 6px;
|
||||
}
|
||||
|
||||
.review-document-stage-copy strong {
|
||||
color: #0f172a;
|
||||
font-size: 13px;
|
||||
font-weight: 850;
|
||||
line-height: 1.5;
|
||||
word-break: break-word;
|
||||
}
|
||||
|
||||
.review-document-index-chip {
|
||||
width: fit-content;
|
||||
min-height: 24px;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
padding: 0 10px;
|
||||
border-radius: 999px;
|
||||
background: rgba(236, 253, 245, 0.92);
|
||||
color: #059669;
|
||||
font-size: 11px;
|
||||
font-weight: 850;
|
||||
}
|
||||
|
||||
.review-document-meta-chip-row {
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.review-document-meta-chip {
|
||||
min-height: 26px;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
padding: 0 10px;
|
||||
border-radius: 999px;
|
||||
background: rgba(248, 250, 252, 0.94);
|
||||
border: 1px solid rgba(226, 232, 240, 0.92);
|
||||
color: #475569;
|
||||
font-size: 11px;
|
||||
font-weight: 800;
|
||||
}
|
||||
|
||||
.review-document-meta-chip.confidence {
|
||||
background: rgba(236, 253, 245, 0.92);
|
||||
color: #047857;
|
||||
border-color: rgba(167, 243, 208, 0.92);
|
||||
}
|
||||
|
||||
.review-document-scroll {
|
||||
display: grid;
|
||||
gap: 12px;
|
||||
max-height: 430px;
|
||||
overflow-y: auto;
|
||||
padding-right: 4px;
|
||||
}
|
||||
|
||||
.review-document-preview-card {
|
||||
min-height: 168px;
|
||||
overflow: hidden;
|
||||
border-radius: 16px;
|
||||
border: 1px solid rgba(226, 232, 240, 0.94);
|
||||
background: linear-gradient(180deg, #f8fafc 0%, #eef2f7 100%);
|
||||
}
|
||||
|
||||
.review-document-preview-card.image img {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 188px;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
.review-document-preview-placeholder {
|
||||
min-height: 168px;
|
||||
display: grid;
|
||||
place-items: center;
|
||||
gap: 6px;
|
||||
padding: 18px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.review-document-preview-placeholder i {
|
||||
color: #64748b;
|
||||
font-size: 34px;
|
||||
}
|
||||
|
||||
.review-document-preview-placeholder strong {
|
||||
color: #0f172a;
|
||||
font-size: 13px;
|
||||
font-weight: 850;
|
||||
}
|
||||
|
||||
.review-document-preview-placeholder p {
|
||||
margin: 0;
|
||||
color: #64748b;
|
||||
font-size: 12px;
|
||||
line-height: 1.65;
|
||||
}
|
||||
|
||||
.review-document-edit-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.review-document-edit-field {
|
||||
display: grid;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.review-document-edit-field span {
|
||||
color: #334155;
|
||||
font-size: 12px;
|
||||
font-weight: 800;
|
||||
}
|
||||
|
||||
.review-document-edit-field input,
|
||||
.review-document-edit-field textarea {
|
||||
width: 100%;
|
||||
border: 1px solid rgba(219, 230, 240, 0.96);
|
||||
border-radius: 14px;
|
||||
background: rgba(255, 255, 255, 0.96);
|
||||
color: #0f172a;
|
||||
font-size: 13px;
|
||||
line-height: 1.6;
|
||||
padding: 10px 12px;
|
||||
resize: vertical;
|
||||
}
|
||||
|
||||
.review-document-edit-field input:focus,
|
||||
.review-document-edit-field textarea:focus {
|
||||
outline: none;
|
||||
border-color: rgba(16, 185, 129, 0.36);
|
||||
box-shadow: 0 0 0 4px rgba(16, 185, 129, 0.08);
|
||||
}
|
||||
|
||||
.review-document-edit-field textarea {
|
||||
min-height: 88px;
|
||||
}
|
||||
|
||||
.review-document-warning-list {
|
||||
display: grid;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.review-document-warning-item {
|
||||
display: grid;
|
||||
grid-template-columns: 18px minmax(0, 1fr);
|
||||
gap: 8px;
|
||||
align-items: start;
|
||||
padding: 10px 12px;
|
||||
border-radius: 14px;
|
||||
background: rgba(255, 247, 237, 0.92);
|
||||
border: 1px solid rgba(253, 186, 116, 0.6);
|
||||
color: #c2410c;
|
||||
font-size: 12px;
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
.review-side-empty.compact {
|
||||
padding: 12px;
|
||||
}
|
||||
|
||||
.insight-card {
|
||||
padding: 16px;
|
||||
border: 1px solid #e7eef6;
|
||||
@@ -1128,6 +1563,83 @@
|
||||
font-weight: 850;
|
||||
}
|
||||
|
||||
.knowledge-question-list {
|
||||
display: grid;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.knowledge-question-btn {
|
||||
width: 100%;
|
||||
display: grid;
|
||||
grid-template-columns: 28px minmax(0, 1fr) 18px;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
padding: 12px 14px;
|
||||
border: 1px solid rgba(226, 232, 240, 0.92);
|
||||
border-radius: 16px;
|
||||
background: rgba(248, 250, 252, 0.86);
|
||||
color: #1e293b;
|
||||
text-align: left;
|
||||
transition: border-color 0.18s ease, background 0.18s ease, transform 0.18s ease;
|
||||
}
|
||||
|
||||
.knowledge-question-btn:hover:not(:disabled) {
|
||||
border-color: rgba(16, 185, 129, 0.3);
|
||||
background: rgba(240, 253, 244, 0.9);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.knowledge-question-btn:disabled {
|
||||
opacity: 0.48;
|
||||
cursor: not-allowed;
|
||||
transform: none;
|
||||
}
|
||||
|
||||
.knowledge-question-btn i {
|
||||
justify-self: end;
|
||||
color: #059669;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.knowledge-question-index {
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-radius: 999px;
|
||||
background: rgba(226, 232, 240, 0.9);
|
||||
color: #0f172a;
|
||||
font-size: 12px;
|
||||
font-weight: 850;
|
||||
}
|
||||
|
||||
.knowledge-question-index.gold {
|
||||
background: linear-gradient(135deg, #fbbf24, #f59e0b);
|
||||
color: #7c2d12;
|
||||
box-shadow: 0 6px 14px rgba(245, 158, 11, 0.22);
|
||||
}
|
||||
|
||||
.knowledge-question-index.silver {
|
||||
background: linear-gradient(135deg, #e2e8f0, #cbd5e1);
|
||||
color: #334155;
|
||||
box-shadow: 0 6px 14px rgba(148, 163, 184, 0.18);
|
||||
}
|
||||
|
||||
.knowledge-question-index.bronze {
|
||||
background: linear-gradient(135deg, #fdba74, #ea580c);
|
||||
color: #7c2d12;
|
||||
box-shadow: 0 6px 14px rgba(234, 88, 12, 0.18);
|
||||
}
|
||||
|
||||
.knowledge-question-copy {
|
||||
min-width: 0;
|
||||
color: #334155;
|
||||
font-size: 13px;
|
||||
font-weight: 750;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.status-pill {
|
||||
min-height: 28px;
|
||||
display: inline-flex;
|
||||
@@ -2250,6 +2762,64 @@
|
||||
padding: 0 24px 24px;
|
||||
}
|
||||
|
||||
.review-preview-modal {
|
||||
width: min(980px, calc(100vw - 40px));
|
||||
max-height: min(92vh, calc(100vh - 32px));
|
||||
display: grid;
|
||||
grid-template-rows: auto minmax(0, 1fr);
|
||||
overflow: hidden;
|
||||
border-radius: 24px;
|
||||
background:
|
||||
radial-gradient(circle at top right, rgba(16, 185, 129, 0.08), transparent 28%),
|
||||
linear-gradient(180deg, #fbfdff 0%, #f6f9fc 100%);
|
||||
box-shadow:
|
||||
0 24px 80px rgba(15, 23, 42, 0.22),
|
||||
0 2px 12px rgba(15, 23, 42, 0.08);
|
||||
border: 1px solid #e7eef6;
|
||||
}
|
||||
|
||||
.review-preview-head {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
justify-content: space-between;
|
||||
gap: 16px;
|
||||
padding: 22px 24px 18px;
|
||||
border-bottom: 1px solid #eef2f7;
|
||||
}
|
||||
|
||||
.review-preview-head h3 {
|
||||
margin-top: 12px;
|
||||
color: #0f172a;
|
||||
font-size: 22px;
|
||||
font-weight: 900;
|
||||
line-height: 1.35;
|
||||
}
|
||||
|
||||
.review-preview-body {
|
||||
min-height: 0;
|
||||
display: grid;
|
||||
place-items: center;
|
||||
padding: 18px;
|
||||
background: rgba(248, 250, 252, 0.88);
|
||||
}
|
||||
|
||||
.review-preview-body.image img {
|
||||
max-width: 100%;
|
||||
max-height: calc(92vh - 170px);
|
||||
display: block;
|
||||
border-radius: 20px;
|
||||
object-fit: contain;
|
||||
box-shadow: 0 16px 34px rgba(148, 163, 184, 0.26);
|
||||
}
|
||||
|
||||
.review-preview-body.pdf iframe {
|
||||
width: 100%;
|
||||
height: min(78vh, 820px);
|
||||
border: 0;
|
||||
border-radius: 18px;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.welcome-grid {
|
||||
display: grid;
|
||||
gap: 12px;
|
||||
@@ -2303,20 +2873,13 @@
|
||||
transform: translateY(8px);
|
||||
}
|
||||
|
||||
.insight-panel-enter-active,
|
||||
.insight-panel-leave-active {
|
||||
transition: opacity 220ms ease, transform 240ms ease;
|
||||
}
|
||||
|
||||
.insight-panel-enter-from,
|
||||
.insight-panel-leave-to {
|
||||
opacity: 0;
|
||||
transform: translateX(18px);
|
||||
}
|
||||
|
||||
@media (max-width: 1366px), (max-height: 780px) {
|
||||
.assistant-layout.has-insight {
|
||||
grid-template-columns: minmax(0, 1.34fr) 348px;
|
||||
.insight-panel-shell {
|
||||
width: 348px;
|
||||
}
|
||||
|
||||
.insight-panel {
|
||||
width: 348px;
|
||||
}
|
||||
|
||||
.review-side-grid.compact {
|
||||
@@ -2326,12 +2889,32 @@
|
||||
|
||||
@media (max-width: 1280px) {
|
||||
.assistant-layout {
|
||||
grid-template-columns: 1fr;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.insight-panel-shell {
|
||||
width: 100%;
|
||||
margin-left: 0;
|
||||
max-height: 720px;
|
||||
transition:
|
||||
max-height 320ms cubic-bezier(0.22, 1, 0.36, 1),
|
||||
opacity 240ms cubic-bezier(0.22, 1, 0.36, 1),
|
||||
transform 280ms cubic-bezier(0.22, 1, 0.36, 1);
|
||||
}
|
||||
|
||||
.insight-panel-shell.collapsed {
|
||||
width: 100%;
|
||||
max-height: 0;
|
||||
}
|
||||
|
||||
.insight-panel {
|
||||
width: 100%;
|
||||
min-height: 320px;
|
||||
}
|
||||
|
||||
.insight-panel-shell.collapsed .insight-panel {
|
||||
transform: translateY(-12px);
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 760px) {
|
||||
@@ -2358,15 +2941,28 @@
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.source-pill {
|
||||
min-height: 40px;
|
||||
padding: 0 14px;
|
||||
.assistant-toggle-btn,
|
||||
.session-trash-btn,
|
||||
.assistant-header-actions .close-btn {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
.assistant-layout {
|
||||
padding: 14px;
|
||||
}
|
||||
|
||||
.composer-row {
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.composer-side-btn,
|
||||
.tool-btn,
|
||||
.send-btn {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
.dialog-toolbar {
|
||||
padding: 16px 16px 12px;
|
||||
}
|
||||
@@ -2398,8 +2994,17 @@
|
||||
padding: 0 16px 16px;
|
||||
}
|
||||
|
||||
.composer-foot {
|
||||
align-items: flex-end;
|
||||
.composer-files-head,
|
||||
.review-document-stage-head,
|
||||
.review-document-switch-head {
|
||||
align-items: flex-start;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.composer-files-actions,
|
||||
.review-document-nav {
|
||||
width: 100%;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.review-card-head {
|
||||
@@ -2411,7 +3016,8 @@
|
||||
}
|
||||
|
||||
.review-side-grid,
|
||||
.review-side-category-grid {
|
||||
.review-side-category-grid,
|
||||
.review-document-edit-grid {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
@@ -2447,6 +3053,10 @@
|
||||
width: calc(100vw - 24px);
|
||||
}
|
||||
|
||||
.review-preview-modal {
|
||||
width: calc(100vw - 24px);
|
||||
}
|
||||
|
||||
.review-edit-form {
|
||||
grid-template-columns: 1fr;
|
||||
padding: 18px;
|
||||
|
||||
@@ -38,7 +38,7 @@
|
||||
|
||||
.hero-topline {
|
||||
display: grid;
|
||||
grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
|
||||
grid-template-columns: minmax(0, 1.18fr) minmax(0, 1.12fr);
|
||||
gap: 18px;
|
||||
align-items: center;
|
||||
padding-bottom: 14px;
|
||||
@@ -105,7 +105,7 @@
|
||||
|
||||
.applicant-meta {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, minmax(0, 1fr));
|
||||
grid-template-columns: repeat(3, minmax(0, 1fr));
|
||||
gap: 8px 14px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
@@ -136,7 +136,7 @@
|
||||
|
||||
.hero-stat-strip {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, minmax(0, 1fr));
|
||||
grid-template-columns: repeat(4, minmax(0, 1fr));
|
||||
gap: 0;
|
||||
overflow: hidden;
|
||||
border: 1px solid #e5eaf0;
|
||||
@@ -361,8 +361,17 @@
|
||||
}
|
||||
|
||||
.progress-step.done::after { opacity: 1; }
|
||||
.progress-step.current::after {
|
||||
right: 50%;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.progress-step:first-child::before,
|
||||
.progress-step:first-child::after { left: 50%; }
|
||||
.progress-step:first-child.done::after { left: 50%; }
|
||||
.progress-step:first-child.current::after {
|
||||
left: 50%;
|
||||
right: 50%;
|
||||
}
|
||||
.progress-step:last-child::before,
|
||||
.progress-step:last-child::after { right: 50%; }
|
||||
|
||||
|
||||
Reference in New Issue
Block a user