Files
TakeoutSaaS.TenantUI/apps/web-antd/src/views/finance/invoice/styles/drawer.less

136 lines
2.0 KiB
Plaintext

/**
* 文件职责:发票抽屉样式。
*/
.page-finance-invoice {
.ant-drawer {
.ant-drawer-header {
padding: 14px 18px;
border-bottom: 1px solid #f0f0f0;
}
.ant-drawer-body {
padding: 16px 20px;
}
.ant-drawer-footer {
padding: 12px 20px;
border-top: 1px solid #f0f0f0;
}
}
}
.fi-section {
margin-bottom: 20px;
}
.fi-section-title {
padding-left: 10px;
margin-bottom: 14px;
font-size: 14px;
font-weight: 600;
color: rgb(0 0 0 / 88%);
border-left: 3px solid #1677ff;
}
.fi-info-grid {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 10px 20px;
font-size: 13px;
.label {
color: rgb(0 0 0 / 45%);
}
.full {
grid-column: 1 / -1;
}
}
.fi-amount-strong {
font-weight: 600;
color: rgb(0 0 0 / 88%);
}
.fi-drawer-footer {
display: flex;
gap: 8px;
justify-content: flex-end;
}
.fi-timeline {
position: relative;
padding-left: 22px;
}
.fi-timeline-item {
position: relative;
display: flex;
gap: 8px;
align-items: center;
padding-bottom: 18px;
font-size: 13px;
&::before {
position: absolute;
top: 5px;
left: -22px;
width: 10px;
height: 10px;
content: '';
background: #1677ff;
border: 2px solid #d6e4ff;
border-radius: 50%;
}
&::after {
position: absolute;
top: 17px;
left: -18px;
width: 2px;
height: calc(100% - 12px);
content: '';
background: #e8e8e8;
}
&:last-child {
padding-bottom: 0;
&::after {
display: none;
}
}
.text {
font-weight: 500;
color: rgb(0 0 0 / 88%);
}
.time {
color: rgb(0 0 0 / 45%);
}
}
.fi-remark-box {
display: flex;
flex-direction: column;
gap: 8px;
padding: 10px 14px;
font-size: 13px;
color: rgb(0 0 0 / 65%);
background: #fafafa;
border: 1px solid #f0f0f0;
border-radius: 8px;
}
.fi-remark-line {
display: flex;
gap: 8px;
.label {
width: 70px;
flex-shrink: 0;
color: rgb(0 0 0 / 45%);
}
}