dootask/resources/assets/sass/pages/page-review.scss
2023-04-12 16:41:11 +08:00

232 lines
8.6 KiB
SCSS
Vendored

.page-review{
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
.review-wrapper {
flex: 1;
height: 0;
display: flex;
flex-direction: column;
position: relative;
.review-head {
display: flex;
align-items: center;
padding-bottom: 16px;
margin: 32px 32px 16px;
border-bottom: 1px solid #F4F4F5;
.review-nav{
flex: 1;
display: flex;
align-items: center;
> h1 {
color: $primary-title-color;
font-size: 28px;
font-weight: 600;
}
}
}
.review-main{
display: flex;
flex: 1 1 auto;
margin: 0 32px;
position: relative;
.review-main-left{
display: flex;
flex-direction: column;
flex: 0 0 auto;
width: 360px;
position: absolute;
left: 0;
top: 0;
bottom: 12px;
.review-main-search{
display: flex;
justify-content: space-between;
> div{
.ivu-dropdown{
margin-right: 8px;
}
}
}
.review-main-list{
display: flex;
flex-direction: column;
flex: 1 1 auto;
overflow: scroll;
.review-list{
margin-top: 8px;
padding: 12px;
border-radius: 8px;
border: 1px solid #eeeeee;
transition: box-shadow 0.3s;
cursor: pointer;
&:hover{
box-shadow: 0 0 10px #e6ecfa;
}
> h2{
display: flex;
align-items: center;
justify-content: space-between;
> .list-name{
font-size: 16px;
font-weight: bold;
}
}
> p{
font-size: 14px;
margin-top: 8px;
> span{
color: #303133;
}
}
.list-member{
display: flex;
align-items: center;
justify-content: space-between;
margin-top: 8px;
> span {
display: flex;
align-items: center;
font-size: 12px;
.ivu-avatar {
margin-right: 8px;
}
}
}
}
.review-list-active{
border: 1px solid #8bcf70;
}
}
.review-main-list::-webkit-scrollbar {
display: none;
}
}
.review-main-right{
position: absolute;
left: 360px;
top: 0;
right: 0;
bottom: 0;
flex: 1 1 auto;
display: flex;
margin: 0 0 12px 12px;
.review-details{
flex: 1 1 auto;
display: flex;
flex-direction: column;
border-radius: 8px;
border: 1px solid #eeeeee;
.review-details-box{
flex: 1 1 auto;
padding: 24px;
overflow-y: scroll;
.review-details-title{
display: flex;
align-items: center;
.ivu-tag{
margin-left: 8px;
}
}
.review-details-subtitle{
margin-top: 16px;
display: flex;
.ivu-avatar{
margin-right: 8px;
}
> span{
font-size: 14px;
}
}
.review-details-text{
margin-bottom: 16px;
> h4{
color: #999;
}
> p{
font-size: 16px;
margin-top: 4px;
font-weight: 500;
}
}
.review-details-text:nth-last-child(1){
margin-bottom: 0;
}
.review-details-process{
display: flex;
flex-direction: column;
margin-top: 16px;
position: relative;
.review-details-line{
position: absolute;
left: 23px;
top: 5px;
bottom: 5px;
width: 3px;
background: #19be6b;
z-index: 1;
}
.review-process{
display: flex;
justify-content: space-between;
position: relative;
z-index: 2;
margin-bottom: 32px;
.review-process-left{
display: flex;
align-items: center;
.review-process-text{
display: flex;
flex-direction: column;
margin-left: 8px;
.review-process-name{
margin-bottom: 4px;
}
.review-process-state{
font-size: 16px;
color: #19be6b;
font-weight: 500;
}
}
}
}
.review-process:nth-last-child(1){
margin-bottom: 0;
}
}
.review-copy{
margin-top: 8px;
padding-left: 56px;
display: flex;
.review-copy-member{
display: flex;
align-items: center;
background: #F4F4F5;
padding:4px 8px;
border-radius: 20px;
.ivu-avatar{
margin-right: 4px;
}
}
}
}
.review-details-box::-webkit-scrollbar {
display: none;
}
.review-operation{
flex: 0 0 auto;
height: 60px;
padding: 0 24px;
border-top: 1px solid #F4F4F5;
display: flex;
align-items: center;
}
}
}
}
}
}