odd_job/public/static/mobile/css/style.css

body {
    --red:#e54d42;
    --pink:#FF589B;
    --blue: #0081ff;
    --green: #39b54a;
    --gray: #aaa;
    --grey: #666;
    --orange: #f37b1d;
    background:#f8f9fb;
    font-family: "Microsoft Yahei",arial,"Hiragino Sans GB","Hiragino Sans GB W3",宋体,simsun;
    color:#333;
}

html {
    box-sizing: border-box;
}
*, *:before, *:after {
    box-sizing: inherit;
}

.lw-title {margin: 0;padding:16px;color:#969799;font-weight: 400;font-size: 14px;line-height: 16px;}

.nav-theme,.nav-theme .van-nav-bar{background:var(--blue);}
.nav-theme .van-nav-bar__title,.nav-theme .van-nav-bar__text,.nav-theme .van-icon{color:white;}
.van-swipe {background:white;}

.article-list article{box-shadow:0 0 6px rgba(0, 0, 0, 0.028), 0 0 18px rgba(0, 0, 0, 0.042), 0 0 80px rgba(0, 0, 0, 0.07);border-radius: 5px;width:95%;height:110px;margin:10px auto;display:flex;align-items:center;background:white;padding:5px 10px;}
.article-list article .s-left {height:90px;display:flex;flex-direction:column;width: 100%;}
.article-list article .s-left.image {width: calc(100% - 120px);}
.article-list article .s-left .s-title{font-size: 16px;text-overflow: ellipsis;display: -webkit-box;overflow: hidden;-webkit-box-orient: vertical;-webkit-line-clamp: 3;text-align:left;}
.article-list article .s-left .s-time{font-size: 12px;color:#999;margin-top:auto;}
.article-list article .s-right {width:110px;margin-left:auto;}

.income-list {display: block;overflow: hidden;box-sizing: border-box;}
.income-list .income-item {position: relative;display: flex;padding: 0 15px;min-height: 50px;background-color: #ffffff;justify-content: space-between;align-items: center;transition: all .6s ease-in-out 0s;-webkit-transform: translateX(0px);transform: translateX(0px);box-sizing: border-box;}
.income-list .income-item .left {font-size: 15px;line-height: 1.6em;flex: 1;padding-top: 10px;padding-bottom: 10px;padding-right: 10px;box-sizing: border-box;}
.income-list .income-item .left .time {color: #aaaaaa;font-size: 12px;}
.income-list .income-item .left .comment {color: #aaaaaa;font-size: 12px;}
.income-list .income-item .right {color: #e54d42;}
.income-list .income-item .right .text {color: #0081ff;text-align:right;}
.income-list .income-item .right .money {color: #e54d42;}

.resume-list .resume-item{background:white;margin-top:10px;padding:10px 20px;}
.resume-list .resume-item .title{display:flex;padding-bottom:10px;border-bottom:1px solid #eee;}
.resume-list .resume-item .title .name {width:calc(100% - 70px);}
.resume-list .resume-item .title .name .mobile {font-size:14px;}
.resume-list .resume-item .title .status {width:70px;text-align:center;font-size:14px;color:var(--blue);}
.resume-list .resume-item .content {padding:10px 0;}
.resume-list .resume-item .content .remark {padding-bottom:5px;color:var(--orange);}
.resume-list .resume-item .content .time {color:var(--gray);font-size:14px;}
.resume-list .resume-item .tool {display:flex;align-items:center;justify-content:flex-end;}
.resume-list .resume-item .tool .van-tag{margin-left:10px;}

.recruit-list .recruit-item {background:white;margin-top:10px;padding:10px 20px;}
.recruit-list .recruit-item .title{display:flex;padding-bottom:10px;border-bottom:1px solid #eee;}
.recruit-list .recruit-item .title .title-name {width:calc(100% - 110px);}
.recruit-list .recruit-item .title .salary {width:110px;text-align:center;color:var(--red);display: flex;align-items: center;justify-content: flex-end;}
.recruit-list .recruit-item .title .salary span {margin-left:5px;}
.recruit-list .recruit-item .content {display:flex;align-items:center;justify-content:center;padding-top:10px;}
.recruit-list .recruit-item .content .content-item {text-align:left;flex:1;display:flex;align-items:center;justify-content:flex-start;height:30px;}
.recruit-list .recruit-item .tags {padding:5px 0;}
.recruit-list .recruit-item .tags .van-tag{margin-right:5px;}
.recruit-list .recruit-item .bottom {border-top:1px solid #eee;margin-top:10px;display:flex;padding-top:10px;font-size:14px;color:#666;}
.recruit-list .recruit-item .bottom .company-name{width:calc(100% - 80px);}
.recruit-list .recruit-item .bottom .volume{width:80px;display:flex;align-items:center;justify-content:flex-end;}

.report-list .report-item {background:white;margin-top:10px;padding:0 20px;}
.report-list .report-item .header {display: flex;padding:10px 0;border-bottom:1px solid #eee;justify-content: space-between;}
.report-list .report-item .header .title {color:#000;font-weight:bold;}
.report-list .report-item .header .status {color:var(--red);font-size:14px;width: 50px;text-align: right;}
.report-list .report-item .content {font-size:14px;padding:10px 0;border-bottom:1px solid #eee;}
.report-list .report-item .user-info {color:var(--red);font-size:16px;}
.report-list .report-item .other-info {color:#999;margin-top:2px;}
.report-list .report-item .tool {display: flex;padding:10px 0;border-bottom:1px solid #eee;justify-content: flex-end;font-size:14px;}
.report-list .report-item .tool .van-tag {margin-left:10px;}

.broker-list .broker-item {background:white;margin-top:10px;padding:10px 20px;}
.broker-list .broker-item .header {padding-bottom:10px;border-bottom:1px solid #eee;color:#000;font-weight:bold;}
.broker-list .broker-item .content {padding-top:10px;display:flex;justify-content:space-between;align-items:center;}
.broker-list .broker-item .content .region,.broker-list .broker-item .content .phone {display:flex;align-items:center;}
.broker-list .broker-item .content .region .region-name {margin-left:5px;}