50 lines
1.8 KiB
CSS
50 lines
1.8 KiB
CSS
|
|
.page { display:flex; flex-direction: column; height: 100vh;
|
|
}
|
|
.seg { display:flex; background:#fff;
|
|
}
|
|
.seg-item { flex:1; padding: 0.6875rem 0; text-align:center; color:#666;
|
|
}
|
|
.seg-item.active { color:#18b566; font-weight: 600;
|
|
}
|
|
.content { display:flex; flex:1; min-height: 0;
|
|
}
|
|
.biz-tabs { width: 3.75rem; background:#eef6ff; display:flex; flex-direction: column;
|
|
}
|
|
.biz { flex:0 0 3.75rem; display:flex; align-items:center; justify-content:center; color:#4aa3d6;
|
|
}
|
|
.biz.active { background:#3ac1c9; color:#fff; border-radius: 0 0.5rem 0.5rem 0;
|
|
}
|
|
.panel { flex:1; display:flex; flex-direction: column; background:#fff; margin: 0.5rem; border-radius: 0.5rem; padding: 0.375rem;
|
|
}
|
|
.toolbar { display:flex; align-items: center; gap: 0.375rem; padding: 0.25rem 0.1875rem;
|
|
}
|
|
.search { flex:1;
|
|
}
|
|
.search-input { width:100%; background:#f6f6f6; border-radius: 0.375rem; padding: 0.375rem;
|
|
}
|
|
.period { color:#999; font-size: 0.75rem; padding: 0 0.1875rem;
|
|
}
|
|
.total { color:#18b566; font-weight: 700; padding: 0.1875rem 0.1875rem 0.375rem;
|
|
}
|
|
.list { flex:1;
|
|
}
|
|
.item { display:flex; align-items:center; padding: 0.625rem 0.3125rem; border-bottom: 0.03125rem solid #f1f1f1;
|
|
}
|
|
.item-left { flex:1;
|
|
}
|
|
.date { color:#999; font-size: 0.75rem;
|
|
}
|
|
.name { color:#333; margin: 0.125rem 0; font-weight: 600;
|
|
}
|
|
.no { color:#bbb; font-size: 0.6875rem;
|
|
}
|
|
.amount { color:#333; font-weight: 700;
|
|
}
|
|
.arrow { color:#ccc; font-size: 1.25rem; margin-left: 0.25rem;
|
|
}
|
|
.empty { height: 50vh; display:flex; align-items:center; justify-content:center; color:#999;
|
|
}
|
|
.fab { position: fixed; right: 0.9375rem; bottom: 3.75rem; width: 3.125rem; height: 3.125rem; background:#18b566; color:#fff; border-radius: 1.5625rem; text-align:center; line-height: 3.125rem; font-size: 1.5rem; box-shadow: 0 0.25rem 0.625rem rgba(0,0,0,0.15);
|
|
}
|