.item { display: flex; margin: 30rpx; } .item .icon { display: inline-block; margin-right: 30rpx; } .icon { position: relative; width: 80rpx; height: 80rpx; } .icon image { width: 80rpx; height: 80rpx; } .item .content { display: inline-block; min-height: 80rpx; max-width: calc(100% - 80rpx); overflow: hidden; } .content .text { display: flex; align-items: center; margin-bottom: 40rpx; } .content text { font-size: 30rpx; } .content view.media { margin-bottom: 40rpx; } view.splitline { width: 90%; border-top: 1px dotted #ccc; height: 40rpx; } text.secondary { font-size: 25rpx; color: #666; } view.suggestion { background-color: #f0f0f0; height: 68rpx; border-radius: 30rpx; color: #ef4823; font-size: 28rpx; margin-bottom: 10rpx; width: 400rpx; padding-left: 30rpx; display: flex; align-items: center; } .green { color: #ef4823; } .item.prompt { display: flex; justify-content: flex-end; } .content.prompt view.text { background-color: #ef4823; color: #fff; border-radius: 40rpx; height: 80rpx; padding-left: 30rpx; padding-right: 30rpx; } view.text.margin-bottom-10 { margin-bottom: 10rpx; } view.text.bold { font-weight: bold; }