YG-Soft/X-Financial
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style(web): update travel reimbursement create view styles

Browse Source 
- travel-reimbursement-create-view.css: update travel form styles
This commit is contained in:
caoxiaozhu
2026-05-13 15:35:53 +00:00
parent 68a3907920
commit 63c94da216
1 changed files with 231 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

231
web/src/assets/styles/views/travel-reimbursement-create-view.css
View File

@@ -399,6 +399,237 @@
font-weight: 850; font-weight: 850;
} }
.expense-query-block {
gap: 10px;
}
.expense-query-window-label {
margin: -4px 0 0;
color: #64748b;
font-size: 11px;
line-height: 1.5;
}
.expense-query-summary-row {
display: flex;
flex-wrap: wrap;
gap: 6px;
}
.expense-query-summary-chip {
min-height: 24px;
display: inline-flex;
align-items: center;
padding: 0 10px;
border-radius: 999px;
font-size: 11px;
font-weight: 800;
background: #eef2ff;
color: #3730a3;
}
.expense-query-summary-chip.draft {
background: #fef3c7;
color: #b45309;
}
.expense-query-summary-chip.in_progress {
background: #dbeafe;
color: #1d4ed8;
}
.expense-query-summary-chip.completed {
background: #dcfce7;
color: #15803d;
}
.expense-query-summary-chip.other {
background: #f1f5f9;
color: #475569;
}
.expense-query-record-list {
display: grid;
gap: 8px;
}
.expense-query-record-list.compact .expense-query-record-card {
width: 100%;
display: flex;
align-items: center;
justify-content: space-between;
gap: 10px;
padding: 10px 12px;
border: 1px solid #dbe4ee;
border-radius: 14px;
background: #fbfdff;
cursor: pointer;
font: inherit;
text-align: left;
transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}
.expense-query-record-list.compact .expense-query-record-card:hover {
transform: translateY(-1px);
border-color: #bfdbfe;
box-shadow: 0 8px 18px rgba(148, 163, 184, 0.12);
}
.expense-query-record-card > i {
color: #94a3b8;
font-size: 16px;
}
.expense-query-record-main {
min-width: 0;
display: grid;
gap: 5px;
flex: 1;
}
.expense-query-record-top {
display: flex;
align-items: center;
justify-content: space-between;
gap: 10px;
}
.expense-query-record-top strong {
min-width: 0;
color: #0f172a;
font-size: 12px;
font-weight: 850;
}
.expense-query-record-top strong,
.expense-query-record-card p,
.expense-query-record-meta span {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.expense-query-record-status {
flex-shrink: 0;
min-height: 22px;
display: inline-flex;
align-items: center;
padding: 0 8px;
border-radius: 999px;
font-size: 10px;
font-weight: 800;
background: #f1f5f9;
color: #475569;
}
.expense-query-record-status.draft {
background: #fef3c7;
color: #b45309;
}
.expense-query-record-status.in_progress {
background: #dbeafe;
color: #1d4ed8;
}
.expense-query-record-status.completed {
background: #dcfce7;
color: #15803d;
}
.expense-query-record-card p {
margin: 0;
color: #334155;
font-size: 12px;
}
.expense-query-record-meta {
display: flex;
flex-wrap: wrap;
gap: 4px 10px;
color: #64748b;
font-size: 11px;
font-weight: 700;
}
.expense-query-pager {
display: flex;
align-items: center;
justify-content: center;
gap: 10px;
margin-top: 2px;
}
.expense-query-pager-btn {
width: 28px;
height: 28px;
display: inline-flex;
align-items: center;
justify-content: center;
border: 1px solid #dbe4ee;
border-radius: 999px;
background: #fff;
color: #475569;
transition: border-color 0.2s ease, color 0.2s ease, background 0.2s ease;
}
.expense-query-pager-btn:disabled {
opacity: 0.4;
cursor: not-allowed;
}
.expense-query-pager-btn:not(:disabled):hover {
border-color: #bfdbfe;
color: #2563eb;
background: #f8fbff;
}
.expense-query-pager-dots {
display: inline-flex;
align-items: center;
gap: 8px;
}
.expense-query-pager-dot {
width: 8px;
height: 8px;
padding: 0;
border: 0;
border-radius: 999px;
background: #cbd5e1;
transition: transform 0.2s ease, background 0.2s ease;
}
.expense-query-pager-dot.active {
background: #2563eb;
transform: scale(1.15);
}
.expense-query-empty {
min-height: 52px;
display: flex;
align-items: center;
gap: 10px;
padding: 0 14px;
border: 1px dashed #dbe4ee;
border-radius: 16px;
color: #64748b;
font-size: 12px;
font-weight: 700;
}
.expense-query-empty i {
font-size: 18px;
color: #94a3b8;
}
.expense-query-hint {
margin: 0;
color: #64748b;
font-size: 11px;
line-height: 1.6;
}
.message-detail-chip-row, .message-detail-chip-row,
.capability-chip-row { .capability-chip-row {
display: flex; display: flex;