/* pages/record/record.wxss */ page { background: #ffffff; } .containerBox { width: 100%; height: calc(100vh - 40rpx); background: #ffffff; border-radius: 36rpx; box-shadow: 0 0 20rpx 0 rgba(158, 158, 158, 0.1); } .bigTabBar { width: 100%; height: 100rpx; display: flex; justify-content: space-evenly; background: #FFFFFF; } .bigTabBarBtn { position: relative; padding: 0 20rpx; width: fit-content; height: 100%; font-family: "苹方M"; font-size: 32rpx; color: #A1A5B6; display: flex; align-items: center; justify-content: center; transition: all 0.1s; } .bigTabBarBtnActive { color: #4686F6; } .bigTabBarBtn>.bigTabBarBtnborder { position: absolute; bottom: 15rpx; width: 0; height: 8rpx; border-radius: 4rpx; background: #4686F6; transition: all 0.2s; } .bigTabBarBtnActive>.bigTabBarBtnborder { width: 60rpx; } .tabbar { padding: 20rpx 0; width: 100%; height: 65rpx; display: flex; justify-content: space-evenly; background: #FFFFFF; box-shadow: 0px 6rpx 6rpx -3rpx #daddf4; } .tabbarBtn { padding: 0 20rpx; min-width: 130rpx; height: 65rpx; color: #5E5E5E; font-family: "苹方R"; font-size: 24rpx; border-radius: 33rpx; background: #ECEDF6; display: flex; align-items: center; justify-content: center; transition: all 0.2s; } .tabbarBtnActive { color: #FFFFFF; background: #4686F6; } .content { width: 100%; height: calc(100vh - 205rpx); } .lists-container { width: 100%; height: 100%; } .typeOne { padding: 20rpx; margin: 0rpx 30rpx 40rpx 30rpx; width: calc(100% - 60rpx); background: #ffffff; border: 0.5px solid #dfdfdf; border-radius: 20rpx; box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.20); box-sizing: border-box; } .typeOneActive { opacity: 0.6; } .typeOne:nth-child(1) { margin-top: 0; } .typeOne>.list1 { padding: 0 20rpx; width: calc(100% - 40rpx); height: 40rpx; display: flex; align-items: center; justify-content: space-between; } .typeOne>.list1>.label { font-family: "苹方R"; font-size: 28rpx; color: #5E5E5E; } .typeOne>.list1Warning>.label>span { color: #FF9200; } .typeOne>.list1Success>.label>span { color: #02C3CA; } .typeOne>.list1>.value { width: 120rpx; height: 50rpx; border-radius: 10rpx; font-family: "苹方R"; font-size: 26rpx; color: #ffffff; display: flex; align-items: center; justify-content: center; background: #CCCCCC; } .typeOne>.list1Warning>.value { background: #FF9200; } .typeOne>.list1Success>.value { background: #02C3CA; } .typeOne>.list2 { padding: 20rpx; width: 100%; background: #f2f8ff; border-radius: 6rpx; box-sizing: border-box; } .typeOne>.no-margin { margin-top: 0rpx; } .typeOne>.list2>.item { padding: 10rpx 0; width: 100%; display: flex; align-items: flex-start; } .typeOne>.list2>.item>.label { width: 140rpx; font-family: "苹方R"; font-size: 26rpx; color: #5E5E5E; } .typeOne>.list2>.item>.value { width: 0; flex: 1; font-family: "苹方R"; font-size: 28rpx; color: #348BFF; } .typeOne>.list2none>.item>.value { color: #666666; } .typeTwo { padding: 20rpx; margin: 0rpx 30rpx 40rpx 30rpx; width: calc(100% - 60rpx); background: #ffffff; border: 0.5px solid #dfdfdf; border-radius: 20rpx; box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.20); box-sizing: border-box; } .typeTwo>.list2 { padding: 20rpx; width: 100%; background: #f2f8ff; border-radius: 6rpx; box-sizing: border-box; } .typeTwo>.list2>.item { padding: 10rpx 0; width: 100%; display: flex; align-items: flex-start; } .typeTwo>.list2>.item>.label { width: 140rpx; font-family: "苹方R"; font-size: 26rpx; color: #5E5E5E; } .typeTwo>.list2>.item>.value { width: 0; flex: 1; font-family: "苹方R"; font-size: 28rpx; color: #666666; } .typeTwo>.list2>.item>.tip { padding: 0 20rpx; min-width: 80rpx; height: 50rpx; display: flex; align-items: center; justify-content: center; font-family: "苹方R"; font-size: 26rpx; color: #ffffff; background: #CCCCCC; border-radius: 3px; } .typeTwo>.list1Warning>.item>.tip { background: #FF9200; } .typeTwo>.list1Warning>.item>.value, .typeTwo>.list1Warning>.item>.value { color: #348BFF; } .typeTwo>.list1Success>.item>.tip { background: #02C3CA; } .typeTwo>.list1Error>.item>.tip { background: #ff5500; } .nonejilu { width: 100%; height: calc(100% - 200rpx); display: flex; align-items: center; justify-content: center; } .nonejilu>image { margin: auto; width: 50%; height: auto; }