page { display: flex; flex-direction: column; background: #ECFAF7; } .container { width: 100%; display: block; background: #ECFAF7; } .item { margin-top: 30rpx; width: 750rpx; background: #FBFDFC; border-radius: 24rpx; display: flex; flex-direction: column; } .item-problem { padding: 30rpx; font-weight: 500; font-size: 32rpx; color: #333333; } .item-problem-sub { padding: 0 30rpx 30rpx; font-size: 28rpx; font-weight: 300; color: #333333; } .item-border { width: 92%; height: 1rpx; margin: 0 auto; background: #E8F1EE; } .item-problem-input-view { display: flex; flex-direction: row; padding: 0 30rpx 30rpx; align-items: center; flex-wrap: nowrap; } .item-problem-input-title { font-size: 28rpx; color: #333333; font-weight: 300; } .item-problem-input-line { height: 30rpx; width: 1rpx; margin: 0 10rpx; background: #6BDBCB; } .item-problem-input { background: none; border: none; color: #333333; flex: 1; font-size: 28rpx; } .date-show-view { display: flex; padding: 30rpx; flex-direction: row; align-items: center; } .show-date-title { flex: 1; font-size: 28rpx; color: #666666; } .date-show-view:active { background: #effaf8; opacity: 0.7; } .radio-view { width: 100vw; display: flex; margin-top: 30rpx; flex-direction: row; align-items: center; } .radio-icon { width: 36rpx; margin-left: 10rpx; height: 36rpx; } .radio-title { font-size: 28rpx; margin: 0 20rpx; } .radio-list { padding-bottom: 30rpx; } .van-field { --cell-icon-size: 16px; --cell-icon-size: var(--field-icon-size, 16px); } .van-datetime-picker { border-radius: 24rpx 24rpx 0px 0px !important; overflow: hidden; background-color: #f0f0f0; } .van-picker { border-radius: 24rpx 24rpx 0px 0px !important; overflow: hidden; background: white !important; } .toolbar-class { border-radius: 24rpx 24rpx 0px 0px !important; overflow: hidden; background: #ECFAF7 !important; } .van-picker__confirm { padding: 0 !important; margin: 0 16px; font-size: 28rpx !important; color: #0BC3AA !important; } .van-picker__cancel { padding: 0 !important; margin: 0 16px; font-size: 28rpx !important; color: #666666 !important; } .custom-date-class { position: fixed; box-sizing: border-box; max-height: 100%; overflow-y: auto; transition-timing-function: ease; -webkit-animation: ease both; animation: ease both; -webkit-overflow-scrolling: touch; background-color: white !important; border-radius: 24rpx 24rpx 0px 0px !important; overflow: hidden; } .van-picker-column__item { color: #666666 !important; font-size: 32rpx !important; } .van-picker-column__item--selected { color: #333333 !important; font-size: 40rpx !important; } .bottom-view { width: 100vw; display: flex; height: 240rpx; flex-direction: column; align-items: center; } .bottom-view-privacy { width: 100vw; display: flex; margin-top: 42rpx; justify-content: center; flex-direction: row; align-items: center; } .privacy-checkbox { display: flex; flex-direction: row; align-items: center; } .privacy-checkbox-icon { width: 36rpx; height: 36rpx; } .privacy-detail-btn { font-size: 24rpx; margin-left: 16rpx; color: #888888; } .privacy-detail-btn_tk { font-size: 24rpx; color: #0BC3AA; } .commit-btn { line-height: 90rpx; border-radius: 45rpx; text-align: center; width: calc(100% - 120rpx); color: #FFFFFF; font-size: 32rpx; margin: 30rpx auto 0 auto; background: linear-gradient(278deg, #0ABCA4 0%, rgba(11, 195, 170, 0.8) 100%); } .commit-btn:active { opacity: 0.7; } .modal-content { background-color: #fff; margin: 5% auto; width: 90%; /* 根据需要调整 */ height: 90%; max-width: 600px; /* 限定最大宽度 */ box-sizing: border-box; } .modal-close { position: absolute; top: 0px; right: 0px; font-size: 24px; cursor: pointer; } .modal-close image { width: 20px; height: 20px; } .close-modal-btn { line-height: 90rpx; border-radius: 45rpx; text-align: center; width: calc(100% - 120rpx); color: #FFFFFF; font-size: 32rpx; margin: 30rpx auto 0 auto; background: linear-gradient(278deg, #0ABCA4 0%, rgba(11, 195, 170, 0.8) 100%); } .resultsAreShown-view { display: flex; flex-direction: column; align-items: center; } .resultsAreShown-content { width: 640rpx; margin-bottom: 30rpx; min-height: 516rpx; background: #FFFFFF; border-radius: 32rpx; overflow: hidden; display: flex; flex-direction: column; } .resultsAreShown-content-top { background: #23C983; width: 100%; position: relative; height: 186rpx; display: flex; justify-content: space-between; flex-direction: row; } .resultsAreShown-content-title { color: #FFFFFF; font-size: 36rpx; font-weight: bold; margin-top: 64rpx; position: absolute; margin-left: 40rpx; } .resultsAreShown-content-icon { width: 96rpx; margin-top: 52rpx; margin-right: 44rpx; height: 108rpx; } .resultsAreShown-content-bg { width: 100%; height: 186rpx; } .resultsAreShown-content-h { display: flex; flex-direction: row; align-items: baseline; width: 100%; } .resultsAreShown-content-desc { font-size: 28rpx; margin-left: 40rpx; margin-top: 30rpx; color: #333333; } .resultsAreShown-content-score { font-weight: 700; color: #1AC57D; font-size: 60rpx; } .resultsAreShown-content-units { font-size: 28rpx; color: #1AC57D; } .resultsAreShown-content-score-view { display: flex; flex-direction: row; margin-top: 22rpx; margin-left: 24rpx; align-items: center; width: calc(100% - 48rpx); } .resultsAreShown-content-score-item { flex: 1; display: flex; flex-direction: column; align-items: center; } .resultsAreShown-content-score-icon { width: 24rpx; opacity: 0; height: 16rpx; } .resultsAreShown-content-score-line { width: calc(100% - 32rpx); height: 12rpx; margin-top: 20rpx; border-radius: 12rpx; } .resultsAreShown-content-score-desc { font-size: 24rpx; margin-top: 16rpx; line-height: 32rpx; color: #666666; } .resultsAreShown-content-score-desc.active { color: #333333; margin-top: 16rpx; line-height: 32rpx; font-size: 28rpx; } .tips { margin: 20rpx auto; padding: 20rpx 35rpx; width: 600rpx; font-size: 24rpx; line-height: 40rpx; background: white; color: #5A5A5A; box-shadow: 4rpx 4rpx 0 #BAE2E0; } .resultsAreShown-content-tips { color: #888888; margin: 30rpx; font-size: 20rpx; }